Skip to content
This repository has been archived by the owner on May 29, 2018. It is now read-only.

Commit

Permalink
switch style improvements
Browse files Browse the repository at this point in the history
  • Loading branch information
@AmperSam-git
AmperSam-git committed May 23, 2016
1 parent 3b3c58f commit 3c0ec75
Show file tree
Hide file tree
Showing 5 changed files with 159 additions and 132 deletions.
47 changes: 31 additions & 16 deletions Paper/gtk-3.18/apps/_budgie.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,11 +41,13 @@ $asset_suffix: if($variant == 'default', '', '-hc');

// Budgie
.budgie-container {
border: none;
box-shadow: none;
background: transparent;
font-size: 100%;
transition: 170ms ease-out;
background-image: none;
background-color: transparent;

&:backdrop {
background-image: none;
background-color: transparent;
}
}

// Budgie Menu
Expand Down Expand Up @@ -145,7 +147,6 @@ $asset_suffix: if($variant == 'default', '', '-hc');
.raven {
color: $fg_color;
background-color: transparentize($bg_color, 0.02);
transition: 170ms ease-out;

.raven-header {
font: bold;
Expand All @@ -160,23 +161,28 @@ $asset_suffix: if($variant == 'default', '', '-hc');
&.top { border-top-style: none; }
&.bottom { border-bottom-style: none; }

>.button {
font:normal;
}
}

@if $variant=='default' {
.expander-button { color: gtkalpha(currentColor, 0.5); }
}

.raven-background {
background:transparent;
background-color: $base_color;
border-bottom: 1px solid $borders_color;
box-shadow:inset 0 1px 0 0 transparentize(white,0.9), 0 1px 1px 0 transparentize(black,0.9);

&.middle { border-bottom-style: none; } // applet background between two headers

}

.raven-calendar {
border:none;
padding: 2px;
border-bottom:1px solid $borders_color;
}


.powerstrip {
background-color: transparent;
border: none;
Expand All @@ -192,11 +198,14 @@ $asset_suffix: if($variant == 'default', '', '-hc');
font-size: 100%;

&:hover {
background: transparentize(black,0.9);
border: 1px solid transparentize(black,0.8);
box-shadow: inset 0 1px transparentize(white,0.9), 1px 1px transparentize(black,0.8);
transition: 170ms ease all;
}

&:active {
box-shadow: 0 1px transparentize(white,0.9);
transition: 170ms ease all;
}
}

.option-subtitle {
Expand All @@ -219,21 +228,27 @@ $asset_suffix: if($variant == 'default', '', '-hc');

// Notifications
.budgie-notification-window {
border-radius: 1px;
border:none;
border-top: 1px solid transparentize(white,0.9);
border-radius: 4px;
background-color: $bg_color;
box-shadow: 0 2px 2px 0 $shadow_color;
}

.budgie-notification {

&.background {
background-color: white;
border-radius: 4px;
}

.notification-title {
font-size: 110%;
color: $fg_color;
}

.notification-body { color: transparentize($budgie_panel_fg_color, 0.3); }
.notification-body {
border:none;
color: transparentize($budgie_panel_fg_color, 0.3);
}
}

.drop-shadow {
Expand Down
71 changes: 36 additions & 35 deletions Paper/gtk-3.18/gtk-dark.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4236,36 +4236,33 @@ GtkSwitch {
outline-offset: -4px;
transition: all 200ms ease-in;
border: none;
border-radius: 14px;
border-radius: 16px;
color: transparent;
background-color: transparent;
background-color: rgba(0, 0, 0, 0.2);
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3); }
GtkSwitch:insensitive {
background-color: rgba(0, 0, 0, 0.1); }
GtkSwitch:backdrop {
background-color: #37474f;
transition: 200ms ease-out; }
GtkSwitch:backdrop:insensitive {
background-color: #3d4f57; }
background-color: rgba(0, 0, 0, 0.1);
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); }
GtkSwitch:active, GtkSwitch:checked {
background-color: #449ac2; }
GtkSwitch:active:backdrop, GtkSwitch:checked:backdrop {
background-color: #57a4c8; }
GtkSwitch:active:backdrop .slider:backdrop,
GtkSwitch:active:backdrop slider:backdrop, GtkSwitch:checked:backdrop .slider:backdrop,
GtkSwitch:checked:backdrop slider:backdrop {
box-shadow: none;
background-color: rgba(55, 71, 79, 0.9);
border: none; }
GtkSwitch .slider {
padding: 2px;
border-radius: 50%;
border: none;
padding: 3px;
border-radius: 12px;
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
background-color: #2d3940;
box-shadow: none; }
background-color: #455a64;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.2), 0 1px 2px 0 rgba(0, 0, 0, 0.2); }
GtkSwitch .slider:active {
background-color: white;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2), 0 1px 2px 0 rgba(0, 0, 0, 0.2); }
GtkSwitch .slider:backdrop {
box-shadow: none; }
background-color: #475d67;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1); }
GtkSwitch .slider:insensitive {
background-color: #3b4c55;
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: none; }
GtkSwitch .trough:active, GtkSwitch .trough:checked {
background-color: #449ac2; }
Expand Down Expand Up @@ -4923,11 +4920,11 @@ treeview.view header button:active {
border-right: 2px solid #449ac2; }

.budgie-container {
border: none;
box-shadow: none;
background: transparent;
font-size: 100%;
transition: 170ms ease-out; }
background-image: none;
background-color: transparent; }
.budgie-container:backdrop {
background-image: none;
background-color: transparent; }

.budgie-menu GtkSearchEntry.entry:not(:selected) {
border: none;
Expand Down Expand Up @@ -5009,8 +5006,7 @@ treeview.view header button:active {

.raven {
color: #cfd8dc;
background-color: rgba(55, 71, 79, 0.98);
transition: 170ms ease-out; }
background-color: rgba(55, 71, 79, 0.98); }
.raven .raven-header {
font: bold;
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
Expand All @@ -5024,14 +5020,16 @@ treeview.view header button:active {
border-top-style: none; }
.raven .raven-header.bottom {
border-bottom-style: none; }
.raven .raven-header > .button {
font: normal; }
.raven .raven-background {
background: transparent;
background-color: #455a64;
border-bottom: 1px solid #222c31;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.1); }
.raven .raven-background.middle {
border-bottom-style: none; }
.raven .raven-calendar {
border: none;
padding: 2px;
border-bottom: 1px solid #222c31; }
.raven .powerstrip {
background-color: transparent;
border: none;
Expand All @@ -5044,10 +5042,11 @@ treeview.view header button:active {
box-shadow: 0 1px rgba(255, 255, 255, 0.1);
font-size: 100%; }
.raven .powerstrip .button:hover {
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 1px 1px rgba(0, 0, 0, 0.2);
transition: 170ms ease all; }
.raven .powerstrip .button:active {
box-shadow: 0 1px rgba(255, 255, 255, 0.1);
transition: 170ms ease all; }
.raven .option-subtitle {
font-size: smaller; }

Expand All @@ -5063,15 +5062,17 @@ treeview.view header button:active {
padding: 8px; }

.budgie-notification-window {
border-radius: 1px; }
border: none;
border-top: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 4px;
background-color: #37474f;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); }

.budgie-notification.background {
background-color: white;
border-radius: 4px; }
.budgie-notification .notification-title {
font-size: 110%;
color: #cfd8dc; }
.budgie-notification .notification-body {
border: none;
color: rgba(207, 216, 220, 0.7); }

.drop-shadow, .budgie-session-dialog.background, .background.budgie-polkit-dialog {
Expand Down
69 changes: 35 additions & 34 deletions Paper/gtk-3.18/gtk.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4245,36 +4245,33 @@ GtkSwitch {
outline-offset: -4px;
transition: all 200ms ease-in;
border: none;
border-radius: 14px;
border-radius: 16px;
color: transparent;
background-color: rgba(0, 0, 0, 0.1);
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0px 1px rgba(255, 255, 255, 0.3); }
GtkSwitch:insensitive {
background-color: rgba(0, 0, 0, 0.1); }
GtkSwitch:backdrop {
background-color: #f7f7f7;
transition: 200ms ease-out; }
GtkSwitch:backdrop:insensitive {
background-color: #fafafa; }
background-color: rgba(0, 0, 0, 0.1);
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); }
GtkSwitch:active, GtkSwitch:checked {
background-color: #347D9F; }
GtkSwitch:active:backdrop, GtkSwitch:checked:backdrop {
background-color: #3a8cb2; }
GtkSwitch:active:backdrop .slider:backdrop,
GtkSwitch:active:backdrop slider:backdrop, GtkSwitch:checked:backdrop .slider:backdrop,
GtkSwitch:checked:backdrop slider:backdrop {
box-shadow: none;
background-color: rgba(247, 247, 247, 0.9);
border: none; }
GtkSwitch .slider {
padding: 2px;
border-radius: 50%;
border: none;
padding: 3px;
border-radius: 12px;
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
background-color: #f7f7f7;
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.2); }
background-color: #ffffff;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.2), 0 1px 2px 0 rgba(0, 0, 0, 0.2); }
GtkSwitch .slider:active {
background-color: white;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2), 0 1px 2px 0 rgba(0, 0, 0, 0.2); }
GtkSwitch .slider:backdrop {
box-shadow: none; }
background-color: #fcfcfc;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1); }
GtkSwitch .slider:insensitive {
background-color: #f2f2f2;
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: none; }
GtkSwitch .trough:active, GtkSwitch .trough:checked {
background-color: #347D9F; }
Expand Down Expand Up @@ -4938,11 +4935,11 @@ treeview.view header button:active {
border-right: 2px solid #347D9F; }

.budgie-container {
border: none;
box-shadow: none;
background: transparent;
font-size: 100%;
transition: 170ms ease-out; }
background-image: none;
background-color: transparent; }
.budgie-container:backdrop {
background-image: none;
background-color: transparent; }

.budgie-menu GtkSearchEntry.entry:not(:selected) {
border: none;
Expand Down Expand Up @@ -5024,8 +5021,7 @@ treeview.view header button:active {

.raven {
color: #444;
background-color: rgba(247, 247, 247, 0.98);
transition: 170ms ease-out; }
background-color: rgba(247, 247, 247, 0.98); }
.raven .raven-header {
font: bold;
text-shadow: 0 1px rgba(0, 0, 0, 0.2);
Expand All @@ -5039,14 +5035,16 @@ treeview.view header button:active {
border-top-style: none; }
.raven .raven-header.bottom {
border-bottom-style: none; }
.raven .raven-header > .button {
font: normal; }
.raven .raven-background {
background: transparent;
background-color: #ffffff;
border-bottom: 1px solid #d1d1d1;
box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.1); }
.raven .raven-background.middle {
border-bottom-style: none; }
.raven .raven-calendar {
border: none;
padding: 2px;
border-bottom: 1px solid #d1d1d1; }
.raven .powerstrip {
background-color: transparent;
border: none;
Expand All @@ -5059,10 +5057,11 @@ treeview.view header button:active {
box-shadow: 0 1px rgba(255, 255, 255, 0.1);
font-size: 100%; }
.raven .powerstrip .button:hover {
background: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 1px 1px rgba(0, 0, 0, 0.2);
transition: 170ms ease all; }
.raven .powerstrip .button:active {
box-shadow: 0 1px rgba(255, 255, 255, 0.1);
transition: 170ms ease all; }
.raven .option-subtitle {
font-size: smaller; }

Expand All @@ -5078,15 +5077,17 @@ treeview.view header button:active {
padding: 8px; }

.budgie-notification-window {
border-radius: 1px; }
border: none;
border-top: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 4px;
background-color: #f7f7f7;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2); }

.budgie-notification.background {
background-color: white;
border-radius: 4px; }
.budgie-notification .notification-title {
font-size: 110%;
color: #444; }
.budgie-notification .notification-body {
border: none;
color: rgba(207, 216, 220, 0.7); }

.drop-shadow, .budgie-session-dialog.background, .background.budgie-polkit-dialog {
Expand Down
Loading

0 comments on commit 3c0ec75

Please sign in to comment.