root / snf-cyclades-app / synnefo / ui / new_ui / ui / sass / _overlays.scss @ 97cd255d
History | View | Annotate | Download (4.1 kB)
1 | ca3c8b6e | Athina Bekakou | /* |
---|---|---|---|
2 | 673ea014 | Olga Brani | |
3 | 15948f00 | Olga Brani | Overlays (Todo: clean up) |
4 | 15948f00 | Olga Brani | |
5 | 15948f00 | Olga Brani | */ |
6 | bb8cc1dc | Olga Brani | body.with-overlay { |
7 | ceaaa3be | Olga Brani | background:$overlay-bg-color; |
8 | 2469dab6 | Olga Brani | .main { |
9 | 2469dab6 | Olga Brani | opacity:0; |
10 | 2469dab6 | Olga Brani | } |
11 | bb8cc1dc | Olga Brani | } |
12 | 673ea014 | Olga Brani | |
13 | 673ea014 | Olga Brani | |
14 | f50cc12b | Olga Brani | .body-wrapper { |
15 | 3fba84bf | Olga Brani | position: relative; |
16 | 96e40ea0 | Olga Brani | left:0; |
17 | 96e40ea0 | Olga Brani | top:0; |
18 | 6e73603a | Athina Bekakou | .welcome { |
19 | 3fba84bf | Olga Brani | display:none; |
20 | 17ce081a | Olga Brani | } |
21 | 1fda8642 | Olga Brani | &.no-vm { |
22 | 1fda8642 | Olga Brani | background:url(../images/draw-welcome.png) no-repeat center 50px $secondary-color; |
23 | 1fda8642 | Olga Brani | .welcome { |
24 | 1fda8642 | Olga Brani | display:none; |
25 | 1fda8642 | Olga Brani | color:#fff; |
26 | 1fda8642 | Olga Brani | text-align:center; |
27 | 1fda8642 | Olga Brani | position: relative; |
28 | 1fda8642 | Olga Brani | top:-15px; |
29 | 1fda8642 | Olga Brani | left:75px; |
30 | 1fda8642 | Olga Brani | display:block; |
31 | 3fba84bf | Olga Brani | } |
32 | 1fda8642 | Olga Brani | } |
33 | 1fda8642 | Olga Brani | .reveal-modal { |
34 | 1fda8642 | Olga Brani | padding:65px 140px 40px; |
35 | 1fda8642 | Olga Brani | h3 { |
36 | 1fda8642 | Olga Brani | font-size:1em; |
37 | 1fda8642 | Olga Brani | } |
38 | 1fda8642 | Olga Brani | p { |
39 | 1fda8642 | Olga Brani | color: white; |
40 | 1fda8642 | Olga Brani | text-align: center; |
41 | 1fda8642 | Olga Brani | &.message-forimg { |
42 | 1fda8642 | Olga Brani | margin-top:132px; |
43 | 1fda8642 | Olga Brani | margin-bottom: 35px; // 20px from background icon |
44 | 1fda8642 | Olga Brani | } |
45 | 1fda8642 | Olga Brani | &.buttons { |
46 | 1fda8642 | Olga Brani | a:first-child { |
47 | 1fda8642 | Olga Brani | margin-right:25px; |
48 | 937c0d49 | Athina Bekakou | } |
49 | 1fda8642 | Olga Brani | } |
50 | 1fda8642 | Olga Brani | } |
51 | 1fda8642 | Olga Brani | &#start-confirm { |
52 | 1fda8642 | Olga Brani | background: $secondary-color url('../images/shutdown.png') no-repeat center 50px; //55px from top |
53 | 1fda8642 | Olga Brani | } |
54 | 1fda8642 | Olga Brani | &#reboot-confirm { |
55 | 1fda8642 | Olga Brani | background: #ff7049 url('../images/restart.png') no-repeat center 50px; |
56 | 1fda8642 | Olga Brani | .btn4 { |
57 | 1fda8642 | Olga Brani | background-color: #ff7049; |
58 | 1fda8642 | Olga Brani | border-color: white; |
59 | 1fda8642 | Olga Brani | &:hover { |
60 | 1fda8642 | Olga Brani | color: #ff7049; |
61 | 1fda8642 | Olga Brani | background-color: white; |
62 | 1fda8642 | Olga Brani | border-color: #ff7049; |
63 | 6e73603a | Athina Bekakou | } |
64 | f5b4165a | Athina Bekakou | } |
65 | 1fda8642 | Olga Brani | } |
66 | 1fda8642 | Olga Brani | &#shutdown-confirm { |
67 | 1fda8642 | Olga Brani | background: #ff7049 url('../images/shutdown.png') no-repeat center 50px; //55px from top |
68 | 1fda8642 | Olga Brani | .btn4 { |
69 | 6e73603a | Athina Bekakou | background-color: #ff7049; |
70 | 6e73603a | Athina Bekakou | border-color: white; |
71 | 6e73603a | Athina Bekakou | &:hover { |
72 | 1fda8642 | Olga Brani | color: #ff7049; |
73 | 1fda8642 | Olga Brani | background-color: white; |
74 | 1fda8642 | Olga Brani | border-color: #ff7049; |
75 | 3fba84bf | Olga Brani | } |
76 | 3fba84bf | Olga Brani | } |
77 | 1fda8642 | Olga Brani | } |
78 | 1fda8642 | Olga Brani | &#destroy-vm-confirm { |
79 | 1fda8642 | Olga Brani | background: #d7145a url('../images/destroy-vm.png') no-repeat center 46px; //55px from top |
80 | 1fda8642 | Olga Brani | .btn4 { |
81 | 1fda8642 | Olga Brani | background-color: #d7145a; |
82 | 1fda8642 | Olga Brani | border-color: white; |
83 | 1fda8642 | Olga Brani | &:hover { |
84 | 1fda8642 | Olga Brani | color: #d7145a; |
85 | 1fda8642 | Olga Brani | background-color: white; |
86 | 1fda8642 | Olga Brani | border-color: #d7145a; |
87 | 3fba84bf | Olga Brani | } |
88 | 6e73603a | Athina Bekakou | } |
89 | 1fda8642 | Olga Brani | } |
90 | 1fda8642 | Olga Brani | &#destroy-network-confirm { |
91 | 1fda8642 | Olga Brani | background: #d7145a url('../images/destroy-network-1.png') no-repeat center 50px; //55px from top |
92 | 1fda8642 | Olga Brani | .btn4 { |
93 | 1fda8642 | Olga Brani | background-color: #d7145a; |
94 | 1fda8642 | Olga Brani | border-color: white; |
95 | 1fda8642 | Olga Brani | &:hover { |
96 | 1fda8642 | Olga Brani | color: #d7145a; |
97 | 1fda8642 | Olga Brani | background-color: white; |
98 | 1fda8642 | Olga Brani | border-color: #d7145a; |
99 | 3fba84bf | Olga Brani | } |
100 | 6e73603a | Athina Bekakou | } |
101 | 1fda8642 | Olga Brani | } |
102 | 1fda8642 | Olga Brani | &#destroy-disk-confirm { |
103 | 1fda8642 | Olga Brani | background: #d7145a url('../images/destroy-disk.png') no-repeat center 50px; //55px from top |
104 | 1fda8642 | Olga Brani | .btn4 { |
105 | 1fda8642 | Olga Brani | background-color: #d7145a; |
106 | 1fda8642 | Olga Brani | border-color: white; |
107 | 1fda8642 | Olga Brani | &:hover { |
108 | 1fda8642 | Olga Brani | color: #d7145a; |
109 | 1fda8642 | Olga Brani | background-color: white; |
110 | 1fda8642 | Olga Brani | border-color: #d7145a; |
111 | 3fba84bf | Olga Brani | } |
112 | 6e73603a | Athina Bekakou | } |
113 | 6e73603a | Athina Bekakou | |
114 | 1fda8642 | Olga Brani | } |
115 | 112e5dd2 | Athina Bekakou | &#vm-connect, &.remove { |
116 | 1fda8642 | Olga Brani | p { |
117 | 1fda8642 | Olga Brani | text-align:left; |
118 | 1fda8642 | Olga Brani | color: black; |
119 | 1fda8642 | Olga Brani | &.info { |
120 | 1fda8642 | Olga Brani | font-style: italic; |
121 | 261ac841 | Olga Brani | font-size:emCalc(13px); |
122 | 1fda8642 | Olga Brani | color: #9e9ea1; |
123 | 4e7c16f1 | Olga Brani | } |
124 | 1fda8642 | Olga Brani | &.ssh { |
125 | 1fda8642 | Olga Brani | text-align: center; |
126 | 1fda8642 | Olga Brani | span { |
127 | 1fda8642 | Olga Brani | display: inline; |
128 | 261ac841 | Olga Brani | padding: 10px 30px; |
129 | 261ac841 | Olga Brani | background:$secondary-color; |
130 | 261ac841 | Olga Brani | color:#fff; |
131 | 353b022b | Olga Brani | } |
132 | 353b022b | Olga Brani | } |
133 | 112e5dd2 | Athina Bekakou | &.buttons { |
134 | 112e5dd2 | Athina Bekakou | text-align: center; |
135 | 112e5dd2 | Athina Bekakou | } |
136 | 3fba84bf | Olga Brani | } |
137 | 1fda8642 | Olga Brani | .close-reveal-modal { |
138 | 1fda8642 | Olga Brani | color: $link-color; |
139 | 1fda8642 | Olga Brani | &:hover { |
140 | 1fda8642 | Olga Brani | color: $link-color-hover; |
141 | 1fda8642 | Olga Brani | } |
142 | 1fda8642 | Olga Brani | } |
143 | 3fba84bf | Olga Brani | } |
144 | 3fba84bf | Olga Brani | } |
145 | 6e73603a | Athina Bekakou | .overlay-area-custom { |
146 | 6e73603a | Athina Bekakou | display:none; |
147 | 6e73603a | Athina Bekakou | position:absolute; |
148 | 6e73603a | Athina Bekakou | left:0; |
149 | 6e73603a | Athina Bekakou | right:0; |
150 | 6e73603a | Athina Bekakou | top:-$bar-height; |
151 | 6e73603a | Athina Bekakou | width:100%; |
152 | 6e73603a | Athina Bekakou | height:100%; |
153 | ceaaa3be | Olga Brani | background:$overlay-bg-color; |
154 | 6e73603a | Athina Bekakou | z-index:20; |
155 | 6e73603a | Athina Bekakou | .overlay-div { |
156 | 6e73603a | Athina Bekakou | display: none; |
157 | 6e73603a | Athina Bekakou | z-index:50; |
158 | 6e73603a | Athina Bekakou | position: relative; |
159 | 6e73603a | Athina Bekakou | background:#fff; |
160 | 6e73603a | Athina Bekakou | top:20%; |
161 | 6e73603a | Athina Bekakou | left:25%; |
162 | 6e73603a | Athina Bekakou | width:50%; |
163 | 6e73603a | Athina Bekakou | padding:25px; |
164 | 6e73603a | Athina Bekakou | .buttons { |
165 | 6e73603a | Athina Bekakou | a { |
166 | 6e73603a | Athina Bekakou | margin-right:20px; |
167 | 3fba84bf | Olga Brani | } |
168 | 3fba84bf | Olga Brani | } |
169 | 6e73603a | Athina Bekakou | .close { |
170 | 6e73603a | Athina Bekakou | float:right; |
171 | 6e73603a | Athina Bekakou | font-size:30px; |
172 | e11021ca | Athina Bekakou | } |
173 | 6e73603a | Athina Bekakou | &.upload-widget { |
174 | 6e73603a | Athina Bekakou | background:transparent; |
175 | 6e73603a | Athina Bekakou | padding:45px 0; |
176 | 6e73603a | Athina Bekakou | width:80%; |
177 | 6e73603a | Athina Bekakou | left:10%; |
178 | 6e73603a | Athina Bekakou | border:1px solid white; |
179 | 6e73603a | Athina Bekakou | } |
180 | 3ed3ef88 | Athina Bekakou | } // end of .overlay-div |
181 | 6e73603a | Athina Bekakou | } |
182 | e11021ca | Athina Bekakou | |
183 | e5c8c342 | Olga Brani | } |
184 | 03bcb595 | Olga Brani | |
185 | 8e94f2a9 | Athina Bekakou | .communication-error { |
186 | 8e94f2a9 | Athina Bekakou | // display: none; |
187 | 8e94f2a9 | Athina Bekakou | background-color: $error-color; |
188 | 8e94f2a9 | Athina Bekakou | color: $wizard-base-font-color; |
189 | 8e94f2a9 | Athina Bekakou | position: fixed; |
190 | aafd8478 | Athina Bekakou | bottom: -151px; |
191 | aafd8478 | Athina Bekakou | left: 0px; |
192 | 8e94f2a9 | Athina Bekakou | width: 100%; |
193 | 8e94f2a9 | Athina Bekakou | padding-top: 30px; |
194 | 8e94f2a9 | Athina Bekakou | padding-bottom: 15px; |
195 | aafd8478 | Athina Bekakou | z-index: 10; |
196 | 8e94f2a9 | Athina Bekakou | p { |
197 | 8e94f2a9 | Athina Bekakou | text-align: center; |
198 | 8e94f2a9 | Athina Bekakou | line-height: 2em; |
199 | 8e94f2a9 | Athina Bekakou | margin: 0 auto; |
200 | 8e94f2a9 | Athina Bekakou | max-width: 800px; |
201 | 8e94f2a9 | Athina Bekakou | &.buttons { |
202 | 8e94f2a9 | Athina Bekakou | margin-top:10px; |
203 | 8e94f2a9 | Athina Bekakou | a:not(:first-child) { |
204 | 8e94f2a9 | Athina Bekakou | margin-left: 15px; |
205 | 8e94f2a9 | Athina Bekakou | } |
206 | 8e94f2a9 | Athina Bekakou | } |
207 | 8e94f2a9 | Athina Bekakou | } |
208 | 8e94f2a9 | Athina Bekakou | } |
209 | 6e73603a | Athina Bekakou | |
210 | 05689a8e | Olga Brani | /* Responive ------------------------------------------------ */ |
211 | 05689a8e | Olga Brani | @media only screen and (max-width: $small-mobile) { |
212 | 05689a8e | Olga Brani | } |
213 | 05689a8e | Olga Brani | |
214 | 05689a8e | Olga Brani | @media only screen and (max-width: $small-screen) { |
215 | ca3c8b6e | Athina Bekakou | .wizard { |
216 | ca3c8b6e | Athina Bekakou | .top { |
217 | ca3c8b6e | Athina Bekakou | position: static; |
218 | ca3c8b6e | Athina Bekakou | } |
219 | ca3c8b6e | Athina Bekakou | .middle { |
220 | ca3c8b6e | Athina Bekakou | padding-top:0; |
221 | ca3c8b6e | Athina Bekakou | } |
222 | ca3c8b6e | Athina Bekakou | } |
223 | f50cc12b | Olga Brani | .body-wrapper { |
224 | ca3c8b6e | Athina Bekakou | .overlay-area { |
225 | ca3c8b6e | Athina Bekakou | top:0; |
226 | ca3c8b6e | Athina Bekakou | } |
227 | ca3c8b6e | Athina Bekakou | } |
228 | 5bda20fe | Olga Brani | } |