From eafa0fc568311f8fd08bbfd33e9e74f8c0d5cf26 Mon Sep 17 00:00:00 2001 From: Horst3180 Date: Thu, 4 Jun 2015 13:44:29 +0200 Subject: add dark variant --- common/gtk-3.0/3.16/_common.scss | 37 +++++++++++++++++++------------------ 1 file changed, 19 insertions(+), 18 deletions(-) (limited to 'common/gtk-3.0/3.16/_common.scss') diff --git a/common/gtk-3.0/3.16/_common.scss b/common/gtk-3.0/3.16/_common.scss index 164ed58..a919e8c 100644 --- a/common/gtk-3.0/3.16/_common.scss +++ b/common/gtk-3.0/3.16/_common.scss @@ -3,6 +3,7 @@ } $ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94); +$asset_suffix: if($variant=='dark', '-dark', ''); // use dark assets in dark variant * { background-clip: padding-box; @@ -1880,13 +1881,13 @@ GtkSwitch { // load switch troughs from .png files in assets directory #{$i}GtkSwitch.trough#{$k} { - background-image: -gtk-scaled(url("assets/switch#{$l}#{$j}.png"),url("assets/switch#{$l}#{$j}@2.png")); + background-image: -gtk-scaled(url("assets/switch#{$l}#{$j}#{$asset_suffix}.png"),url("assets/switch#{$l}#{$j}#{$asset_suffix}@2.png")); } // load switch sliders from .png files in assets directory //#{$i}GtkSwitch.slider#{$k} { - // background-image: -gtk-scaled(url("assets/switch-slider#{$l}#{$j}.png"),url("assets/switch-slider#{$l}#{$j}@2.png")); + // background-image: -gtk-scaled(url("assets/switch-slider#{$l}#{$j}#{$asset_suffix}.png"),url("assets/switch-slider#{$l}#{$j}#{$asset_suffix}@2.png")); //} } } @@ -1909,8 +1910,8 @@ GtkSwitch { (':checked', '-checked'), (':checked:insensitive','-checked-insensitive') { .#{$w}#{$s} { - -gtk-icon-source: -gtk-scaled(url("assets/#{$a}#{$as}.png"), - url("assets/#{$a}#{$as}@2.png")); + -gtk-icon-source: -gtk-scaled(url("assets/#{$a}#{$as}#{$asset_suffix}.png"), + url("assets/#{$a}#{$as}#{$asset_suffix}@2.png")); } // the borders of checks and radios are // too similar in luminosity to the selected background color, hence @@ -1928,8 +1929,8 @@ GtkSwitch { (':checked', '-checked-selectionmode') { GtkIconView.view.check#{$s}, GtkFlowBox.view.check#{$s} { - -gtk-icon-source: -gtk-scaled(url("assets/checkbox#{$as}.png"), - url("assets/checkbox#{$as}@2.png")); + -gtk-icon-source: -gtk-scaled(url("assets/checkbox#{$as}#{$asset_suffix}.png"), + url("assets/checkbox#{$as}#{$asset_suffix}@2.png")); background-color: transparent; } } @@ -2706,20 +2707,20 @@ GtkVolumeButton.button { padding: 8px; } &:backdrop { opacity: 1; } } - &.close { background-image: -gtk-scaled(url('assets/titlebutton-close.png'),url('assets/titlebutton-close@2.png')); } - &.close:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-close-backdrop.png'),url('assets/titlebutton-close-backdrop@2.png')); } - &.close:hover { background-image: -gtk-scaled(url('assets/titlebutton-close-hover.png'),url('assets/titlebutton-close-hover@2.png')); } - &.close:active { background-image: -gtk-scaled(url('assets/titlebutton-close-active.png'),url('assets/titlebutton-close-active@2.png')); } + &.close { background-image: -gtk-scaled(url('assets/titlebutton-close#{$asset_suffix}.png'),url('assets/titlebutton-close#{$asset_suffix}@2.png')); } + &.close:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-close-backdrop#{$asset_suffix}.png'),url('assets/titlebutton-close-backdrop#{$asset_suffix}@2.png')); } + &.close:hover { background-image: -gtk-scaled(url('assets/titlebutton-close-hover#{$asset_suffix}.png'),url('assets/titlebutton-close-hover#{$asset_suffix}@2.png')); } + &.close:active { background-image: -gtk-scaled(url('assets/titlebutton-close-active#{$asset_suffix}.png'),url('assets/titlebutton-close-active#{$asset_suffix}@2.png')); } - &.maximize { background-image: -gtk-scaled(url('assets/titlebutton-max.png'),url('assets/titlebutton-max@2.png')); } - &.maximize:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-max-backdrop.png'),url('assets/titlebutton-max-backdrop@2.png')); } - &.maximize:hover { background-image: -gtk-scaled(url('assets/titlebutton-max-hover.png'),url('assets/titlebutton-max-hover@2.png')); } - &.maximize:active { background-image: -gtk-scaled(url('assets/titlebutton-max-active.png'),url('assets/titlebutton-max-active@2.png')); } + &.maximize { background-image: -gtk-scaled(url('assets/titlebutton-max#{$asset_suffix}.png'),url('assets/titlebutton-max#{$asset_suffix}@2.png')); } + &.maximize:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-max-backdrop#{$asset_suffix}.png'),url('assets/titlebutton-max-backdrop#{$asset_suffix}@2.png')); } + &.maximize:hover { background-image: -gtk-scaled(url('assets/titlebutton-max-hover#{$asset_suffix}.png'),url('assets/titlebutton-max-hover#{$asset_suffix}@2.png')); } + &.maximize:active { background-image: -gtk-scaled(url('assets/titlebutton-max-active#{$asset_suffix}.png'),url('assets/titlebutton-max-active#{$asset_suffix}@2.png')); } - &.minimize { background-image: -gtk-scaled(url('assets/titlebutton-min.png'),url('assets/titlebutton-min@2.png')); } - &.minimize:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-min-backdrop.png'),url('assets/titlebutton-min-backdrop@2.png')); } - &.minimize:hover { background-image: -gtk-scaled(url('assets/titlebutton-min-hover.png'),url('assets/titlebutton-min-hover@2.png')); } - &.minimize:active { background-image: -gtk-scaled(url('assets/titlebutton-min-active.png'),url('assets/titlebutton-min-active@2.png')); } + &.minimize { background-image: -gtk-scaled(url('assets/titlebutton-min#{$asset_suffix}.png'),url('assets/titlebutton-min#{$asset_suffix}@2.png')); } + &.minimize:backdrop { background-image: -gtk-scaled(url('assets/titlebutton-min-backdrop#{$asset_suffix}.png'),url('assets/titlebutton-min-backdrop#{$asset_suffix}@2.png')); } + &.minimize:hover { background-image: -gtk-scaled(url('assets/titlebutton-min-hover#{$asset_suffix}.png'),url('assets/titlebutton-min-hover#{$asset_suffix}@2.png')); } + &.minimize:active { background-image: -gtk-scaled(url('assets/titlebutton-min-active#{$asset_suffix}.png'),url('assets/titlebutton-min-active#{$asset_suffix}@2.png')); } } } -- cgit v1.2.3