element, reset default margin
127 |
128 | i.icon {
129 | font-size: 1.5em !important;
130 | }
131 |
132 | &:not(:last-child) {
133 | margin-bottom: .2rem;
134 | }
135 | }
136 |
137 | &.boxerror {
138 | background-color: @color-message-error-background;
139 | }
140 |
141 | &.boxinformation {
142 | background-color: @color-message-background;
143 | }
144 |
145 | &.boxconfirmation {
146 | background-color: @color-message-success-background;
147 | }
148 |
149 | &.boxwarning {
150 | background-color: @color-message-warning-background;
151 | }
152 |
153 | & + table {
154 | margin-top: 1em;
155 | }
156 | }
157 |
158 | #messagestack {
159 | position: absolute;
160 | bottom: .5em;
161 | right: .7em;
162 | z-index: 102; // needs to be above .ui-widget-overlay
163 | width: 320px;
164 | height: auto;
165 | max-height: 85%;
166 |
167 | @media screen and (max-width: @screen-width-xs) {
168 | left: 0;
169 | right: 0;
170 | bottom: 0;
171 | width: auto;
172 | }
173 |
174 | div {
175 | border-color: transparent;
176 |
177 | &.voice {
178 | position: absolute;
179 | top: -1000px;
180 | }
181 |
182 | i.icon {
183 | font-size: 1.5em !important;
184 | }
185 | }
186 |
187 | .loading {
188 | background-color: @color-list-selected-background;
189 | border-color: @color-main;
190 | color: @color-main;
191 |
192 | & > i.icon:before {
193 | color: @color-main;
194 | }
195 | }
196 |
197 | .alert-info.information {
198 | color: #fff;
199 | background-color: @color-message-information;
200 |
201 | & > i.icon:before {
202 | color: #fff;
203 | }
204 | }
205 |
206 | .alert-info.notice {
207 | color: #fff;
208 | background-color: @color-taskmenu-background;
209 |
210 | & > i.icon:before {
211 | color: #fff;
212 | }
213 | }
214 |
215 | .alert-success {
216 | color: #fff;
217 | background-color: @color-message-success;
218 |
219 | & > i.icon:before {
220 | color: #fff;
221 | }
222 | }
223 |
224 | .alert-warning {
225 | background-color: @color-message-warning;
226 |
227 | & > i.icon:before {
228 | color: #fff;
229 | }
230 | }
231 |
232 | .alert-danger {
233 | color: #fff;
234 | background-color: @color-message-error;
235 |
236 | & > i.icon:before {
237 | color: #fff;
238 | }
239 | }
240 |
241 | a {
242 | color: inherit !important;
243 | text-decoration: underline;
244 | cursor: pointer;
245 | }
246 | }
247 |
--------------------------------------------------------------------------------
/styles/widgets/searchbar.less:
--------------------------------------------------------------------------------
1 | /**
2 | * Roundcube webmail styles for the Elastic skin
3 | *
4 | * Copyright (c) 2017-2018, The Roundcube Dev Team
5 | *
6 | * The contents are subject to the Creative Commons Attribution-ShareAlike
7 | * License. It is allowed to copy, distribute, transmit and to adapt the work
8 | * by keeping credits to the original authors in the README.md file.
9 | * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
10 | */
11 |
12 | /*** Searchbar and searchfilterbar widgets ***/
13 |
14 | .searchbar {
15 | position: absolute;
16 | background-color: @color-layout-header-background;
17 | right: .25rem;
18 | height: @layout-header-height;
19 | display: block !important;
20 |
21 | a.button {
22 | min-width: auto;
23 | padding: 0;
24 | display: block;
25 |
26 | &:before {
27 | line-height: @layout-header-height;
28 | }
29 | }
30 |
31 | .input-group {
32 | margin-top: calc(@layout-header-height/2 - 2.25rem/2);
33 | display: none;
34 | padding: 0 .5rem;
35 |
36 | .icon:before {
37 | font-size: 1em;
38 | line-height: 1.1;
39 | }
40 |
41 | .icon.filter,
42 | .icon.search {
43 | color: #888;
44 | }
45 | }
46 |
47 | form {
48 | display: none;
49 | }
50 |
51 | a.icon {
52 | &:before {
53 | &:extend(.font-icon-class);
54 | margin: 0;
55 | }
56 |
57 | &.reset:before {
58 | content: @fa-var-trash-alt;
59 | }
60 | &.options:before {
61 | content: @fa-var-angle-down;
62 | }
63 | }
64 |
65 | &.active a.button.search {
66 | color: @color-searchbar-icon-active;
67 | }
68 |
69 | &.open {
70 | z-index: 10;
71 | left: 0 !important;
72 | right: 0 !important;
73 |
74 | .input-group {
75 | display: flex;
76 | }
77 |
78 | form {
79 | display: flex;
80 | }
81 |
82 | a.button.filter,
83 | a.button.search {
84 | display: none;
85 | }
86 | }
87 | }
88 |
89 | .searchfilterbar {
90 | right: @layout-touch-icon-width + .25rem;
91 |
92 | &.active a.button.filter {
93 | color: @color-searchbar-icon-active;
94 | }
95 | }
96 |
97 | html.ie11 {
98 | .searchbar {
99 | a.button.filter:before,
100 | a.button.search:before {
101 | line-height: 3.2;
102 | font-size: 1.25rem;
103 | }
104 | }
105 | }
106 |
--------------------------------------------------------------------------------
/styles/widgets/taskmenu.less:
--------------------------------------------------------------------------------
1 | /**
2 | * Roundcube webmail styles for the Elastic skin
3 | *
4 | * Copyright (c) 2017-2018, The Roundcube Dev Team
5 | *
6 | * The contents are subject to the Creative Commons Attribution-ShareAlike
7 | * License. It is allowed to copy, distribute, transmit and to adapt the work
8 | * by keeping credits to the original authors in the README.md file.
9 | * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
10 | */
11 |
12 | /*** Taskmenu ***/
13 |
14 | #taskmenu {
15 | height: 100%;
16 |
17 | a {
18 | .overflow-ellipsis;
19 | text-decoration: none;
20 | display: block;
21 |
22 | &:before {
23 | &:extend(.font-icon-class);
24 | }
25 |
26 | &.mail:before {
27 | content: @fa-var-envelope;
28 | }
29 | &.addressbook:before {
30 | content: @fa-var-user;
31 | }
32 | &.settings:before {
33 | content: @fa-var-sliders-h;
34 | }
35 | &.help:before {
36 | content: @fa-var-life-ring;
37 | }
38 | &.logout:before {
39 | content: @fa-var-power-off;
40 | }
41 | &.about:before {
42 | content: @fa-var-question;
43 | }
44 | &.refresh:before {
45 | content: @fa-var-sync;
46 | }
47 | &.compose:before {
48 | content: @fa-var-edit;
49 | }
50 | &.calendar:before {
51 | content: @fa-var-calendar-alt;
52 | }
53 | &.tasklist:before {
54 | content: @fa-var-tasks;
55 | }
56 | &.files:before {
57 | content: @fa-var-folder;
58 | }
59 | &.notes:before {
60 | content: @fa-var-sticky-note;
61 | }
62 | }
63 |
64 | a.logout {
65 | color: @color-taskmenu-button-logout-hover !important;
66 | }
67 |
68 | @media screen and (max-width: @screen-width-xs) {
69 | z-index: 30001; // because autocompletion popup uses z-index:30000
70 | overflow-x: hidden;
71 |
72 | a {
73 | width: 100%;
74 | padding: 0 .5em;
75 | text-align: left;
76 | line-height: @layout-touch-menu-record-height;
77 | height: @layout-touch-menu-record-height;
78 | border-bottom: 1px solid @color-list-border;
79 | color: @color-list;
80 | font-size: 1.2rem;
81 |
82 | &:before {
83 | margin-right: .5rem;
84 | }
85 | }
86 | }
87 |
88 | @media screen and (min-width: (@screen-width-xs + 1px)) {
89 | a {
90 | text-align: center;
91 | color: @color-taskmenu-button;
92 | padding: .45rem 0;
93 | width: @layout-menu-width/2;
94 | font-size: 1.2rem;
95 |
96 | &:before {
97 | display: block;
98 | height: 2.1rem;
99 | line-height: 1.5;
100 | width: @layout-menu-width/2;
101 | margin: 0;
102 | }
103 |
104 | &:hover {
105 | color: @color-taskmenu-button;
106 | background: @color-taskmenu-button-background-hover;
107 | }
108 |
109 | &.selected {
110 | color: @color-taskmenu-button-selected;
111 | background: @color-taskmenu-button-selected-background;
112 | }
113 | }
114 |
115 | .special-buttons {
116 | position: absolute;
117 | bottom: 0;
118 | left: 0;
119 | width: @layout-menu-width;
120 | }
121 |
122 | .action-buttons {
123 | a {
124 | color: @color-taskmenu-button-action-background;
125 | background: @color-taskmenu-background;
126 |
127 | &:hover {
128 | color: @color-taskmenu-button-action-hover;
129 | background: @color-taskmenu-button-action-background-hover;
130 | }
131 | }
132 | }
133 |
134 | span.inner {
135 | display: none;
136 | }
137 | }
138 |
139 | @media screen and (min-width: (@screen-width-medium + 1px)) {
140 | a {
141 | width: @layout-menu-width;
142 | height: (@layout-header-height - .05rem);
143 | font-size: 1rem;
144 |
145 | &:before {
146 | width: @layout-menu-width;
147 | height: 1.75rem;
148 | line-height: 1.5;
149 | }
150 | }
151 |
152 | .action-buttons {
153 | a {
154 | color: @color-taskmenu-button-action;
155 | background: @color-taskmenu-button-action-background;
156 | }
157 | }
158 |
159 | span.inner {
160 | display: inline;
161 | font-size: 85%;
162 | padding: 0 .1em;
163 | }
164 | }
165 | }
166 |
167 | .menu {
168 | .popover-header {
169 | @media screen and (min-width: (@screen-width-xs + 1px)) {
170 | display: none !important;
171 | }
172 | }
173 | }
174 |
--------------------------------------------------------------------------------
/styles/widgets/toolbar.less:
--------------------------------------------------------------------------------
1 | /**
2 | * Roundcube webmail styles for the Elastic skin
3 | *
4 | * Copyright (c) 2017-2018, The Roundcube Dev Team
5 | *
6 | * The contents are subject to the Creative Commons Attribution-ShareAlike
7 | * License. It is allowed to copy, distribute, transmit and to adapt the work
8 | * by keeping credits to the original authors in the README.md file.
9 | * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
10 | */
11 |
12 | /*** Toolbar widget ***/
13 |
14 | .toolbar {
15 | margin: 0;
16 | font-size: 1rem;
17 |
18 | &.listing a,
19 | a {
20 | text-decoration: none;
21 | cursor: pointer !important; // TODO: re-consider .listing class use on toolbar
22 | color: @color-toolbar-button;
23 | }
24 |
25 | a.button {
26 | display: inline-block;
27 | border: 0 !important;
28 | height: @layout-header-height;
29 | min-width: 3.5rem;
30 | max-width: 6rem;
31 | width: auto; // reset width defined for links in .listing
32 | padding: .45rem;
33 | text-align: center;
34 | text-overflow: ellipsis;
35 | overflow-x: hidden;
36 | line-height: 1.5;
37 |
38 | &:hover,
39 | &:focus {
40 | outline: 0;
41 | }
42 |
43 | &.selected {
44 | color: @color-success;
45 | }
46 |
47 | &:before {
48 | &:extend(.font-icon-class);
49 | display: inline;
50 | float: none;
51 | margin: 0;
52 | line-height: 1.75;
53 | }
54 |
55 | &.reply:before {
56 | content: @fa-var-reply;
57 | }
58 | &.reply-all:before {
59 | content: @fa-var-reply-all;
60 | }
61 | &.forward:before {
62 | content: @fa-var-share;
63 | }
64 | &.delete:before {
65 | content: @fa-var-trash-alt;
66 | }
67 | &.markmessage:before {
68 | content: @fa-var-tag;
69 | }
70 | &.more:before {
71 | content: @fa-var-ellipsis-h;
72 | }
73 | &.dropdown:before {
74 | content: @fa-var-caret-down;
75 | }
76 | &.settings:before {
77 | content: @fa-var-sliders-h;
78 | }
79 | &.create:before {
80 | content: @fa-var-plus-square;
81 | }
82 | &.move:before {
83 | content: @fa-var-arrows-alt;
84 | }
85 | &.purge:before {
86 | content: @fa-var-eraser;
87 | }
88 | &.print:before {
89 | content: @fa-var-print;
90 | }
91 | &.search:before {
92 | content: @fa-var-search;
93 | }
94 | &.upload:before,
95 | &.import:before {
96 | content: @fa-var-upload;
97 | }
98 | &.download:before,
99 | &.export:before {
100 | content: @fa-var-download;
101 | }
102 | &.compose:before {
103 | content: @fa-var-edit;
104 | }
105 | &.archive:before {
106 | content: @fa-var-archive;
107 | }
108 | &.junk:before {
109 | content: @fa-var-fire;
110 | }
111 | &.enigma:before,
112 | &.encrypt:before {
113 | content: @fa-var-lock;
114 | }
115 | &.firstpage:before {
116 | content: @fa-var-fast-backward;
117 | }
118 | &.prev:before {
119 | content: @fa-var-arrow-left;
120 | }
121 | &.next:before {
122 | content: @fa-var-arrow-right;
123 | }
124 | &.prevpage:before {
125 | content: @fa-var-backward;
126 | }
127 | &.nextpage:before {
128 | content: @fa-var-forward;
129 | }
130 | &.lastpage:before {
131 | content: @fa-var-fast-forward;
132 | }
133 | &.send:before {
134 | content: @fa-var-paper-plane;
135 | }
136 | &.back:before {
137 | content: @fa-var-arrow-left;
138 | }
139 | &.closewin:before {
140 | content: @fa-var-window-close;
141 | }
142 | &.save:before {
143 | .font-icon-regular(@fa-var-save);
144 | }
145 | &.vcard:before,
146 | &.attach:before {
147 | content: @fa-var-paperclip;
148 | }
149 | &.spellcheck:before {
150 | content: @fa-var-magic; // TODO
151 | }
152 | &.signature:before {
153 | content: @fa-var-id-card;
154 | }
155 | &.responses:before {
156 | content: @fa-var-comment;
157 | }
158 | &.select:before {
159 | .font-icon-regular(@fa-var-check-square);
160 | }
161 | &.threads:before {
162 | content: @fa-var-comments;
163 | }
164 | &.actions:before {
165 | content: @fa-var-cog;
166 | }
167 | &.refresh:before {
168 | content: @fa-var-sync;
169 | }
170 | &.addto:before {
171 | content: @fa-var-user-plus;
172 | }
173 | &.addcc:before {
174 | content: @fa-var-user-plus;
175 | }
176 | &.addbcc:before {
177 | content: @fa-var-user-plus;
178 | }
179 | &.addressbook:before {
180 | content: @fa-var-user;
181 | }
182 | &.expand:before {
183 | content: @fa-var-caret-down;
184 | }
185 | &.collapse:before {
186 | content: @fa-var-caret-up;
187 | }
188 | &.submit:before {
189 | content: @fa-var-check;
190 | }
191 | &.edit:before {
192 | content: @fa-var-pencil-alt;
193 | }
194 | &.qrcode:before {
195 | content: @fa-var-qrcode;
196 | }
197 | &.properties:before {
198 | content: @fa-var-file;
199 | }
200 | &.zoomin:before {
201 | content: @fa-var-search-plus;
202 | }
203 | &.zoomout:before {
204 | content: @fa-var-search-minus;
205 | }
206 | &.rotate:before {
207 | content: @fa-var-redo-alt;
208 | }
209 | }
210 |
211 | &:not(.popupmenu) span.inner {
212 | font-size: 90%;
213 | font-weight: normal;
214 | }
215 |
216 | .dropbutton {
217 | a.button.dropdown {
218 | font-size: 75%;
219 | overflow: hidden; // for IE11
220 |
221 | span.inner {
222 | display: none;
223 | }
224 | }
225 |
226 | a.button:first-child {
227 | padding-right: 0;
228 | }
229 | }
230 |
231 | & > .spacer {
232 | width: 1em;
233 | }
234 |
235 | &.pagenav {
236 | text-align: center;
237 | display: flex;
238 | border-bottom: 1px solid @color-layout-border;
239 | height: @layout-pagenav-height;
240 | overflow: hidden;
241 |
242 | a.button {
243 | flex-grow: 1;
244 | font-size: 80%;
245 | min-width: 2rem !important;
246 | height: @layout-pagenav-height !important;
247 | color: @color-list-pagenav;
248 | overflow: hidden;
249 |
250 | &:before {
251 | line-height: 1 !important;
252 | }
253 | }
254 |
255 | .pagenav-text {
256 | .overflow-ellipsis;
257 | flex-grow: 4;
258 | line-height: @layout-pagenav-height;
259 | font-size: 80%;
260 | color: @color-list-pagenav;
261 | white-space: nowrap;
262 | }
263 |
264 | input {
265 | width: 3rem;
266 | font-size: 90%;
267 | line-height: 1;
268 | padding: .25rem;
269 | margin: .15rem;
270 | display: inline;
271 | text-align: center;
272 | }
273 |
274 | span.inner {
275 | display: none;
276 | }
277 |
278 | &.pagenav-list {
279 | cursor: pointer;
280 |
281 | a.button {
282 | flex-grow: initial;
283 | }
284 | .pagenav-text {
285 | text-align: left;
286 | }
287 | }
288 | }
289 |
290 | &.footer {
291 | a.button:before {
292 | height: 1.75rem;
293 | float: none;
294 | display: block;
295 | width: auto;
296 | }
297 | }
298 |
299 | &.content-frame-navigation.hide-nav-buttons {
300 | a.next,
301 | a.prev {
302 | display: none;
303 | }
304 | }
305 |
306 | .listselectors {
307 | max-width: 100%;
308 | display: flex;
309 | justify-content: space-around;
310 | }
311 | }
312 |
313 |
314 | .header {
315 | a.button {
316 | color: @color-font;
317 | }
318 |
319 | .buttons {
320 | display: block;
321 |
322 | button {
323 | display: block;
324 | float: left;
325 | cursor: pointer;
326 | color: @color-toolbar-button;
327 | background-color: transparent;
328 | border: 0;
329 | padding: 0;
330 | height: @layout-touch-header-height;
331 | line-height: @layout-touch-header-height;
332 | width: 2.5em;
333 |
334 | &:before {
335 | font-size: 1.75rem;
336 | }
337 | }
338 |
339 | a.button {
340 | display: inline-block;
341 |
342 | &:before {
343 | &:extend(.font-icon-class);
344 | float: none;
345 | }
346 |
347 | &.reply:before {
348 | content: @fa-var-reply;
349 | }
350 |
351 | &.send:before {
352 | content: @fa-var-paper-plane;
353 | }
354 | }
355 | }
356 | }
357 |
358 | .popupmenu.toolbar.listing {
359 | a.button {
360 | max-width: 100%;
361 | width: 100%;
362 | text-align: left;
363 | line-height: @layout-touch-menu-record-height;
364 | height: @layout-touch-menu-record-height;
365 |
366 | &:before {
367 | display: inline-block;
368 | line-height: inherit;
369 | margin-right: .5rem;
370 | }
371 | }
372 |
373 | .dropbutton {
374 | display: flex;
375 |
376 | a.button:first-child {
377 | .overflow-ellipsis;
378 | flex: 1;
379 | }
380 |
381 | a.button.dropdown {
382 | font-size: 100%;
383 | cursor: pointer;
384 | width: auto;
385 |
386 | &:before {
387 | content: @fa-var-angle-right;
388 | margin-left: .5em;
389 | margin-right: 0;
390 | }
391 |
392 | span.inner {
393 | display: none;
394 | }
395 | }
396 | }
397 |
398 | li.spacer {
399 | display: none;
400 | }
401 |
402 | li:last-child {
403 | border: 0;
404 | }
405 | }
406 |
407 |
408 | .toolbarmenu li {
409 | &.separator {
410 | // TODO: all separator properties
411 | line-height: 1.5rem !important;
412 | font-size: .75rem !important;
413 | padding: 0 .5rem;
414 | color: @color-popover-separator;
415 | background-color: @color-popover-separator-background;
416 |
417 | label {
418 | margin: 0; // Unsets Bootstrap label margin, bug?
419 | }
420 | }
421 |
422 | &.checkbox > label {
423 | margin: 0;
424 | width: 100%;
425 |
426 | input.icon-checkbox {
427 | right: auto;
428 |
429 | & + label {
430 | left: 0;
431 | margin: 0 .2em 0 .35em;
432 | font-size: 1.1rem;
433 | }
434 | }
435 | }
436 |
437 | a {
438 | opacity: .5;
439 |
440 | &.active {
441 | opacity: 1;
442 | }
443 | }
444 |
445 | &:last-child {
446 | border-bottom: none;
447 | }
448 |
449 | a:before {
450 | &:extend(.font-icon-class);
451 | }
452 |
453 | a.print:before {
454 | content: @fa-var-print;
455 | }
456 | a.copy:before {
457 | content: @fa-var-copy;
458 | }
459 | a.move:before {
460 | content: @fa-var-arrows-alt;
461 | }
462 | a.purge:before {
463 | content: @fa-var-eraser;
464 | }
465 | a.source:before {
466 | content: @fa-var-file-code;
467 | }
468 | a.download:before {
469 | content: @fa-var-download;
470 | }
471 | a.extwin:before {
472 | content: @fa-var-external-link-square-alt;
473 | }
474 | a.create:before {
475 | content: @fa-var-plus-square;
476 | }
477 | a.edit:before {
478 | content: @fa-var-edit;
479 | }
480 | a.edit.asnew:before {
481 | content: @fa-var-pencil-alt;
482 | }
483 | a.rename:before {
484 | content: @fa-var-pencil-alt;
485 | }
486 | a.read:before {
487 | .font-icon-regular(@fa-var-star);
488 | }
489 | a.unread:before {
490 | content: @fa-var-star;
491 | }
492 | a.flag:before {
493 | content: @fa-var-flag;
494 | }
495 | a.unflag:before {
496 | .font-icon-regular(@fa-var-flag);
497 | }
498 | a.filterlink:before {
499 | content: @fa-var-filter;
500 | }
501 | a.reply.list:before,
502 | a.reply.all:before {
503 | content: @fa-var-reply-all;
504 | }
505 | a.forward:before,
506 | a.forward.bounce:before,
507 | a.forward.attachment:before,
508 | a.forward.inline:before {
509 | content: @fa-var-share;
510 | }
511 | a.download.mbox:before,
512 | a.download.eml:before,
513 | a.download.maildir:before {
514 | content: @fa-var-download;
515 | }
516 | a.export.selection:before,
517 | a.export.all:before {
518 | content: @fa-var-download;
519 | }
520 | a.select.all:before {
521 | .font-icon-regular(@fa-var-check-square);
522 | }
523 | a.select.none:before {
524 | content: @fa-var-times;
525 | }
526 | a.select.page:before {
527 | content: @fa-var-bars;
528 | }
529 | a.select.flagged:before {
530 | content: @fa-var-flag;
531 | }
532 | a.select.unread:before {
533 | content: @fa-var-star;
534 | }
535 | a.select.invert:before {
536 | .font-icon-regular(@fa-var-square);
537 | }
538 | a.expand.all:before,
539 | a.expand.unread:before,
540 | a.expand.none:before {
541 | content: @fa-var-comments;
542 | }
543 | a.search:before {
544 | content: @fa-var-search;
545 | }
546 | a.delete:before {
547 | content: @fa-var-trash-alt;
548 | }
549 | a.expunge:before {
550 | content: @fa-var-compress;
551 | }
552 | a.import:before {
553 | content: @fa-var-upload;
554 | }
555 | a.settings:before {
556 | content: @fa-var-sliders-h;
557 | }
558 | a.insertresponse:before {
559 | content: @fa-var-comment;
560 | }
561 | a.compose:before {
562 | content: @fa-var-edit;
563 | }
564 | a.addressbook:before {
565 | content: @fa-var-user;
566 | }
567 | a.recipient:before {
568 | .font-icon-regular(@fa-var-envelope);
569 | }
570 | a.status:before {
571 | .font-icon-regular(@fa-var-lightbulb);
572 | }
573 | a.folders:before {
574 | content: @fa-var-folder;
575 | }
576 | a.remove:before {
577 | content: @fa-var-eraser;
578 | }
579 | a.showurl:before {
580 | content: @fa-var-link;
581 | }
582 | a.qrcode:before {
583 | content: @fa-var-qrcode;
584 | }
585 | a.assigngroup:before {
586 | content: @fa-var-user-plus;
587 | }
588 | a.removegroup:before {
589 | content: @fa-var-user-times;
590 | }
591 | a.vcard:before {
592 | content: @fa-var-paperclip;
593 | }
594 | a.encrypt:before {
595 | content: @fa-var-lock;
596 | }
597 | a.encrypt.sign:before {
598 | content: @fa-var-lock; // TODO
599 | }
600 | }
601 |
602 | .toolbarmenu.listing li {
603 | &.checkbox > label {
604 | padding: 0 .5rem 0 2.5em;
605 | }
606 |
607 | &:hover {
608 | &.checkbox > label,
609 | input.icon-checkbox + label:before,
610 | a.active {
611 | color: @color-toolbarmenu-hover;
612 | background-color: @color-toolbarmenu-hover-background;
613 | }
614 | }
615 | }
616 |
617 | #layout > .sidebar > .header,
618 | #layout > .list > .header {
619 | span.inner {
620 | display: none;
621 | }
622 | }
623 |
624 | #layout > .content > * > .toolbar {
625 | text-align: center;
626 | }
627 |
628 | html.touch {
629 | .toolbarmenu.listing td,
630 | .toolbarmenu.listing li,
631 | #layout > :not(.content) > .header a.button {
632 | font-size: 1.2rem;
633 | }
634 |
635 | .toolbarmenu.listing li {
636 | &.checkbox > label {
637 | padding: 0 .5rem 0 2.75rem;
638 | }
639 | }
640 |
641 | .toolbarmenu li {
642 | input.icon-checkbox + label {
643 | font-size: 1.3rem;
644 | }
645 | }
646 | }
647 |
648 | html.ie11 .toolbar .dropbutton a.dropdown:before {
649 | font-size: 80%;
650 | }
651 |
652 | @media screen and (min-width: (@screen-width-small + 1px)) {
653 | ul.toolbar {
654 | flex: 1;
655 | }
656 |
657 | .toolbar {
658 | a.button {
659 | &:not(.disabled):focus,
660 | &:not(.disabled):hover {
661 | background-color: @color-toolbar-button-background-hover;
662 | }
663 | }
664 |
665 | &.listing li {
666 | display: inline-block;
667 | border: 0;
668 |
669 | a.button:before {
670 | height: 1.75rem;
671 | float: none;
672 | display: block;
673 | width: auto;
674 | margin: 0;
675 | }
676 | }
677 |
678 | .dropbutton {
679 | height: @layout-header-height;
680 | display: inline-block;
681 |
682 | &:hover {
683 | background-color: @color-toolbar-button-background-hover;
684 | }
685 |
686 | a.button.dropdown {
687 | min-width: 1.1rem;
688 | padding: 0 .3rem;
689 |
690 | &:hover {
691 | background-color: darken(@color-toolbar-button-background-hover, 5%);
692 | }
693 |
694 | &:before {
695 | height: @layout-header-height;
696 | line-height: 4.2;
697 | }
698 | }
699 | }
700 | }
701 |
702 | .toolbar.content-frame-navigation {
703 | display: none !important;
704 | }
705 |
706 | .header a.button.icon {
707 | &:not(.disabled):focus,
708 | &:not(.disabled):hover {
709 | background-color: @color-toolbar-button-background-hover;
710 | outline: 0;
711 | }
712 |
713 | &:before {
714 | margin: 0;
715 | }
716 | }
717 | }
718 |
719 | @media screen and (max-width: @screen-width-small) {
720 | body > #layout > div > .toolbar.footer {
721 | justify-content: space-around;
722 |
723 | & > * {
724 | flex-grow: 1;
725 | }
726 |
727 | .buttons {
728 | display: flex;
729 | justify-content: space-around;
730 | }
731 |
732 | .listselectors > * {
733 | flex-grow: 1;
734 | }
735 | }
736 | }
737 |
--------------------------------------------------------------------------------
/templates/about.html:
--------------------------------------------------------------------------------
1 |
Copyright © 2005-2016, The Roundcube Dev Team
10 |This program is free software;
11 | you can redistribute it and/or modify it under the terms of the
12 | GNU General Public License
13 | as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
14 | Some exceptions for skins & plugins apply.
15 |