Statistics
| Branch: | Tag: | Revision:

root / snf-cyclades-app / synnefo / ui / new_ui / ui / sass / overlay2.scss @ 0475bca1

History | View | Annotate | Download (1.7 kB)

1
ul.side-actions {
2
	position: absolute;
3
	left: 0;
4
	top: -20px;
5
	margin: 0;
6
	padding: 0;
7
	z-index: 1;
8
	li {
9
		list-style: none outside none;
10
		&>a {
11
			display: block;
12
			height: 20px;
13
			width: 20px;
14
			line-height: 20px;
15
			border-radius: 50%;
16
			border: 1px solid $inactive-color;
17
			margin-bottom: 5px;
18
			color: $inactive-color;
19
			&.details {
20
				font-size: emCalc(13px);
21
				font-weight: bold;
22
			}	
23
		}
24
		&.more-actions {
25
			&> a {
26
				line-height: 8px;
27
			}
28
			ul {
29
				display: none;
30
				position: absolute;
31
				border: 1px solid $link-color;
32
				padding: 5px 10px;
33
				text-align: left;
34
				top: 26px;
35
				left: 40px;
36
				margin: 0;
37
				background: white;
38
				a {
39
					border-radius: 0;
40
					border:0  none;
41
					width: auto;
42
					height: auto;
43
					font-size: emCalc(14px);
44
					white-space: nowrap;
45
					color: $link-color;
46

    
47
				}
48
				&:after {
49
					content: '';
50
					display: block;
51
					position: absolute;
52
					top: 23px;
53
					left: -20px;
54
					width: 0;
55
					height: 0;
56
					border-color: transparent #fff transparent transparent ;
57
					border-style: solid;
58
					border-width: 10px;
59
				}
60
				&:before {
61
					content: '';
62
					display: block;
63
					position: absolute;
64
					top: 22px;
65
					left: -22px;
66
					width: 0;
67
					height: 0;
68
					border-color: transparent $link-color transparent transparent ;
69
					border-style: solid;
70
					border-width: 11px;
71
				}
72
				&.many {
73
					top: 0px;
74
					&:after {
75
						top: 49px;
76
					}
77
					&:before {
78
						top: 48px;
79
					}
80
				}
81
			}
82
			&:hover {
83
				ul {
84
					display: block;
85
				}
86
			}
87
		}
88
	}
89
}
90

    
91
.items-list {
92
	li:hover {
93
		ul.side-actions li> a {
94
			color: $link-color;
95
			border-color: $link-color;
96
			&:hover {
97
				color: $link-color-hover;
98
				border-color: $link-color-hover;
99
			}
100
		}
101
	}
102
}