aboutsummaryrefslogtreecommitdiff
path: root/common
diff options
context:
space:
mode:
authorHorst31802016-02-19 11:06:17 +0100
committerHorst31802016-02-19 11:06:17 +0100
commitbe715132b9747142c8bafeced7abfc4c86da93cd (patch)
treea7fdda82235a8c84e753eec309cf0de4982c49c2 /common
parent1d514cea1d669945510e30308d1a50f3e3789038 (diff)
downloadsolarc-theme-be715132b9747142c8bafeced7abfc4c86da93cd.tar.gz
solarc-theme-be715132b9747142c8bafeced7abfc4c86da93cd.tar.xz
solarc-theme-be715132b9747142c8bafeced7abfc4c86da93cd.zip
tweak notebook styling
Diffstat (limited to 'common')
-rw-r--r--common/gtk-3.0/3.20/gtk-dark.css50
-rw-r--r--common/gtk-3.0/3.20/gtk-darker.css50
-rw-r--r--common/gtk-3.0/3.20/gtk-solid-dark.css50
-rw-r--r--common/gtk-3.0/3.20/gtk-solid-darker.css50
-rw-r--r--common/gtk-3.0/3.20/gtk-solid.css50
-rw-r--r--common/gtk-3.0/3.20/gtk.css50
-rw-r--r--common/gtk-3.0/3.20/sass/_common.scss91
7 files changed, 202 insertions, 189 deletions
diff --git a/common/gtk-3.0/3.20/gtk-dark.css b/common/gtk-3.0/3.20/gtk-dark.css
index 6d619cb..70f826b 100644
--- a/common/gtk-3.0/3.20/gtk-dark.css
+++ b/common/gtk-3.0/3.20/gtk-dark.css
@@ -1494,8 +1494,10 @@ notebook {
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
notebook.frame {
border: 1px solid #2b2e39; }
+ notebook.frame header {
+ margin: -1px; }
notebook header {
- padding: 2px;
+ padding: 3px;
background-color: #383C4A; }
notebook header.top {
box-shadow: inset 0 -1px #2b2e39; }
@@ -1573,29 +1575,29 @@ notebook {
color: #D3DAE3; }
notebook header tabs arrow:disabled {
color: rgba(211, 218, 227, 0.15); }
- notebook header tab {
- background-color: rgba(64, 69, 82, 0); }
- notebook header tab label {
- color: rgba(211, 218, 227, 0.45); }
- notebook header tab:hover {
- background-color: rgba(64, 69, 82, 0.5);
- border-color: #2b2e39; }
- notebook header tab:hover label {
- color: rgba(211, 218, 227, 0.725); }
- notebook header tab:active {
- background-color: #404552;
- border-color: #2b2e39; }
- notebook header tab:active label {
- color: #D3DAE3; }
- notebook header tab button {
- min-height: 18px;
- min-width: 16px;
- padding: 0;
- color: #9da3ad; }
- notebook header tab button:hover {
- color: #ff4d4d; }
- notebook header tab button:active, notebook header tab button:active:hover {
- color: #5294E2; }
+ notebook header tab {
+ background-color: rgba(64, 69, 82, 0); }
+ notebook header tab label {
+ color: rgba(211, 218, 227, 0.45); }
+ notebook header tab:hover {
+ background-color: rgba(64, 69, 82, 0.5);
+ border-color: #2b2e39; }
+ notebook header tab:hover label {
+ color: rgba(211, 218, 227, 0.725); }
+ notebook header tab:active {
+ background-color: #404552;
+ border-color: #2b2e39; }
+ notebook header tab:active label {
+ color: #D3DAE3; }
+ notebook header tab button {
+ min-height: 18px;
+ min-width: 16px;
+ padding: 0;
+ color: #9da3ad; }
+ notebook header tab button:hover {
+ color: #ff4d4d; }
+ notebook header tab button:active, notebook header tab button:active:hover {
+ color: #5294E2; }
* {
-GtkRange-slider-width: 13;
diff --git a/common/gtk-3.0/3.20/gtk-darker.css b/common/gtk-3.0/3.20/gtk-darker.css
index 2fed205..a3a9520 100644
--- a/common/gtk-3.0/3.20/gtk-darker.css
+++ b/common/gtk-3.0/3.20/gtk-darker.css
@@ -1493,8 +1493,10 @@ notebook {
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
notebook.frame {
border: 1px solid #dcdfe3; }
+ notebook.frame header {
+ margin: -1px; }
notebook header {
- padding: 2px;
+ padding: 3px;
background-color: #F5F6F7; }
notebook header.top {
box-shadow: inset 0 -1px #dcdfe3; }
@@ -1572,29 +1574,29 @@ notebook {
color: #5c616c; }
notebook header tabs arrow:disabled {
color: rgba(92, 97, 108, 0.25); }
- notebook header tab {
- background-color: rgba(255, 255, 255, 0); }
- notebook header tab label {
- color: rgba(92, 97, 108, 0.55); }
- notebook header tab:hover {
- background-color: rgba(255, 255, 255, 0.5);
- border-color: #dcdfe3; }
- notebook header tab:hover label {
- color: rgba(92, 97, 108, 0.775); }
- notebook header tab:active {
- background-color: #ffffff;
- border-color: #dcdfe3; }
- notebook header tab:active label {
- color: #5c616c; }
- notebook header tab button {
- min-height: 18px;
- min-width: 16px;
- padding: 0;
- color: #92959d; }
- notebook header tab button:hover {
- color: #ff4d4d; }
- notebook header tab button:active, notebook header tab button:active:hover {
- color: #5294E2; }
+ notebook header tab {
+ background-color: rgba(255, 255, 255, 0); }
+ notebook header tab label {
+ color: rgba(92, 97, 108, 0.55); }
+ notebook header tab:hover {
+ background-color: rgba(255, 255, 255, 0.5);
+ border-color: #dcdfe3; }
+ notebook header tab:hover label {
+ color: rgba(92, 97, 108, 0.775); }
+ notebook header tab:active {
+ background-color: #ffffff;
+ border-color: #dcdfe3; }
+ notebook header tab:active label {
+ color: #5c616c; }
+ notebook header tab button {
+ min-height: 18px;
+ min-width: 16px;
+ padding: 0;
+ color: #92959d; }
+ notebook header tab button:hover {
+ color: #ff4d4d; }
+ notebook header tab button:active, notebook header tab button:active:hover {
+ color: #5294E2; }
* {
-GtkRange-slider-width: 13;
diff --git a/common/gtk-3.0/3.20/gtk-solid-dark.css b/common/gtk-3.0/3.20/gtk-solid-dark.css
index 6633838..9feac77 100644
--- a/common/gtk-3.0/3.20/gtk-solid-dark.css
+++ b/common/gtk-3.0/3.20/gtk-solid-dark.css
@@ -1494,8 +1494,10 @@ notebook {
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
notebook.frame {
border: 1px solid #2b2e39; }
+ notebook.frame header {
+ margin: -1px; }
notebook header {
- padding: 2px;
+ padding: 3px;
background-color: #383C4A; }
notebook header.top {
box-shadow: inset 0 -1px #2b2e39; }
@@ -1573,29 +1575,29 @@ notebook {
color: #D3DAE3; }
notebook header tabs arrow:disabled {
color: rgba(211, 218, 227, 0.15); }
- notebook header tab {
- background-color: rgba(64, 69, 82, 0); }
- notebook header tab label {
- color: rgba(211, 218, 227, 0.45); }
- notebook header tab:hover {
- background-color: rgba(64, 69, 82, 0.5);
- border-color: #2b2e39; }
- notebook header tab:hover label {
- color: rgba(211, 218, 227, 0.725); }
- notebook header tab:active {
- background-color: #404552;
- border-color: #2b2e39; }
- notebook header tab:active label {
- color: #D3DAE3; }
- notebook header tab button {
- min-height: 18px;
- min-width: 16px;
- padding: 0;
- color: #9da3ad; }
- notebook header tab button:hover {
- color: #ff4d4d; }
- notebook header tab button:active, notebook header tab button:active:hover {
- color: #5294E2; }
+ notebook header tab {
+ background-color: rgba(64, 69, 82, 0); }
+ notebook header tab label {
+ color: rgba(211, 218, 227, 0.45); }
+ notebook header tab:hover {
+ background-color: rgba(64, 69, 82, 0.5);
+ border-color: #2b2e39; }
+ notebook header tab:hover label {
+ color: rgba(211, 218, 227, 0.725); }
+ notebook header tab:active {
+ background-color: #404552;
+ border-color: #2b2e39; }
+ notebook header tab:active label {
+ color: #D3DAE3; }
+ notebook header tab button {
+ min-height: 18px;
+ min-width: 16px;
+ padding: 0;
+ color: #9da3ad; }
+ notebook header tab button:hover {
+ color: #ff4d4d; }
+ notebook header tab button:active, notebook header tab button:active:hover {
+ color: #5294E2; }
* {
-GtkRange-slider-width: 13;
diff --git a/common/gtk-3.0/3.20/gtk-solid-darker.css b/common/gtk-3.0/3.20/gtk-solid-darker.css
index e7a7e2f..eba9392 100644
--- a/common/gtk-3.0/3.20/gtk-solid-darker.css
+++ b/common/gtk-3.0/3.20/gtk-solid-darker.css
@@ -1493,8 +1493,10 @@ notebook {
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
notebook.frame {
border: 1px solid #dcdfe3; }
+ notebook.frame header {
+ margin: -1px; }
notebook header {
- padding: 2px;
+ padding: 3px;
background-color: #F5F6F7; }
notebook header.top {
box-shadow: inset 0 -1px #dcdfe3; }
@@ -1572,29 +1574,29 @@ notebook {
color: #5c616c; }
notebook header tabs arrow:disabled {
color: rgba(92, 97, 108, 0.25); }
- notebook header tab {
- background-color: rgba(255, 255, 255, 0); }
- notebook header tab label {
- color: rgba(92, 97, 108, 0.55); }
- notebook header tab:hover {
- background-color: rgba(255, 255, 255, 0.5);
- border-color: #dcdfe3; }
- notebook header tab:hover label {
- color: rgba(92, 97, 108, 0.775); }
- notebook header tab:active {
- background-color: #ffffff;
- border-color: #dcdfe3; }
- notebook header tab:active label {
- color: #5c616c; }
- notebook header tab button {
- min-height: 18px;
- min-width: 16px;
- padding: 0;
- color: #92959d; }
- notebook header tab button:hover {
- color: #ff4d4d; }
- notebook header tab button:active, notebook header tab button:active:hover {
- color: #5294E2; }
+ notebook header tab {
+ background-color: rgba(255, 255, 255, 0); }
+ notebook header tab label {
+ color: rgba(92, 97, 108, 0.55); }
+ notebook header tab:hover {
+ background-color: rgba(255, 255, 255, 0.5);
+ border-color: #dcdfe3; }
+ notebook header tab:hover label {
+ color: rgba(92, 97, 108, 0.775); }
+ notebook header tab:active {
+ background-color: #ffffff;
+ border-color: #dcdfe3; }
+ notebook header tab:active label {
+ color: #5c616c; }
+ notebook header tab button {
+ min-height: 18px;
+ min-width: 16px;
+ padding: 0;
+ color: #92959d; }
+ notebook header tab button:hover {
+ color: #ff4d4d; }
+ notebook header tab button:active, notebook header tab button:active:hover {
+ color: #5294E2; }
* {
-GtkRange-slider-width: 13;
diff --git a/common/gtk-3.0/3.20/gtk-solid.css b/common/gtk-3.0/3.20/gtk-solid.css
index fa55ed0..1ee4059 100644
--- a/common/gtk-3.0/3.20/gtk-solid.css
+++ b/common/gtk-3.0/3.20/gtk-solid.css
@@ -1497,8 +1497,10 @@ notebook {
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
notebook.frame {
border: 1px solid #dcdfe3; }
+ notebook.frame header {
+ margin: -1px; }
notebook header {
- padding: 2px;
+ padding: 3px;
background-color: #F5F6F7; }
notebook header.top {
box-shadow: inset 0 -1px #dcdfe3; }
@@ -1576,29 +1578,29 @@ notebook {
color: #5c616c; }
notebook header tabs arrow:disabled {
color: rgba(92, 97, 108, 0.25); }
- notebook header tab {
- background-color: rgba(255, 255, 255, 0); }
- notebook header tab label {
- color: rgba(92, 97, 108, 0.55); }
- notebook header tab:hover {
- background-color: rgba(255, 255, 255, 0.5);
- border-color: #dcdfe3; }
- notebook header tab:hover label {
- color: rgba(92, 97, 108, 0.775); }
- notebook header tab:active {
- background-color: #ffffff;
- border-color: #dcdfe3; }
- notebook header tab:active label {
- color: #5c616c; }
- notebook header tab button {
- min-height: 18px;
- min-width: 16px;
- padding: 0;
- color: #92959d; }
- notebook header tab button:hover {
- color: #ff4d4d; }
- notebook header tab button:active, notebook header tab button:active:hover {
- color: #5294E2; }
+ notebook header tab {
+ background-color: rgba(255, 255, 255, 0); }
+ notebook header tab label {
+ color: rgba(92, 97, 108, 0.55); }
+ notebook header tab:hover {
+ background-color: rgba(255, 255, 255, 0.5);
+ border-color: #dcdfe3; }
+ notebook header tab:hover label {
+ color: rgba(92, 97, 108, 0.775); }
+ notebook header tab:active {
+ background-color: #ffffff;
+ border-color: #dcdfe3; }
+ notebook header tab:active label {
+ color: #5c616c; }
+ notebook header tab button {
+ min-height: 18px;
+ min-width: 16px;
+ padding: 0;
+ color: #92959d; }
+ notebook header tab button:hover {
+ color: #ff4d4d; }
+ notebook header tab button:active, notebook header tab button:active:hover {
+ color: #5294E2; }
* {
-GtkRange-slider-width: 13;
diff --git a/common/gtk-3.0/3.20/gtk.css b/common/gtk-3.0/3.20/gtk.css
index fbb5803..1f8b1eb 100644
--- a/common/gtk-3.0/3.20/gtk.css
+++ b/common/gtk-3.0/3.20/gtk.css
@@ -1497,8 +1497,10 @@ notebook {
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
notebook.frame {
border: 1px solid #dcdfe3; }
+ notebook.frame header {
+ margin: -1px; }
notebook header {
- padding: 2px;
+ padding: 3px;
background-color: #F5F6F7; }
notebook header.top {
box-shadow: inset 0 -1px #dcdfe3; }
@@ -1576,29 +1578,29 @@ notebook {
color: #5c616c; }
notebook header tabs arrow:disabled {
color: rgba(92, 97, 108, 0.25); }
- notebook header tab {
- background-color: rgba(255, 255, 255, 0); }
- notebook header tab label {
- color: rgba(92, 97, 108, 0.55); }
- notebook header tab:hover {
- background-color: rgba(255, 255, 255, 0.5);
- border-color: #dcdfe3; }
- notebook header tab:hover label {
- color: rgba(92, 97, 108, 0.775); }
- notebook header tab:active {
- background-color: #ffffff;
- border-color: #dcdfe3; }
- notebook header tab:active label {
- color: #5c616c; }
- notebook header tab button {
- min-height: 18px;
- min-width: 16px;
- padding: 0;
- color: #92959d; }
- notebook header tab button:hover {
- color: #ff4d4d; }
- notebook header tab button:active, notebook header tab button:active:hover {
- color: #5294E2; }
+ notebook header tab {
+ background-color: rgba(255, 255, 255, 0); }
+ notebook header tab label {
+ color: rgba(92, 97, 108, 0.55); }
+ notebook header tab:hover {
+ background-color: rgba(255, 255, 255, 0.5);
+ border-color: #dcdfe3; }
+ notebook header tab:hover label {
+ color: rgba(92, 97, 108, 0.775); }
+ notebook header tab:active {
+ background-color: #ffffff;
+ border-color: #dcdfe3; }
+ notebook header tab:active label {
+ color: #5c616c; }
+ notebook header tab button {
+ min-height: 18px;
+ min-width: 16px;
+ padding: 0;
+ color: #92959d; }
+ notebook header tab button:hover {
+ color: #ff4d4d; }
+ notebook header tab button:active, notebook header tab button:active:hover {
+ color: #5294E2; }
* {
-GtkRange-slider-width: 13;
diff --git a/common/gtk-3.0/3.20/sass/_common.scss b/common/gtk-3.0/3.20/sass/_common.scss
index 4545492..9085f90 100644
--- a/common/gtk-3.0/3.20/sass/_common.scss
+++ b/common/gtk-3.0/3.20/sass/_common.scss
@@ -1577,24 +1577,25 @@ notebook {
background-color: $base_color;
transition: all 200ms $ease-out-quad;
- &.frame { border: 1px solid $borders_color; }
+ &.frame {
+ border: 1px solid $borders_color;
+
+ header { margin: -1px; } // ugly hack to hide the borders around the header
+ }
header {
$vpadding: 4px;
$hpadding: 15px;
- padding: 2px;
+ padding: 3px;
background-color: $bg_color;
- $_header_border: $borders_color;
-
- // FIXME use borders and margins
- &.top { box-shadow: inset 0 -1px $_header_border; }
- &.bottom { box-shadow: inset 0 1px $_header_border; }
- &.right { box-shadow: inset 1px 0 $_header_border; }
- &.left { box-shadow: inset -1px 0 $_header_border; }
+ &.top { box-shadow: inset 0 -1px $borders_color; }
+ &.bottom { box-shadow: inset 0 1px $borders_color; }
+ &.right { box-shadow: inset 1px 0 $borders_color; }
+ &.left { box-shadow: inset -1px 0 $borders_color; }
@each $_pos, $_bpos in (top, bottom), (bottom, top), (right, left), (left, right) {
-
+ // sizing and borders
&.#{$_pos} {
padding-#{$_bpos}: 0;
@@ -1603,16 +1604,16 @@ notebook {
border: 1px solid transparent;
border-#{$_bpos}: none;
+ // nicer close button placement
&.reorderable-page {
- padding-left: 12px; // for a nicer close button
- padding-right: 12px; // placement
+ padding-left: 12px;
+ padding-right: 12px;
}
-
- // Tab overlap
+ // tab overlap
@if $_pos==top or $_pos==bottom { margin-right: -1px; }
@else { margin-bottom: -1px; }
- // Tab border radius
+ // tab border radius
@if $_pos==top { border-radius: 1px 1px 0 0; }
@else if $_pos==bottom { border-radius: 0 0 1px 1px; }
@else if $_pos==left { border-radius: 1px 0 0 1px; }
@@ -1620,7 +1621,7 @@ notebook {
}
}
}
-
+ // overflow arrows
&.top, &.bottom {
tabs arrow.up {
-gtk-icon-source: -gtk-icontheme('pan-end-symbolic');
@@ -1648,41 +1649,41 @@ notebook {
&:active { color: $fg_color; }
&:disabled { color: transparentize($insensitive_fg_color,0.3); }
}
- }
-
- header tab {
- background-color: transparentize($base_color, 1);
-
- label { color: $insensitive_fg_color; }
-
- &:hover {
- background-color: transparentize($base_color, 0.5);
- border-color: $borders_color;
-
- label { color: mix($fg_color, $insensitive_fg_color, 50%); }
- }
- &:active {
- background-color: $base_color;
- border-color: $borders_color;
+ // tab colors
+ tab {
+ background-color: transparentize($base_color, 1);
- label { color: $fg_color; }
- }
+ label { color: $insensitive_fg_color; }
- button { // close button
- min-height: 18px;
- min-width: 16px;
- padding: 0;
- color: mix($bg_color, $fg_color, 35%);
+ &:hover {
+ background-color: transparentize($base_color, 0.5);
+ border-color: $borders_color;
- @extend %undecorated_button;
+ label { color: mix($fg_color, $insensitive_fg_color, 50%); }
+ }
+ &:active {
+ background-color: $base_color;
+ border-color: $borders_color;
- &:hover {
- @extend %undecorated_button;
- color: lighten(red, 15%);
+ label { color: $fg_color; }
}
- &:active, &:active:hover {
+ // close button
+ button {
+ min-height: 18px;
+ min-width: 16px;
+ padding: 0;
+ color: mix($bg_color, $fg_color, 35%);
+
@extend %undecorated_button;
- color: $selected_bg_color;
+
+ &:hover {
+ @extend %undecorated_button;
+ color: lighten(red, 15%);
+ }
+ &:active, &:active:hover {
+ @extend %undecorated_button;
+ color: $selected_bg_color;
+ }
}
}
}