From 80f65e212d540786768e0207adb98c8c413cc69c Mon Sep 17 00:00:00 2001 From: Sam Hewitt Date: Tue, 24 May 2016 14:16:34 -0400 Subject: [PATCH] a few refinements --- Paper/gtk-3.18/_colors.scss | 2 + Paper/gtk-3.18/apps/_budgie.scss | 20 ++++++---- Paper/gtk-3.18/gtk-dark.css | 5 ++- Paper/gtk-3.18/gtk.css | 55 ++++++++++++++------------- Paper/gtk-3.18/widgets/_switches.scss | 1 + Paper/gtk-3.20/_colors.scss | 2 + 6 files changed, 50 insertions(+), 35 deletions(-) diff --git a/Paper/gtk-3.18/_colors.scss b/Paper/gtk-3.18/_colors.scss index 054a1f5..a0a19ef 100644 --- a/Paper/gtk-3.18/_colors.scss +++ b/Paper/gtk-3.18/_colors.scss @@ -54,6 +54,8 @@ $base_hover_color: transparentize($fg_color, 0.95); $tooltip_borders_color: transparentize(white, 0.9); $shadow_color: transparentize(black, 0.8); +$text_shadow_color: if($variant == 'dark', $shadow_color, transparentize(white, 0.9)); +$icon_shadow_color: $text_shadow_color; $drop_target_color: #4e9a06; diff --git a/Paper/gtk-3.18/apps/_budgie.scss b/Paper/gtk-3.18/apps/_budgie.scss index 26eb988..8d38694 100644 --- a/Paper/gtk-3.18/apps/_budgie.scss +++ b/Paper/gtk-3.18/apps/_budgie.scss @@ -2,8 +2,10 @@ * Budgie * **********/ -$budgie_panel_bg_color: #263238; -$budgie_panel_fg_color: #cfd8dc; +$budgie_panel_bg_color: if($variant == 'light', $bg_color, #263238); +$budgie_panel_fg_color: if($variant == 'light', $fg_color, #cfd8dc);; + + @function gtkalpha($c,$a) { @return unquote("alpha(#{$c},#{$a})"); @@ -105,7 +107,8 @@ $asset_suffix: if($variant == 'default', '', '-hc'); font: bold; .label { color: $budgie_panel_fg_color; - text-shadow: 0 1px $shadow_color; + icon-shadow: 0 1px $icon_shadow_color; + text-shadow: 0 1px $text_shadow_color; } } @@ -115,7 +118,8 @@ $asset_suffix: if($variant == 'default', '', '-hc'); font-size: 90%; .label { color: $budgie_panel_fg_color; - text-shadow: 0 1px $shadow_color; + icon-shadow: 0 1px $icon_shadow_color; + text-shadow: 0 1px $text_shadow_color; } } @@ -166,8 +170,8 @@ $asset_suffix: if($variant == 'default', '', '-hc'); .raven-header { padding: 4px; font: bold; - text-shadow: 0 1px $shadow_color; - icon-shadow: 0 1px $shadow_color; + text-shadow: 0 1px $text_shadow_color; + icon-shadow: 0 1px $icon_shadow_color; background-color: $bg_color; background-image: linear-gradient(to bottom, lighten($bg_color, 5%), @@ -247,8 +251,8 @@ $asset_suffix: if($variant == 'default', '', '-hc'); // MPRIS Applet .raven-mpris { - text-shadow: 0 1px $shadow_color; - icon-shadow: 0 1px $shadow_color; + text-shadow: 0 1px $text-shadow_color; + icon-shadow: 0 1px $icon_shadow_color; color: $budgie_panel_fg_color; background-color: transparentize($budgie_panel_bg_color, 0.2); border: solid transparentize(black, 0.8); diff --git a/Paper/gtk-3.18/gtk-dark.css b/Paper/gtk-3.18/gtk-dark.css index 7fe73cf..dd58752 100644 --- a/Paper/gtk-3.18/gtk-dark.css +++ b/Paper/gtk-3.18/gtk-dark.css @@ -4109,7 +4109,8 @@ GtkSwitch { background-color: #3b4c55; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); } GtkSwitch:active, GtkSwitch:checked { - background-color: #449ac2; } + background-color: #449ac2; + box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); } GtkSwitch:active:backdrop, GtkSwitch:active:insensitive, GtkSwitch:checked:backdrop, GtkSwitch:checked:insensitive { background-color: #57a4c8; } GtkSwitch .slider { @@ -4894,12 +4895,14 @@ treeview.view header button:active { font: bold; } .budgie-panel BudgieMenuApplet .label { color: #cfd8dc; + icon-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2); } .budgie-panel ClockApplet { font: monospace bold; font-size: 90%; } .budgie-panel ClockApplet .label { color: #cfd8dc; + icon-shadow: 0 1px rgba(0, 0, 0, 0.2); text-shadow: 0 1px rgba(0, 0, 0, 0.2); } .budgie-panel WnckTasklist .button, .budgie-panel WnckTasklist .button:backdrop { diff --git a/Paper/gtk-3.18/gtk.css b/Paper/gtk-3.18/gtk.css index ed6a2e4..cb26037 100644 --- a/Paper/gtk-3.18/gtk.css +++ b/Paper/gtk-3.18/gtk.css @@ -4118,7 +4118,8 @@ GtkSwitch { background-color: #f2f2f2; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); } GtkSwitch:active, GtkSwitch:checked { - background-color: #347D9F; } + background-color: #347D9F; + box-shadow: inset 0 0 0 1px #275f79; } GtkSwitch:active:backdrop, GtkSwitch:active:insensitive, GtkSwitch:checked:backdrop, GtkSwitch:checked:insensitive { background-color: #3a8cb2; } GtkSwitch .slider { @@ -4754,8 +4755,8 @@ treeview.view header button:active { .top .budgie-panel .pinned .launcher, .budgie-panel .pinned .top .launcher, .top .budgie-panel .unpinned .launcher, .budgie-panel .unpinned .top .launcher { - border-bottom: 2px solid rgba(38, 50, 56, 0); - border-top: 2px solid rgba(38, 50, 56, 0); } + border-bottom: 2px solid rgba(247, 247, 247, 0); + border-top: 2px solid rgba(247, 247, 247, 0); } .top .budgie-panel .unpinned .launcher, .top .budgie-panel .pinned .launcher.running { border-top: 2px solid rgba(52, 125, 159, 0.5); } @@ -4774,8 +4775,8 @@ treeview.view header button:active { .bottom .budgie-panel .pinned .launcher, .budgie-panel .pinned .bottom .launcher, .bottom .budgie-panel .unpinned .launcher, .budgie-panel .unpinned .bottom .launcher { - border-top: 2px solid rgba(38, 50, 56, 0); - border-bottom: 2px solid rgba(38, 50, 56, 0); } + border-top: 2px solid rgba(247, 247, 247, 0); + border-bottom: 2px solid rgba(247, 247, 247, 0); } .bottom .budgie-panel .unpinned .launcher, .bottom .budgie-panel .pinned .launcher.running { border-bottom: 2px solid rgba(52, 125, 159, 0.5); } @@ -4794,8 +4795,8 @@ treeview.view header button:active { .left .budgie-panel .pinned .launcher, .budgie-panel .pinned .left .launcher, .left .budgie-panel .unpinned .launcher, .budgie-panel .unpinned .left .launcher { - border-right: 2px solid rgba(38, 50, 56, 0); - border-left: 2px solid rgba(38, 50, 56, 0); } + border-right: 2px solid rgba(247, 247, 247, 0); + border-left: 2px solid rgba(247, 247, 247, 0); } .left .budgie-panel .unpinned .launcher, .left .budgie-panel .pinned .launcher.running { border-left: 2px solid rgba(52, 125, 159, 0.5); } @@ -4814,8 +4815,8 @@ treeview.view header button:active { .right .budgie-panel .pinned .launcher, .budgie-panel .pinned .right .launcher, .right .budgie-panel .unpinned .launcher, .budgie-panel .unpinned .right .launcher { - border-left: 2px solid rgba(38, 50, 56, 0); - border-right: 2px solid rgba(38, 50, 56, 0); } + border-left: 2px solid rgba(247, 247, 247, 0); + border-right: 2px solid rgba(247, 247, 247, 0); } .right .budgie-panel .unpinned .launcher, .right .budgie-panel .pinned .launcher.running { border-right: 2px solid rgba(52, 125, 159, 0.5); } @@ -4900,22 +4901,24 @@ treeview.view header button:active { color: inherit; } .budgie-panel { - color: #cfd8dc; - background-color: #263238; } + color: #444; + background-color: #f7f7f7; } .budgie-panel:backdrop { - color: #cfd8dc; - background-color: #263238; } + color: #444; + background-color: #f7f7f7; } .budgie-panel BudgieMenuApplet { font: bold; } .budgie-panel BudgieMenuApplet .label { - color: #cfd8dc; - text-shadow: 0 1px rgba(0, 0, 0, 0.2); } + color: #444; + icon-shadow: 0 1px rgba(255, 255, 255, 0.1); + text-shadow: 0 1px rgba(255, 255, 255, 0.1); } .budgie-panel ClockApplet { font: monospace bold; font-size: 90%; } .budgie-panel ClockApplet .label { - color: #cfd8dc; - text-shadow: 0 1px rgba(0, 0, 0, 0.2); } + color: #444; + icon-shadow: 0 1px rgba(255, 255, 255, 0.1); + text-shadow: 0 1px rgba(255, 255, 255, 0.1); } .budgie-panel WnckTasklist .button, .budgie-panel WnckTasklist .button:backdrop { border-radius: 0; } @@ -4923,7 +4926,7 @@ treeview.view header button:active { transition: all 100ms cubic-bezier(0.25, 0.46, 0.45, 0.94); padding-left: 2px; padding-right: 2px; - border-color: rgba(38, 50, 56, 0); } + border-color: rgba(247, 247, 247, 0); } .budgie-panel .launcher:hover { -gtk-image-effect: highlight; } @@ -4934,8 +4937,8 @@ treeview.view header button:active { .raven .raven-header { padding: 4px; font: bold; - text-shadow: 0 1px rgba(0, 0, 0, 0.2); - icon-shadow: 0 1px rgba(0, 0, 0, 0.2); + text-shadow: 0 1px rgba(255, 255, 255, 0.1); + icon-shadow: 0 1px rgba(255, 255, 255, 0.1); background-color: #f7f7f7; background-image: linear-gradient(to bottom, white, #f7f7f7); color: #444; @@ -4984,10 +4987,10 @@ treeview.view header button:active { font-size: smaller; } .raven-mpris { - text-shadow: 0 1px rgba(0, 0, 0, 0.2); - icon-shadow: 0 1px rgba(0, 0, 0, 0.2); - color: #cfd8dc; - background-color: rgba(38, 50, 56, 0.8); + text-shadow: 0 1px rgba(255, 255, 255, 0.1); + icon-shadow: 0 1px rgba(255, 255, 255, 0.1); + color: #444; + background-color: rgba(247, 247, 247, 0.8); border: solid rgba(0, 0, 0, 0.2); border-width: 1px 0; box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), inset 0 -1px 0 0 rgba(255, 255, 255, 0.05), 0 1px 1px 0 rgba(0, 0, 0, 0.1); } @@ -5009,7 +5012,7 @@ treeview.view header button:active { color: #444; } .budgie-notification .notification-body { border: none; - color: rgba(207, 216, 220, 0.7); } + color: rgba(68, 68, 68, 0.7); } .budgie-session-dialog, .budgie-polkit-dialog { border-radius: 4px; @@ -5029,7 +5032,7 @@ treeview.view header button:active { border-radius: 0 0 4px 0; } .budgie-polkit-dialog .message { - color: rgba(207, 216, 220, 0.7); } + color: rgba(68, 68, 68, 0.7); } .budgie-polkit-dialog .failure { color: #d32f2f; } diff --git a/Paper/gtk-3.18/widgets/_switches.scss b/Paper/gtk-3.18/widgets/_switches.scss index 7b86bcb..9545309 100644 --- a/Paper/gtk-3.18/widgets/_switches.scss +++ b/Paper/gtk-3.18/widgets/_switches.scss @@ -25,6 +25,7 @@ GtkSwitch { &:active, &:checked { background-color: $selected_bg_color; + box-shadow: if($variant == 'light', inset 0 0 0 1px $selected_borders_color, 0 0 0 1px transparentize(black, 0.8)); &:backdrop, &:insensitive { diff --git a/Paper/gtk-3.20/_colors.scss b/Paper/gtk-3.20/_colors.scss index 054a1f5..0337c80 100644 --- a/Paper/gtk-3.20/_colors.scss +++ b/Paper/gtk-3.20/_colors.scss @@ -54,6 +54,8 @@ $base_hover_color: transparentize($fg_color, 0.95); $tooltip_borders_color: transparentize(white, 0.9); $shadow_color: transparentize(black, 0.8); +$text_shadow_color: if($variant == 'light', $shadow_color, transparentize(white, 0.9)); +$icon_shadow_color: $text_shadow_color; $drop_target_color: #4e9a06;