diff options
-rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/_apps.scss | 50 | ||||
-rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/_common.scss | 40 | ||||
-rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/assets/Makefile.am | 3 | ||||
-rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/assets/panel-grid.svg | 173 | ||||
-rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/assets/slider-horz-grip.png | bin | 0 -> 173 bytes | |||
-rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/assets/slider-vert-grip.png | bin | 0 -> 162 bytes | |||
-rw-r--r-- | desktop-themes/YaruOk/gtk-3.0/gtk.css | 40 |
7 files changed, 243 insertions, 63 deletions
diff --git a/desktop-themes/YaruOk/gtk-3.0/_apps.scss b/desktop-themes/YaruOk/gtk-3.0/_apps.scss index 7a11ec65..88f55f12 100644 --- a/desktop-themes/YaruOk/gtk-3.0/_apps.scss +++ b/desktop-themes/YaruOk/gtk-3.0/_apps.scss @@ -817,11 +817,34 @@ PanelApplet.wnck-applet .wnck-pager { border-radius: $button_radius; } -/* Weird, this sets the border color of the clockmap */ -#MatePanelPopupWindow > frame > box > box > box > widget { - color: $borders_color; + +#PanelApplet > #clock-applet-button.flat.toggle { + background-color: transparent; + background-image: none; + border-color: transparent; + border-width: 0px; + box-shadow: none; } +#PanelApplet > #clock-applet-button.flat.toggle:hover { + box-shadow: inset 0px 1px $borders_color,inset 0px -1px $borders_color, inset 1px 0px $borders_color,inset -1px 0px $borders_color; + background-image: linear-gradient(to bottom, + $button_hover_gradient_a 5%, + $button_hover_gradient_b 95%, + $button_hover_gradient_c); + } + +#PanelApplet > #clock-applet-button.flat.toggle:checked { + box-shadow: inset 0px 1px $borders_color,inset 0px -1px $borders_color, inset 1px 0px $borders_color,inset -1px 0px $borders_color; + background-image: linear-gradient(to bottom, + $button_active_gradient_a, + $button_active_gradient_b 3px, + $button_active_gradient_c 4px, + $button_active_gradient_d 50%, + $button_active_gradient_e 50%, + $button_active_gradient_f); + } + /* volume applet */ .mate-panel-applet-slider, .mate-panel-applet-slider.background { @@ -1005,26 +1028,7 @@ iconview { } } -/* Brisk menu's panel button */ -.mate-panel-menu-bar #PanelApplet button.flat.toggle.brisk-button { - &, &:hover { - image { - margin: 0px; - padding: 0px; - } - background-image: none; - background-color: transparent; - padding: 0px; - margin: 0px; - border-color: transparent; - border-radius: 0; - border-image: none; - text-shadow: none; - &:checked { - box-shadow: inset 0 -3px 0 0 $selected_bg_color; - } - } -} + /* mate-keyboard-layout-view, mate-keyboard-layout-chooser */ /* this way it styles only the border of the keys, the bg of the map itself diff --git a/desktop-themes/YaruOk/gtk-3.0/_common.scss b/desktop-themes/YaruOk/gtk-3.0/_common.scss index 7f47630f..1cec0355 100644 --- a/desktop-themes/YaruOk/gtk-3.0/_common.scss +++ b/desktop-themes/YaruOk/gtk-3.0/_common.scss @@ -1129,7 +1129,7 @@ modelbutton.flat, $menubar_menuitem_hover_gradient_c 50%, $menubar_menuitem_hover_gradient_d ); background-color: $selected_bg_color; - color: white; } + color: $selected_fg_color; } &:selected { @extend %selected_items; } @@ -2593,8 +2593,8 @@ notebook { } tab { - min-height: 30px; - min-width: 30px; + min-height: 22px; + min-width: 22px; padding: 3px 12px; outline-offset: -5px; @@ -2671,20 +2671,20 @@ notebook { &.top, &.bottom { tabs { - padding-left: 1px; - padding-right: 1px; + padding-left: 0px; + padding-right: 0px; &:not(:only-child) { margin-left: 1px; margin-right: 1px; - &:first-child { margin-left: -1px; } + &:first-child { margin-left: 0px; } &:last-child { margin-right: -1px; } } tab { - margin-left: 1px; - margin-right: 1px; + margin-left: 0px; + margin-right: 0px; &.reorderable-page { border-style: none solid; } } @@ -2695,18 +2695,18 @@ notebook { &.right { tabs { padding-top: 0px; - padding-bottom: 1px; + padding-bottom: 0px; &:not(:only-child) { margin-top: 0px; - margin-bottom: 1px; + margin-bottom: 0px; &:first-child { margin-top: 0px; } &:last-child { margin-bottom: -1px; } } tab { - margin-top: 1px; + margin-top: 0px; margin-bottom: 0px; &.reorderable-page { border-style: solid none; } @@ -2790,7 +2790,8 @@ scrollbar { } &.horizontal slider { - background-image: linear-gradient(to bottom, + background-position: center center; + background-image: url("assets/slider-horz-grip.png"), linear-gradient(to bottom, transparentize($scrollbar_slider_gradient_a, 0.01) 1px, transparentize($scrollbar_slider_gradient_b, 0.01) 50%, transparentize($scrollbar_slider_gradient_c, 0.01) 50%, @@ -2798,7 +2799,8 @@ scrollbar { } &.vertical slider { - background-image: linear-gradient(to right, + background-position: center center; + background-image: url("assets/slider-vert-grip.png"), linear-gradient(to right, transparentize($scrollbar_slider_gradient_a, 0.01) 1px, transparentize($scrollbar_slider_gradient_b, 0.01) 50%, transparentize($scrollbar_slider_gradient_c, 0.01) 50%, @@ -2806,7 +2808,8 @@ scrollbar { } &.vertical slider:hover { - background-image: linear-gradient(to right, + background-position: center center; + background-image: url("assets/slider-vert-grip.png"), linear-gradient(to right, $scrollbar_slider_inner_border_color, $scrollbar_slider_hover_gradient_a 1px, $scrollbar_slider_hover_gradient_b 50%, @@ -2816,7 +2819,8 @@ scrollbar { } &.horizontal slider:hover { - background-image: linear-gradient(to bottom, + background-position: center center; + background-image: url("assets/slider-horz-grip.png"), linear-gradient(to bottom, $scrollbar_slider_inner_border_color, $scrollbar_slider_hover_gradient_a 1px, $scrollbar_slider_hover_gradient_b 50%, @@ -2829,9 +2833,9 @@ scrollbar { slider { background-repeat: no-repeat; background-position: center center; - min-width: 13px; - min-height: 13px; - border: 1px solid darken($core_color_a , 20%); + min-width: 14px; + min-height: 14px; + border: 1px solid darken($core_color_a , 35%); border-radius: 0px; // background-clip: padding-box; // background-color: $scrollbar_slider_color; diff --git a/desktop-themes/YaruOk/gtk-3.0/assets/Makefile.am b/desktop-themes/YaruOk/gtk-3.0/assets/Makefile.am index 3363e8eb..aaf5f5c7 100644 --- a/desktop-themes/YaruOk/gtk-3.0/assets/Makefile.am +++ b/desktop-themes/YaruOk/gtk-3.0/assets/Makefile.am @@ -3,6 +3,9 @@ THEME_NAME=YaruOk themedir = $(datadir)/themes/$(THEME_NAME)/gtk-3.0/assets theme_DATA = \ + panel-grid.svg \ + slider-horz-grip.png \ + slider-vert-grip.png \ bullet-symbolic.svg \ bullet-symbolic.symbolic.png \ check-symbolic.svg \ diff --git a/desktop-themes/YaruOk/gtk-3.0/assets/panel-grid.svg b/desktop-themes/YaruOk/gtk-3.0/assets/panel-grid.svg new file mode 100644 index 00000000..411f5e94 --- /dev/null +++ b/desktop-themes/YaruOk/gtk-3.0/assets/panel-grid.svg @@ -0,0 +1,173 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + sodipodi:docname="panel-grid.svg" + height="22" + id="svg7384" + inkscape:version="0.92.3 (2405546, 2018-03-11)" + version="1.1" + width="16"> + <metadata + id="metadata90"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title>Gnome Symbolic Icon Theme</dc:title> + </cc:Work> + </rdf:RDF> + </metadata> + <sodipodi:namedview + inkscape:bbox-nodes="false" + inkscape:bbox-paths="true" + bordercolor="#666666" + borderopacity="1" + inkscape:current-layer="layer12" + inkscape:cx="-25.21875" + inkscape:cy="-0.5880727" + gridtolerance="10" + inkscape:guide-bbox="true" + guidetolerance="10" + id="namedview88" + inkscape:object-nodes="false" + inkscape:object-paths="false" + objecttolerance="10" + pagecolor="#3a3b39" + inkscape:pageopacity="1" + inkscape:pageshadow="2" + showborder="true" + showgrid="false" + showguides="true" + inkscape:snap-bbox="true" + inkscape:snap-bbox-midpoints="false" + inkscape:snap-global="true" + inkscape:snap-grids="true" + inkscape:snap-nodes="true" + inkscape:snap-others="false" + inkscape:snap-to-guides="true" + inkscape:window-height="987" + inkscape:window-maximized="1" + inkscape:window-width="1680" + inkscape:window-x="0" + inkscape:window-y="0" + inkscape:zoom="16"> + <inkscape:grid + empspacing="2" + enabled="true" + id="grid4866" + originx="119.9998" + originy="650" + snapvisiblegridlinesonly="true" + spacingx="1" + spacingy="1" + type="xygrid" + visible="true" /> + <inkscape:grid + color="#000000" + empcolor="#000000" + empopacity="0" + empspacing="4" + enabled="true" + id="grid5968" + opacity="0.1254902" + originx="119.9998" + originy="650" + snapvisiblegridlinesonly="true" + spacingx="0.5" + spacingy="0.5" + type="xygrid" + visible="true" /> + </sodipodi:namedview> + <title + id="title9167">Gnome Symbolic Icon Theme</title> + <defs + id="defs7386" /> + <g + inkscape:groupmode="layer" + id="layer9" + inkscape:label="status" + style="display:inline" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="layer10" + inkscape:label="devices" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="layer11" + inkscape:label="apps" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="layer13" + inkscape:label="places" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="layer14" + inkscape:label="mimetypes" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="layer15" + inkscape:label="emblems" + style="display:inline" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="g71291" + inkscape:label="emotes" + style="display:inline" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="g4953" + inkscape:label="categories" + style="display:inline" + transform="translate(-121.0004,-861)" /> + <g + inkscape:groupmode="layer" + id="layer12" + inkscape:label="actions" + style="display:inline" + transform="translate(-121.0004,-861)"> + <rect + height="4" + id="rect20592" + rx="0.38461545" + ry="0.50229359" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#8f8f8f;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;marker:none;enable-background:new" + width="4" + x="127.0002" + y="864.17157" /> + <rect + height="4" + id="rect16730" + rx="0.38461545" + ry="0.50229359" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#8f8f8f;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;marker:none;enable-background:new" + width="4" + x="127.0002" + y="870.17157" /> + <rect + height="4" + id="rect16732" + rx="0.38461545" + ry="0.50229359" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#8f8f8f;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1;marker:none;enable-background:new" + width="4" + x="127.0002" + y="876.17157" /> + </g> +</svg> diff --git a/desktop-themes/YaruOk/gtk-3.0/assets/slider-horz-grip.png b/desktop-themes/YaruOk/gtk-3.0/assets/slider-horz-grip.png Binary files differnew file mode 100644 index 00000000..313c11dc --- /dev/null +++ b/desktop-themes/YaruOk/gtk-3.0/assets/slider-horz-grip.png diff --git a/desktop-themes/YaruOk/gtk-3.0/assets/slider-vert-grip.png b/desktop-themes/YaruOk/gtk-3.0/assets/slider-vert-grip.png Binary files differnew file mode 100644 index 00000000..4b5a55a3 --- /dev/null +++ b/desktop-themes/YaruOk/gtk-3.0/assets/slider-vert-grip.png diff --git a/desktop-themes/YaruOk/gtk-3.0/gtk.css b/desktop-themes/YaruOk/gtk-3.0/gtk.css index 5fdbd10f..b634a358 100644 --- a/desktop-themes/YaruOk/gtk-3.0/gtk.css +++ b/desktop-themes/YaruOk/gtk-3.0/gtk.css @@ -431,7 +431,7 @@ modelbutton.flat, .menuitem.button.flat, modelbutton.flat:backdrop, modelbutton. /* menu buttons */ modelbutton.flat, .menuitem.button.flat { min-height: 26px; padding-left: 5px; padding-right: 5px; border-radius: 4px; outline-offset: -2px; } -modelbutton.flat:hover, .menuitem.button.flat:hover { box-shadow: inset 0px 1px #4b6e9b, inset 0px -1px #4b6e9b; border-style: solid; background-image: linear-gradient(to bottom, #a4c2e8, #96b8e2 50%, #91b4df 50%, #84a9d9); background-color: #89addb; color: white; } +modelbutton.flat:hover, .menuitem.button.flat:hover { box-shadow: inset 0px 1px #4b6e9b, inset 0px -1px #4b6e9b; border-style: solid; background-image: linear-gradient(to bottom, #a4c2e8, #96b8e2 50%, #91b4df 50%, #84a9d9); background-color: #89addb; color: #ffffff; } modelbutton.flat arrow { background: none; } @@ -935,7 +935,7 @@ notebook > header > tabs > arrow:hover:not(:active):not(:backdrop) { background- notebook > header > tabs > arrow:disabled { border-color: transparent; background-color: transparent; background-image: none; box-shadow: inset 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; } -notebook > header tab { min-height: 30px; min-width: 30px; padding: 3px 12px; outline-offset: -5px; color: #000000; font-weight: normal; border-width: 0px; border-color: transparent; } +notebook > header tab { min-height: 22px; min-width: 22px; padding: 3px 12px; outline-offset: -5px; color: #000000; font-weight: normal; border-width: 0px; border-color: transparent; } notebook > header tab:hover { color: #000000; background-color: #e3e2e0; } @@ -965,27 +965,27 @@ notebook > header tab button.flat:last-child { margin-left: 4px; margin-right: - notebook > header tab button.flat:first-child { margin-left: -4px; margin-right: 4px; } -notebook > header.top tabs, notebook > header.bottom tabs { padding-left: 1px; padding-right: 1px; } +notebook > header.top tabs, notebook > header.bottom tabs { padding-left: 0px; padding-right: 0px; } notebook > header.top tabs:not(:only-child), notebook > header.bottom tabs:not(:only-child) { margin-left: 1px; margin-right: 1px; } -notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child { margin-left: -1px; } +notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child { margin-left: 0px; } notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child { margin-right: -1px; } -notebook > header.top tabs tab, notebook > header.bottom tabs tab { margin-left: 1px; margin-right: 1px; } +notebook > header.top tabs tab, notebook > header.bottom tabs tab { margin-left: 0px; margin-right: 0px; } notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page { border-style: none solid; } -notebook > header.left tabs, notebook > header.right tabs { padding-top: 0px; padding-bottom: 1px; } +notebook > header.left tabs, notebook > header.right tabs { padding-top: 0px; padding-bottom: 0px; } -notebook > header.left tabs:not(:only-child), notebook > header.right tabs:not(:only-child) { margin-top: 0px; margin-bottom: 1px; } +notebook > header.left tabs:not(:only-child), notebook > header.right tabs:not(:only-child) { margin-top: 0px; margin-bottom: 0px; } notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child { margin-top: 0px; } notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child { margin-bottom: -1px; } -notebook > header.left tabs tab, notebook > header.right tabs tab { margin-top: 1px; margin-bottom: 0px; } +notebook > header.left tabs tab, notebook > header.right tabs tab { margin-top: 0px; margin-bottom: 0px; } notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page { border-style: solid none; } @@ -1016,15 +1016,15 @@ scrollbar.horizontal trough { min-height: 14px; border-radius: 0px; border-width scrollbar.vertical trough { min-height: 14px; border-radius: 0px; border-width: 0px 1px 0px 1px; border-image: none; background-image: linear-gradient(to right, #cdcbc9, #d6d4d2 50%); } -scrollbar.horizontal slider { background-image: linear-gradient(to bottom, rgba(161, 192, 231, 0.99) 1px, rgba(153, 186, 227, 0.99) 50%, rgba(142, 177, 222, 0.99) 50%, rgba(132, 169, 217, 0.99) 95%); } +scrollbar.horizontal slider { background-position: center center; background-image: url("assets/slider-horz-grip.png"), linear-gradient(to bottom, rgba(161, 192, 231, 0.99) 1px, rgba(153, 186, 227, 0.99) 50%, rgba(142, 177, 222, 0.99) 50%, rgba(132, 169, 217, 0.99) 95%); } -scrollbar.vertical slider { background-image: linear-gradient(to right, rgba(161, 192, 231, 0.99) 1px, rgba(153, 186, 227, 0.99) 50%, rgba(142, 177, 222, 0.99) 50%, rgba(132, 169, 217, 0.99) 95%); } +scrollbar.vertical slider { background-position: center center; background-image: url("assets/slider-vert-grip.png"), linear-gradient(to right, rgba(161, 192, 231, 0.99) 1px, rgba(153, 186, 227, 0.99) 50%, rgba(142, 177, 222, 0.99) 50%, rgba(132, 169, 217, 0.99) 95%); } -scrollbar.vertical slider:hover { background-image: linear-gradient(to right, #afcaec, #adc8eb 1px, #a1c0e7 50%, #99bae3 50%, #8cafdd 95%, #afcaec); } +scrollbar.vertical slider:hover { background-position: center center; background-image: url("assets/slider-vert-grip.png"), linear-gradient(to right, #afcaec, #adc8eb 1px, #a1c0e7 50%, #99bae3 50%, #8cafdd 95%, #afcaec); } -scrollbar.horizontal slider:hover { background-image: linear-gradient(to bottom, #afcaec, #adc8eb 1px, #a1c0e7 50%, #99bae3 50%, #8cafdd 95%, #afcaec); } +scrollbar.horizontal slider:hover { background-position: center center; background-image: url("assets/slider-horz-grip.png"), linear-gradient(to bottom, #afcaec, #adc8eb 1px, #a1c0e7 50%, #99bae3 50%, #8cafdd 95%, #afcaec); } -scrollbar slider { background-repeat: no-repeat; background-position: center center; min-width: 13px; min-height: 13px; border: 1px solid #538bd3; border-radius: 0px; } +scrollbar slider { background-repeat: no-repeat; background-position: center center; min-width: 14px; min-height: 14px; border: 1px solid #2c65ae; border-radius: 0px; } scrollbar slider:hover { background-color: #2f2f2f; } @@ -2326,8 +2326,11 @@ PanelApplet.wnck-applet .wnck-pager { outline-style: solid; outline-offset: -1px /* clock window */ #MatePanelPopupWindow { border-radius: 4px; } -/* Weird, this sets the border color of the clockmap */ -#MatePanelPopupWindow > frame > box > box > box > widget { color: #a29e9b; } +#PanelApplet > #clock-applet-button.flat.toggle { background-color: transparent; background-image: none; border-color: transparent; border-width: 0px; box-shadow: none; } + +#PanelApplet > #clock-applet-button.flat.toggle:hover { box-shadow: inset 0px 1px #a29e9b, inset 0px -1px #a29e9b, inset 1px 0px #a29e9b, inset -1px 0px #a29e9b; background-image: linear-gradient(to bottom, #ffffff 5%, #f8f8f7 95%, #edeceb); } + +#PanelApplet > #clock-applet-button.flat.toggle:checked { box-shadow: inset 0px 1px #a29e9b, inset 0px -1px #a29e9b, inset 1px 0px #a29e9b, inset -1px 0px #a29e9b; background-image: linear-gradient(to bottom, #cbc9c6, #d6d4d2 3px, #d9d7d5 4px, #cdcbc9 50%, #c9c6c4 50%, #c0bdba); } /* volume applet */ .mate-panel-applet-slider, .mate-panel-applet-slider.background { border-radius: 4px; border: 1px solid rgba(0, 0, 0, 0.23); background: transparent; } @@ -2389,13 +2392,6 @@ iconview { border-radius: 4px; } iconview:hover { background-color: #b0c8e7; } -/* Brisk menu's panel button */ -.mate-panel-menu-bar #PanelApplet button.flat.toggle.brisk-button, .mate-panel-menu-bar #PanelApplet button.flat.toggle.brisk-button:hover { background-image: none; background-color: transparent; padding: 0px; margin: 0px; border-color: transparent; border-radius: 0; border-image: none; text-shadow: none; } - -.mate-panel-menu-bar #PanelApplet button.flat.toggle.brisk-button image, .mate-panel-menu-bar #PanelApplet button.flat.toggle.brisk-button:hover image { margin: 0px; padding: 0px; } - -.mate-panel-menu-bar #PanelApplet button.flat.toggle.brisk-button:checked, .mate-panel-menu-bar #PanelApplet button.flat.toggle.brisk-button:hover:checked { box-shadow: inset 0 -3px 0 0 #89addb; } - /* mate-keyboard-layout-view, mate-keyboard-layout-chooser */ /* this way it styles only the border of the keys, the bg of the map itself use the .view class */ matekbd-keyboard-drawing { background-color: #edeceb; } |