Merge lp:~3v1n0/ubuntu-themes/gs-decorations-fixes into lp:ubuntu-themes

Proposed by Marco Trevisan (Treviño) on 2017-05-08
Status: Merged
Approved by: Iain Lane on 2017-05-10
Approved revision: 553
Merged at revision: 539
Proposed branch: lp:~3v1n0/ubuntu-themes/gs-decorations-fixes
Merge into: lp:ubuntu-themes
Diff against target: 807 lines (+309/-221)
7 files modified
Ambiance/gtk-3.20/apps/unity.css (+4/-60)
Ambiance/gtk-3.20/gtk-main.css (+3/-2)
Ambiance/gtk-3.20/gtk-widgets.css (+144/-58)
Radiance/gtk-3.20/apps/unity.css (+4/-37)
Radiance/gtk-3.20/gtk-main.css (+3/-0)
Radiance/gtk-3.20/gtk-widgets-radiance.css (+1/-7)
Radiance/gtk-3.20/gtk-widgets.css (+150/-57)
To merge this branch: bzr merge lp:~3v1n0/ubuntu-themes/gs-decorations-fixes
Reviewer Review Type Date Requested Status
Iain Lane Approve on 2017-05-10
Ken VanDine 2017-05-08 Approve on 2017-05-09
Dmitry Shachnev 2017-05-08 Approve on 2017-05-09
Alberts Muktupāvels 2017-05-08 Pending
Review via email: mp+323760@code.launchpad.net

Commit message

Ambiance, Radiance: fix shadows, handlers, decorations look for CSD and SSD in GS

 - Gtk Decorations theme adapted to match unity
 - Shadows follows the unity7 design for all the csd widgets
 - Enabled the resize extents for windows
 - Implemented a theme for solid-csd windows
 - Fixed tooltips

To post a comment you must log in.
Dmitry Shachnev (mitya57) wrote :

This is working *much* better than the current version. Tested with gnome-control-center, gnome-calcualtor, gnome-software, nautilus — everywhere the headerbars are working fine. Thanks a lot!

review: Approve
Ken VanDine (ken-vandine) wrote :

Working great and looks good. Thanks for the fix!

review: Approve
554. By Marco Trevisan (Treviño) on 2017-05-10

Ambiance, Radiance: ensure all titlebars have the same padding

Iain Lane (laney) wrote :

I think I'll upload this. Thanks!

review: Approve

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'Ambiance/gtk-3.20/apps/unity.css'
2--- Ambiance/gtk-3.20/apps/unity.css 2016-08-01 12:10:11 +0000
3+++ Ambiance/gtk-3.20/apps/unity.css 2017-05-10 12:39:09 +0000
4@@ -6,9 +6,9 @@
5
6 -UnityDecoration-shadow-offset-x: 1px;
7 -UnityDecoration-shadow-offset-y: 5px;
8- -UnityDecoration-active-shadow-color: rgba (0, 0, 0, 0.75);
9+ -UnityDecoration-active-shadow-color: alpha (@active_shadow_color, 0.75);
10 -UnityDecoration-active-shadow-radius: 30px;
11- -UnityDecoration-inactive-shadow-color: rgba (0, 0, 0, 0.3);
12+ -UnityDecoration-inactive-shadow-color: @inactive_shadow_color;
13 -UnityDecoration-inactive-shadow-radius: 25px;
14
15 -UnityDecoration-glow-size: 10px;
16@@ -19,64 +19,8 @@
17 -UnityDecoration-title-alignment: 0.0;
18 }
19
20-UnityDecoration .top {
21- border: 1px solid rgba (0, 3, 5, 0.03); /* shade (@dark_bg_color, 1.04) - shade (@dark_bg_color, 1.5) */
22- border-bottom-width: 0;
23- border-radius: 6px 6px 0 0;
24- padding: 1px 6px 0 6px;
25-
26- box-shadow: inset 0 0 transparent, inset 0 0 transparent,
27- inset 0 1px shade (@dark_bg_color, 1.6), inset 0 0 transparent;
28-
29- background-color: transparent;
30- background-clip: border-box;
31- background-image: -gtk-gradient (linear, left top, left bottom,
32- from (shade (@dark_bg_color, 1.5)),
33- to (shade (@dark_bg_color, 1.04)));
34-
35- color: @dark_fg_color;
36- text-shadow: 1px 0 #333, -1px 0 #333, 0 1px #333, 0 -1px #333;
37-}
38-
39-UnityDecoration .top:backdrop {
40- border: 1px solid rgba (14, 13, 0, 0.03); /* @dark_bg_color - shade (#474642, 0.92) */;
41- border-bottom-width: 0;
42- background-color: transparent;
43- background-clip: border-box;
44- background-image: -gtk-gradient (linear, left top, left bottom,
45- from (shade (#474642, 0.92)),
46- to (@dark_bg_color));
47- box-shadow: inset 0 0 transparent, inset 0 0 transparent,
48- inset 0 1px #474642, inset 0 0 transparent;
49- color: #807d78;
50-}
51-
52-UnityDecoration .left,
53-UnityDecoration .right {
54- background-color: shade (@bg_color, 0.7);
55- background-size: 1px 70px;
56- background-repeat: repeat-x;
57-
58- /* start color: mix of the top border color and bg-image gradient end */
59- background-image: -gtk-gradient (linear, left top, left bottom,
60- color-stop (0, #2b2a2a),
61- color-stop (0.5, #2b2a2a),
62- color-stop (1, shade (@bg_color, 0.7)));
63-}
64-
65-UnityDecoration .left:backdrop,
66-UnityDecoration .right:backdrop {
67- /* start color: mix of the top border color and bg-image gradient end */
68- background-image: -gtk-gradient (linear, left top, left bottom,
69- color-stop (0, #373632),
70- color-stop (0.5, #373632),
71- color-stop (1, shade (@bg_color, 0.7)));
72-}
73-
74-UnityDecoration .bottom {
75- background-image: none;
76- background-color: shade (@bg_color, 0.7);
77-}
78+/* Definitions of UnityDecoration .top (and :backdrop) are now shared with
79+ * Gtk .titlebar (and :backdrop); .left and .right are not used by this theme */
80
81 /* Panel Style */
82
83
84=== modified file 'Ambiance/gtk-3.20/gtk-main.css'
85--- Ambiance/gtk-3.20/gtk-main.css 2016-08-30 09:51:51 +0000
86+++ Ambiance/gtk-3.20/gtk-main.css 2017-05-10 12:39:09 +0000
87@@ -13,6 +13,9 @@
88
89 @define-color borders shade(@bg_color, 0.82);
90
91+@define-color active_shadow_color black;
92+@define-color inactive_shadow_color alpha(black, 0.3);
93+
94 /* misc colors used by gtk+
95 *
96 * Gtk doesn't currently expand color variables for style properties. Thus,
97@@ -54,8 +57,6 @@
98
99 @define-color scale_highlight_bg #df784e;
100
101-@define-color shadow_color alpha(black, 0.5);
102-
103 @define-color osd_fg_color #eeeeec;
104 @define-color osd_bg_color alpha(#202526, 0.7);
105 @define-color osd_border_color alpha(black, 0.7);
106
107=== modified file 'Ambiance/gtk-3.20/gtk-widgets.css'
108--- Ambiance/gtk-3.20/gtk-widgets.css 2017-01-25 17:43:32 +0000
109+++ Ambiance/gtk-3.20/gtk-widgets.css 2017-05-10 12:39:09 +0000
110@@ -637,17 +637,6 @@
111 border-width: 1px 0px 1px 0px;
112 }
113
114-
115-/****************
116- * window-frame *
117- ****************/
118-
119-.csd.popup {
120- border-style: none;
121- border-radius: 0;
122- box-shadow: 0 3px 8px @shadow_color;
123-}
124-
125 /************
126 * iconview *
127 ************/
128@@ -833,6 +822,11 @@
129 font-weight: normal;
130 }
131
132+.background.popup.csd {
133+ /* Delete menus background, we don't need border-radious here */
134+ background-color: transparent;
135+}
136+
137 /***********
138 * menubar *
139 ***********/
140@@ -1953,12 +1947,8 @@
141 background-color: @base_color;
142 }
143
144-headerbar {
145- padding: 2px 6px;
146-}
147-
148 /*
149- * Header Bars
150+ * Header Bars and decorations
151 *
152 * The following rules only style header bars when they are used as a window's
153 * titlebar widget (i.e., they have .titlebar set as well).
154@@ -1967,19 +1957,132 @@
155 * that prefer showing traditional title bars. The rules for those are further
156 * down grouped with normal toolbars.
157 */
158-.titlebar {
159+decoration {
160+ margin: 10px;
161+ border-radius: 6px 6px 0 0;
162+ box-shadow: 1px 5px 13px alpha(@active_shadow_color, 0.85);
163+}
164+
165+decoration:backdrop,
166+tooltip.csd decoration,
167+.popup decoration {
168+ box-shadow: 1px 5px 13px transparent, /* this should match normal shadow geometries */
169+ 1px 5px 8px @inactive_shadow_color;
170+ transition: 100ms ease-out;
171+}
172+
173+.ssd decoration {
174+ box-shadow: none;
175+}
176+
177+popover {
178+/* FIXME: we can't reuse the default shadow definition as increasing marging
179+ * would break the tip
180+ */
181+ margin: 13px;
182+ box-shadow: 1px 3px 6px @inactive_shadow_color;
183+}
184+
185+popover:backdrop,
186+popover.background:backdrop {
187+ box-shadow: 1px 3px 6px alpha(@inactive_shadow_color, 0.5);
188+}
189+
190+tooltip decoration {
191+ background-color: transparent;
192+ background-image: none;
193+}
194+
195+.maximized decoration,
196+.fullscreen decoration,
197+.unity-csd decoration {
198+ margin: 0;
199+ border-radius: 0;
200+ box-shadow: none;
201+}
202+
203+.tiled decoration {
204+ border-radius: 0;
205+}
206+
207+.default-decoration.titlebar:not(headerbar),
208+headerbar.default-decoration {
209+ min-height: 26px;
210+}
211+
212+.solid-csd .titlebar:backdrop:dir(rtl):not(headerbar),
213+.solid-csd .titlebar:backdrop:dir(ltr):not(headerbar),
214+.solid-csd .titlebar:dir(rtl):not(headerbar),
215+.solid-csd .titlebar:dir(ltr):not(headerbar),
216+.solid-csd headerbar:backdrop:dir(rtl),
217+.solid-csd headerbar:backdrop:dir(ltr),
218+.solid-csd headerbar,
219+.solid-csd headerbar:dir(ltr) {
220+ margin-left: 0;
221+ margin-right: 0;
222+ margin-top: 0;
223+ border-radius: 0;
224+ box-shadow: none;
225+}
226+
227+.solid-csd decoration {
228+ margin: 0;
229+ box-shadow: none;
230+ border-width: 2px;
231+ border-style: solid;
232+ border-color: shade (@dark_bg_color, 1.15);
233+ border-radius: 0;
234+}
235+
236+.solid-csd:backdrop decoration {
237+ border-color: @dark_bg_color
238+}
239+
240+.titlebar,
241+UnityDecoration .top {
242+ border: 1px solid rgba (0, 3, 5, 0.03); /* shade (@dark_bg_color, 1.04) - shade (@dark_bg_color, 1.5) */
243+ border-bottom-width: 0;
244+ border-radius: 6px 6px 0 0;
245+ padding: 1px 6px 0 6px;
246+
247+ box-shadow: inset 0 0 transparent, inset 0 0 transparent,
248+ inset 0 1px shade (@dark_bg_color, 1.6), inset 0 0 transparent;
249+
250+ background-color: transparent;
251+ background-clip: border-box;
252 background-image: -gtk-gradient (linear, left top, left bottom,
253 from (shade (@dark_bg_color, 1.5)),
254+ to (shade (@dark_bg_color, 1.04)));
255+
256+ color: @dark_fg_color;
257+ text-shadow: 1px 0 #333, -1px 0 #333, 0 1px #333, 0 -1px #333;
258+}
259+
260+.titlebar:backdrop,
261+UnityDecoration .top:backdrop {
262+ border: 1px solid rgba (14, 13, 0, 0.03); /* @dark_bg_color - shade (#474642, 0.92) */;
263+ border-bottom-width: 0;
264+ background-color: transparent;
265+ background-clip: border-box;
266+ background-image: -gtk-gradient (linear, left top, left bottom,
267+ from (shade (#474642, 0.92)),
268 to (@dark_bg_color));
269- border-color: shade (@dark_bg_color, 1.5);
270- border-style: solid;
271- border-width: 1px 0 0 0;
272- border-radius: 7px 7px 0 0;
273-
274- color: @dark_fg_color;
275- text-shadow: 0 -1px shade (@dark_bg_color, 0.7);
276-
277- box-shadow: inset 0 1px shade (@dark_bg_color, 1.65);
278+ box-shadow: inset 0 0 transparent, inset 0 0 transparent,
279+ inset 0 1px #474642, inset 0 0 transparent;
280+ color: #807d78;
281+}
282+
283+.maximized .titlebar,
284+.tiled .titlebar {
285+ border-radius: 0;
286+ border-image: none;
287+ border: none;
288+ box-shadow: none;
289+}
290+
291+.maximized .titlebar:not(:backdrop):not(.toolbar-mode),
292+.tiled .titlebar:not(:backdrop):not(.toolbar-mode) {
293+ box-shadow: inset 0 1px shade (@dark_bg_color, 1.6);
294 }
295
296 .titlebar .title {
297@@ -1991,23 +2094,6 @@
298 opacity: 0.5;
299 }
300
301-.titlebar:backdrop {
302- color: @backdrop_fg_color;
303- background-image: none;
304- background-color: @dark_bg_color;
305- border-top-color: @dark_bg_color;
306- box-shadow: inset 0 1px shade (@dark_bg_color, 1.2);
307-}
308-
309-.maximized .titlebar {
310- border-radius: 0;
311- border: none;
312-}
313-
314-.maximized .titlebar.toolbar-mode {
315- box-shadow: none;
316-}
317-
318 .titlebar button.titlebutton {
319 background-clip: padding-box;
320 border: 1px solid #383734;
321@@ -2050,6 +2136,8 @@
322 }
323
324
325+
326+
327 /***********
328 * toolbar *
329 ***********/
330@@ -2070,8 +2158,7 @@
331 * primary-toolbar *
332 *******************/
333 .primary-toolbar,
334-headerbar,
335-.maximized headerbar.titlebar:not(:backdrop) {
336+.titlebar.toolbar-mode {
337 -GtkWidget-window-dragging: true;
338
339 background-image: -gtk-gradient (linear, left top, left bottom,
340@@ -2089,12 +2176,8 @@
341 box-shadow: inset 0 1px shade (@dark_bg_color, 0.94);
342 }
343
344-.maximized headerbar.titlebar.toolbar-mode:not(:backdrop) {
345- border-width: 0;
346-}
347-
348 .primary-toolbar:backdrop,
349-headerbar:backdrop {
350+.titlebar.toolbar-mode:backdrop {
351 background-image: none;
352 background-color: @dark_bg_color;
353 box-shadow: none;
354@@ -2105,11 +2188,13 @@
355 }
356
357 .primary-toolbar:disabled,
358+.titlebar.toolbar-mode:disabled,
359 headerbar:disabled {
360 text-shadow: 0 -1px shade (@dark_bg_color, 0.7);
361 }
362
363 .primary-toolbar button,
364+.titlebar button,
365 headerbar button,
366 headerbar button:disabled,
367 .primary-toolbar button.flat:hover {
368@@ -2365,12 +2450,20 @@
369 background-image: -gtk-gradient (radial, center 0, 0, center 0, 0.8,
370 from (alpha (mix (@tooltip_bg_color, #ffffff, 0.2), 0.86)),
371 to (alpha (@tooltip_bg_color, 0.86)));
372- border-color: alpha (#ffffff, 0.2);
373+ border-color: alpha (white, 0.2);
374 border-radius: 5px;
375 border-style: solid;
376 border-width: 1px;
377 }
378
379+tooltip.csd:not(.unity-csd) decoration {
380+ border-radius: 5px;
381+}
382+
383+tooltip.background {
384+ background-color: transparent;
385+}
386+
387 tooltip label {
388 color: @tooltip_fg_color;
389 }
390@@ -2428,16 +2521,9 @@
391
392 border-radius: 5px;
393 border: 1px solid darker(@bg_color);
394-
395- box-shadow: 0 2px 3px @shadow_color;
396- margin: 10px;
397 padding: 2px;
398 }
399
400-popover:backdrop {
401- box-shadow: none;
402-}
403-
404 /* Popover menuitems are actually buttons. The following rules reset most of
405 * the button styles for them.
406 */
407
408=== modified file 'Radiance/gtk-3.20/apps/unity.css'
409--- Radiance/gtk-3.20/apps/unity.css 2016-08-04 16:31:00 +0000
410+++ Radiance/gtk-3.20/apps/unity.css 2017-05-10 12:39:09 +0000
411@@ -6,9 +6,9 @@
412
413 -UnityDecoration-shadow-offset-x: 1px;
414 -UnityDecoration-shadow-offset-y: 5px;
415- -UnityDecoration-active-shadow-color: rgba (0, 0, 0, 0.78);
416+ -UnityDecoration-active-shadow-color: alpha (@active_shadow_color, 0.78);
417 -UnityDecoration-active-shadow-radius: 30px;
418- -UnityDecoration-inactive-shadow-color: rgba (0, 0, 0, 0.3);
419+ -UnityDecoration-inactive-shadow-color: @inactive_shadow_color;
420 -UnityDecoration-inactive-shadow-radius: 25px;
421
422 -UnityDecoration-glow-size: 10px;
423@@ -19,41 +19,8 @@
424 -UnityDecoration-title-alignment: 0.0;
425 }
426
427-UnityDecoration .top {
428- border: 1px solid rgba (85, 40, 0, 0.04); /* shade (@dark_bg_color) (shade (#edebe6, 1.06) */
429- border-bottom-width: 0;
430- border-radius: 6px 6px 0 0;
431- padding: 1px 6px 0 6px;
432-
433- box-shadow: inset 0 0 transparent, inset 0 0 transparent,
434- inset 0 1px shade (@edebe6, 1.065), inset 0 0 transparent;
435-
436- background-color: transparent;
437- background-clip: border-box;
438- background-image: -gtk-gradient (linear, left top, left bottom,
439- from (shade (#edebe6, 1.06)),
440- to (@dark_bg_color));
441-
442- color: shade (@dark_bg_color, 0.4);
443- text-shadow: 1px 0 shade (@dark_bg_color, 1.06), -1px 0 shade (@dark_bg_color, 1.06),
444- 0 1px shade (@dark_bg_color, 1.06), 0 -1px shade (@dark_bg_color, 1.06);
445-}
446-
447-UnityDecoration .top:backdrop {
448- border: 1px solid rgba (110, 27, 0, 0.04); /* shade @dark_bg_color - shade (#edebe6, 0.96) */
449- border-bottom-width: 0;
450- background-color: transparent;
451- background-clip: border-box;
452- background-image: -gtk-gradient (linear, left top, left bottom,
453- from (shade (#edebe6, 0.96)),
454- to (@dark_bg_color));
455- box-shadow: inset 0 0 transparent, inset 0 0 transparent,
456- inset 0 1px shade (#edebe6, 0.97), inset 0 0 transparent;
457-
458- color: #a39e9a;
459- text-shadow: 1px 0 1px shade (@dark_bg_color, 1.08), -1px 0 1px shade (@dark_bg_color, 1.08),
460- 0 1px 1px shade (@dark_bg_color, 1.08), 0 -1px 1px shade (@dark_bg_color, 1.08);
461-}
462+/* Definitions of UnityDecoration .top (and :backdrop) are now shared with
463+ * Gtk .titlebar (and :backdrop); .left and .right are not used by this theme */
464
465 UnityDecoration .left,
466 UnityDecoration .right {
467
468=== modified file 'Radiance/gtk-3.20/gtk-main.css'
469--- Radiance/gtk-3.20/gtk-main.css 2016-08-30 09:51:51 +0000
470+++ Radiance/gtk-3.20/gtk-main.css 2017-05-10 12:39:09 +0000
471@@ -13,6 +13,9 @@
472
473 @define-color borders shade(@bg_color, 0.82);
474
475+@define-color active_shadow_color black;
476+@define-color inactive_shadow_color alpha(black, 0.3);
477+
478 /* misc colors used by gtk+
479 *
480 * Gtk doesn't currently expand color variables for style properties. Thus,
481
482=== modified file 'Radiance/gtk-3.20/gtk-widgets-radiance.css'
483--- Radiance/gtk-3.20/gtk-widgets-radiance.css 2016-10-06 18:53:39 +0000
484+++ Radiance/gtk-3.20/gtk-widgets-radiance.css 2017-05-10 12:39:09 +0000
485@@ -70,9 +70,7 @@
486 }
487
488 /* primary-toolbar */
489-.primary-toolbar,
490-headerbar,
491-.maximized headerbar.titlebar:not(:backdrop) {
492+.primary-toolbar {
493 background-image: -gtk-gradient (linear, left top, left bottom,
494 from (shade (@dark_bg_color, 0.96)),
495 to (shade (@dark_bg_color, 1.1)));
496@@ -104,7 +102,3 @@
497 from (shade (@dark_bg_color, 1.03)),
498 to (shade (@dark_bg_color, 0.96)));
499 }
500-
501-.titlebar {
502- border-top-width: 0px;
503-}
504
505=== modified file 'Radiance/gtk-3.20/gtk-widgets.css'
506--- Radiance/gtk-3.20/gtk-widgets.css 2016-10-31 04:08:49 +0000
507+++ Radiance/gtk-3.20/gtk-widgets.css 2017-05-10 12:39:09 +0000
508@@ -646,17 +646,6 @@
509 border-width: 1px 0px 1px 0px;
510 }
511
512-
513-/****************
514- * window-frame *
515- ****************/
516-
517-.csd.popup {
518- border-style: none;
519- border-radius: 0;
520- box-shadow: 0 3px 8px @shadow_color;
521-}
522-
523 /************
524 * iconview *
525 ************/
526@@ -842,6 +831,11 @@
527 font-weight: normal;
528 }
529
530+.background.popup.csd {
531+ /* Delete menus background, we don't need border-radious here */
532+ background-color: transparent;
533+}
534+
535 /***********
536 * menubar *
537 ***********/
538@@ -1952,12 +1946,8 @@
539 background-color: @base_color;
540 }
541
542-headerbar {
543- padding: 2px 6px;
544-}
545-
546 /*
547- * Header Bars
548+ * Header Bars and decorations
549 *
550 * The following rules only style header bars when they are used as a window's
551 * titlebar widget (i.e., they have .titlebar set as well).
552@@ -1966,16 +1956,136 @@
553 * that prefer showing traditional title bars. The rules for those are further
554 * down grouped with normal toolbars.
555 */
556-.titlebar {
557- background-image: -gtk-gradient (linear, left top, left bottom,
558- from (shade (@dark_bg_color, 1.5)),
559- to (@dark_bg_color));
560- border-color: shade (@dark_bg_color, 1.5);
561+decoration {
562+ margin: 10px;
563+ border-radius: 6px 6px 0 0;
564+ box-shadow: 1px 5px 13px alpha(@active_shadow_color, 0.85);
565+}
566+
567+decoration:backdrop,
568+tooltip.csd decoration,
569+.popup decoration {
570+ box-shadow: 1px 5px 13px transparent, /* this should match normal shadow geometries */
571+ 1px 5px 8px @inactive_shadow_color;
572+ transition: 100ms ease-out;
573+}
574+
575+.ssd decoration {
576+ box-shadow: none;
577+}
578+
579+popover {
580+/* FIXME: we can't reuse the default shadow definition as increasing marging
581+ * would break the tip
582+ */
583+ margin: 13px;
584+ box-shadow: 1px 3px 6px @inactive_shadow_color;
585+}
586+
587+popover:backdrop,
588+popover.background:backdrop {
589+ box-shadow: 1px 3px 6px alpha(@inactive_shadow_color, 0.5);
590+}
591+
592+tooltip decoration {
593+ background-color: transparent;
594+ background-image: none;
595+}
596+
597+.maximized decoration,
598+.fullscreen decoration,
599+.unity-csd decoration {
600+ margin: 0;
601+ border-radius: 0;
602+ box-shadow: none;
603+}
604+
605+.tiled decoration {
606+ border-radius: 0;
607+}
608+
609+.default-decoration.titlebar:not(headerbar),
610+headerbar.default-decoration {
611+ min-height: 26px;
612+}
613+
614+.solid-csd .titlebar:backdrop:dir(rtl):not(headerbar),
615+.solid-csd .titlebar:backdrop:dir(ltr):not(headerbar),
616+.solid-csd .titlebar:dir(rtl):not(headerbar),
617+.solid-csd .titlebar:dir(ltr):not(headerbar),
618+.solid-csd headerbar:backdrop:dir(rtl),
619+.solid-csd headerbar:backdrop:dir(ltr),
620+.solid-csd headerbar,
621+.solid-csd headerbar:dir(ltr) {
622+ margin-left: 0;
623+ margin-right: 0;
624+ margin-top: 0;
625+ border-radius: 0;
626+ box-shadow: none;
627+}
628+
629+.solid-csd decoration {
630+ margin: 0;
631+ box-shadow: none;
632+ border-width: 2px;
633 border-style: solid;
634- border-width: 1px 0 0 0;
635- border-radius: 7px 7px 0 0;
636-
637- color: @dark_fg_color;
638+ border-color: shade (@dark_bg_color, 0.85);
639+ border-radius: 0;
640+}
641+
642+.solid-csd:backdrop decoration {
643+ border-color: @dark_bg_color
644+}
645+
646+.titlebar,
647+UnityDecoration .top {
648+ border: 1px solid rgba (85, 40, 0, 0.04); /* shade (@dark_bg_color) (shade (#edebe6, 1.06) */
649+ border-bottom-width: 0;
650+ border-radius: 6px 6px 0 0;
651+ padding: 1px 6px 0 6px;
652+
653+ box-shadow: inset 0 0 transparent, inset 0 0 transparent,
654+ inset 0 1px shade (@edebe6, 1.065), inset 0 0 transparent;
655+
656+ background-color: transparent;
657+ background-clip: border-box;
658+ background-image: -gtk-gradient (linear, left top, left bottom,
659+ from (shade (#edebe6, 1.06)),
660+ to (@dark_bg_color));
661+
662+ color: shade (@dark_bg_color, 0.4);
663+ text-shadow: 1px 0 shade (@dark_bg_color, 1.06), -1px 0 shade (@dark_bg_color, 1.06),
664+ 0 1px shade (@dark_bg_color, 1.06), 0 -1px shade (@dark_bg_color, 1.06);
665+}
666+
667+.titlebar:backdrop,
668+UnityDecoration .top:backdrop {
669+ border: 1px solid rgba (110, 27, 0, 0.04); /* shade @dark_bg_color - shade (#edebe6, 0.96) */
670+ border-bottom-width: 0;
671+ background-color: transparent;
672+ background-clip: border-box;
673+ background-image: -gtk-gradient (linear, left top, left bottom,
674+ from (shade (#edebe6, 0.96)),
675+ to (@dark_bg_color));
676+ box-shadow: inset 0 0 transparent, inset 0 0 transparent,
677+ inset 0 1px shade (#edebe6, 0.97), inset 0 0 transparent;
678+
679+ color: #a39e9a;
680+ text-shadow: 1px 0 1px shade (@dark_bg_color, 1.08), -1px 0 1px shade (@dark_bg_color, 1.08),
681+ 0 1px 1px shade (@dark_bg_color, 1.08), 0 -1px 1px shade (@dark_bg_color, 1.08);
682+}
683+
684+.maximized .titlebar,
685+.tiled .titlebar {
686+ border-radius: 0;
687+ border-image: none;
688+ border: none;
689+ box-shadow: none;
690+}
691+
692+.maximized .titlebar:not(:backdrop):not(.toolbar-mode),
693+.tiled .titlebar:not(:backdrop):not(.toolbar-mode) {
694+ box-shadow: inset 0 1px shade (#edebe6, 1.08);
695 }
696
697 .titlebar .title {
698@@ -1987,23 +2097,6 @@
699 opacity: 0.5;
700 }
701
702-.titlebar:backdrop {
703- color: @backdrop_fg_color;
704- background-image: none;
705- background-color: @dark_bg_color;
706- border-top-color: @dark_bg_color;
707- box-shadow: inset 0 1px shade (@dark_bg_color, 1.2);
708-}
709-
710-.maximized .titlebar {
711- border-radius: 0;
712- border: none;
713-}
714-
715-.maximized .titlebar.toolbar-mode {
716- box-shadow: none;
717-}
718-
719 .titlebar button.titlebutton {
720 background-clip: padding-box;
721 border: 1px solid #d0c7bf;
722@@ -2046,6 +2139,8 @@
723 }
724
725
726+
727+
728 /***********
729 * toolbar *
730 ***********/
731@@ -2066,8 +2161,7 @@
732 * primary-toolbar *
733 *******************/
734 .primary-toolbar,
735-headerbar,
736-.maximized headerbar.titlebar:not(:backdrop) {
737+.titlebar.toolbar-mode {
738 -GtkWidget-window-dragging: true;
739
740 background-image: -gtk-gradient (linear, left top, left bottom,
741@@ -2085,12 +2179,8 @@
742 box-shadow: inset 0 1px shade (@dark_bg_color, 0.94);
743 }
744
745-.maximized headerbar.titlebar.toolbar-mode:not(:backdrop) {
746- border-width: 0;
747-}
748-
749 .primary-toolbar:backdrop,
750-headerbar:backdrop {
751+.titlebar.toolbar-mode:backdrop {
752 background-image: none;
753 background-color: @dark_bg_color;
754 box-shadow: none;
755@@ -2101,11 +2191,13 @@
756 }
757
758 .primary-toolbar:disabled,
759+.titlebar.toolbar-mode:disabled,
760 headerbar:disabled {
761 text-shadow: 0 -1px shade (@dark_bg_color, 0.7);
762 }
763
764 .primary-toolbar button,
765+.titlebar button,
766 headerbar button,
767 headerbar button:disabled,
768 .primary-toolbar button.flat:hover {
769@@ -2361,12 +2453,20 @@
770 background-image: -gtk-gradient (radial, center 0, 0, center 0, 0.8,
771 from (alpha (mix (@tooltip_bg_color, #ffffff, 0.2), 0.86)),
772 to (alpha (@tooltip_bg_color, 0.86)));
773- border-color: alpha (#ffffff, 0.2);
774+ border-color: alpha (white, 0.2);
775 border-radius: 5px;
776 border-style: solid;
777 border-width: 1px;
778 }
779
780+tooltip.csd:not(.unity-csd) decoration {
781+ border-radius: 5px;
782+}
783+
784+tooltip.background {
785+ background-color: transparent;
786+}
787+
788 tooltip label {
789 color: @tooltip_fg_color;
790 }
791@@ -2419,16 +2519,9 @@
792
793 border-radius: 5px;
794 border: 1px solid darker(@bg_color);
795-
796- box-shadow: 0 2px 3px @shadow_color;
797- margin: 10px;
798 padding: 2px;
799 }
800
801-popover:backdrop {
802- box-shadow: none;
803-}
804-
805 /* Popover menuitems are actually buttons. The following rules reset most of
806 * the button styles for them.
807 */

Subscribers

People subscribed via source and target branches