luneko/SweetTokyoNight
1
0
Fork 0
mirror of https://github.com/luneko/SweetTokyoNight.git synced 2025-12-13 23:39:51 +01:00
Code Issues Projects Releases Wiki Activity

Update colors

Browse Source
This commit is contained in:
EliverLara
2018-11-17 15:34:25 -06:00
parent b1d77ca629
commit cecc03c7f4
211 changed files with 2724 additions and 2304 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
gtk-3.0/_colors.scss
View File

@@ -2,19 +2,22 @@
// it gets @if ed depending on $variant
// Main definitions
$base_color: if($variant == 'light', #ebf0f5, lighten(#161925, 1%));
$text_color: if($variant == 'light', #31363D, #C3C7D1);
$bg_color: if($variant == 'light', darken( #EEEEEE, 3%), #161925);
$fg_color: if($variant == 'light', #31363d, #C3C7D1);
$base_color: if($variant == 'light', #ebf0f5, lighten(#1A1E21, 1%));
$text_color: if($variant == 'light', #31363D, #5D5E60);
$bg_color: if($variant == 'light', darken( #EEEEEE, 3%), #1A1E21);
$fg_color: if($variant == 'light', #31363d, #5D5E60);
$switch_bg: if($variant == 'light', #ffffff, transparentize(black,1));
$shadow_color: rgba(162, 162, 165, 0.21);
$_sidebar_color: if($variant == 'light', #222e39, #161925);
$main_dark_color:darken($bg_color, 2%);
$_sidebar_color: if($variant == 'light', darken($main_dark_color, 3%), $main_dark_color);
// Primary colors
$lime: #71f79f;
$red: #ed254e;
$orange: #ff6a00;
$yellow: #f9dc5c;
$lime: #CAE7B9;
$red: #F67E7D;
$purple: #D7BCC8;
$cyan: #A0C1B9;
$yellow: #E1DD8F;
$orange: #F79F79;
$purple: #c74ded;
$darkpurple: #7b7bbd;
$blue: #7cb7ff;
@@ -22,8 +25,8 @@ $cyan: #00c1e4;
$slider: #7b7bbd;
$teal: #00e8c6;
$selected_fg_color: #fefefe;
$selected_bg_color: #c50ed2;
$selected_fg_color: #f7f7f7;
$selected_bg_color: $red;
//$selected_bg_color: #f7005a;
/*$selected_bg_color: #00e8c6;06d6a0*/
$selected_borders_color: darken($selected_bg_color, 10%);
@@ -107,6 +110,6 @@ $backdrop_menu_color: if($variant == 'light', $backdrop_base_color, mix($backdro
$scale_bg: if($variant == 'light', transparentize(black,0.86) ,transparentize(white,0.86));
$scale_disabled_bg: if($variant == 'light', transparentize(black, 0.94) ,transparentize(white, 0.94));
$suggested_bg_color: linear-gradient(to right, #654ea3 0%, #eaafc8 100%);
$destructive_bg_color: linear-gradient(to right, #FF416C, #FF4B2B);
$suggested_bg_color: linear-gradient(to right, #485563 0%, #29323c 100%);
$destructive_bg_color: linear-gradient(to right, $red, $orange);
$menu_shadow_color: if($variant == 'light', transparentize(rgb(122, 122, 122), 0.6), transparent);

9
gtk-3.0/_drawing.scss
View File

@@ -205,14 +205,15 @@
@if $t==rounded {
box-shadow: none;
// border: 1px solid $c;
text-shadow: 0px 0px 2px rgba(87, 87, 87, 0.9);
color: white;
border-radius: 100px;
background: $suggested_bg_color; }
background: $suggested_bg_color;
}
@if $t==rounded-red {
box-shadow: none;
// border: 1px solid $c;
text-shadow: 0px 0px 2px rgba(87, 87, 87, 0.9);
color: white;
border-radius: 100px;
background: $destructive_bg_color;
@@ -595,5 +596,5 @@ box-shadow: none;
}
@mixin scale-highlight($dir) {
background: linear-gradient(to $dir, #00f17d, #00f7d2);
background: linear-gradient(to $dir, #ff005d, #ff8b26);
}

26
gtk-3.0/apps/_gnome.scss
View File

@@ -2,15 +2,6 @@
* Nautilus *
************/
.nautilus-window {
.frame{
*:selected, *:selected:backdrop{
background: transparent;
color: $selected_bg_color;
label {
color: $selected_bg_color;
}
}
}
paned {
> separator { background-image: none; }
}
@@ -59,6 +50,13 @@
background-color: $base_color;
&:backdrop { background-color: $backdrop_base_color; }
}
*:selected, *:selected:backdrop{
background: transparent;
color: $selected_bg_color;
label {
color: $selected_bg_color;
}
}
}
searchbar {
@@ -77,13 +75,13 @@
button {
&:active, &:checked {
border-radius: 23px;
background: linear-gradient(to right, #c50ed2, #8500f7);
box-shadow: 0px 0px 5px transparentize(#c50ed2, 0.02);
color: rgb(250, 250, 250);
background: linear-gradient(to right, $red, $yellow);
color: $selected_fg_color;
text-shadow: 0px 0px 2px rgba(87, 87, 87, 0.9);
&:backdrop{
color: darken(rgb(250, 250, 250), 4%);
color: darken($selected_fg_color, 4%);
label{
color: darken(rgb(250, 250, 250), 4%);;
color: darken($selected_fg_color, 4%);;
}
}
}

1580
gtk-3.0/gtk-dark.css
View File

File diff suppressed because it is too large Load Diff

1580
gtk-3.0/gtk.css
View File

File diff suppressed because it is too large Load Diff

20
gtk-3.0/widgets/_buttons.scss
View File

@@ -246,24 +246,24 @@ button {
//color: $b_color; //FIXME: does it work on the dark variant?
}
&:hover { @include button(hover, $b_color, white); }
&:hover { @include button(hover, transparent, white); }
&:active,
&:checked { @include button(active, $b_color, white); }
&:checked { @include button(active, transparent, white); }
&:backdrop,
&.flat:backdrop {
@include button(backdrop, $b_color, white);
@include button(backdrop, transparent, white);
label { color: transparentize(white, 0.5);}
&:active,
&:checked { @include button(backdrop-active, $b_color, white); }
&:checked { @include button(backdrop-active, transparent, white); }
&:disabled {
@include button(backdrop-insensitive, $b_color, white);
@include button(backdrop-insensitive, transparent, white);
label { color: transparentize(white, 0.5);}
&:active,
&:checked { @include button(backdrop-insensitive-active, $b_color, white); }
&:checked { @include button(backdrop-insensitive-active, transparent, white); }
}
}
@@ -276,10 +276,12 @@ button {
}
&:disabled {
@include button(insensitive, $b_color, white);
@include button(insensitive, transparent, white);
label {
color:transparentize(#ffffff, 0.7);
}
&:active,
&:checked { @include button(insensitive-active, $b_color, white); }
&:checked { @include button(insensitive-active, transparent, white); }
}
.osd & {

1
gtk-3.0/widgets/_floating-bar.scss
View File

@@ -7,7 +7,6 @@
border-style: solid solid none;
border-color: $borders_color;
border-radius: 3px 3px 0 0;
box-shadow: inset 0 1px $top_highlight;
&.bottom {

37
gtk-3.0/widgets/_header-bars.scss
View File

@@ -5,9 +5,10 @@
headerbar {
padding: 0px 13px;
min-height: 34px;
background: if($variant == 'light', linear-gradient(to bottom, #fff, #fff) , mix($base_color, darken($headerbar_color, 8%), 30%));
background: if($variant == 'light', linear-gradient(to bottom, #fff, #fff) , darken($headerbar_color, 1%));
color: $headerbar_fg_color;
border-radius: 0;
box-shadow: 0px -1px $borders_color inset;
&:backdrop {
border-color: $backdrop_borders_color;
// background-image: none;
@@ -99,22 +100,22 @@ headerbar {
border-radius: 4px;
@include button(normal, $b_color, white);
box-shadow: none;
text-shadow: 0px 0px 2px rgba(87, 87, 87, 0.9);
&:hover { @include button(hover, transparent, white); }
&:hover { @include button(hover, $b_color, white); }
&:active { @include button(active, $b_color, white); }
&:active { @include button(active, transparent, white); }
&:disabled {
@include button(insensitive, $b_color, white);
@include button(insensitive, transparent, white);
label {color: transparentize(white,0.5);}
}
&:backdrop {
@include button(backdrop, $b_color, white);
@include button(backdrop, transparent, white);
border-radius: 3px;
}
&:backdrop:disabled { @include button(backdrop-insensitive, $b_color, white); }
&:backdrop:disabled { @include button(backdrop-insensitive, transparent, white); }
}
}
@@ -162,19 +163,20 @@ headerbar {
}
.linked > button:active{
@extend %linked-header;
background: linear-gradient(to right, #c50ed2, #8500f7) ;
color: rgb(255, 250, 250);
background: linear-gradient(to right, $red, $yellow) ;
color: $selected_fg_color;
text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9);
}
.linked > button:checked{
.linked > button:checked {
@extend %linked-header;
border-radius: 23px;
background: linear-gradient(to right, #c50ed2, #8500f7);
box-shadow: 0px 0px 5px transparentize(#c50ed2, 0.02);
color: rgb(255, 250, 250);
background: linear-gradient(to right, $red, $yellow);
color: $selected_fg_color;
text-shadow: 0px 0px 2px rgba(87, 87, 87, 0.9);
&:backdrop{
color: darken(rgb(255, 250, 250), 4%);
color: darken($selected_fg_color, 4%);
label{
color: darken(rgb(255, 250, 250), 4%);;
color: darken($selected_fg_color, 4%);;
}
}
}
@@ -186,7 +188,6 @@ headerbar {
&.selection-mode {
button {
&:backdrop {
&.flat, & {
&:active,
@@ -207,7 +208,7 @@ headerbar {
.maximized & {
&.titlebar {
@if $variant == 'light' { box-shadow: none; }
@else { box-shadow: inset 0 -1px $bottom_highlight; }
@else { box-shadow: inset 0 -1px $borders_color; }
}
&:backdrop, & { border-radius: 0; }
} // squared corners when the window is maximized or tiled
@@ -242,7 +243,7 @@ headerbar {
.background:not(.tiled):not(.maximized) .titlebar {
@if $variant == 'light' { box-shadow: inset 0 1px $top_highlight; }
@else { box-shadow: inset 0 1px $top_highlight,inset 0 -1px $bottom_highlight; }
@else { box-shadow: inset 0 1px $top_highlight, inset 0 -1px $borders_color; }
&:backdrop, & {

18
gtk-3.0/widgets/_notebooks.scss
View File

@@ -6,7 +6,7 @@ notebook {
padding: 1px;
border-color: $borders_color;
border-width: 1px;
background-color: $base_color;
background-color: $bg_color;
&:backdrop {
border-color: $backdrop_borders_color;
@@ -25,8 +25,8 @@ notebook {
&:backdrop { box-shadow: none; }
&:checked {
background-color: $base_color;
&:hover{background-color: $base_color;}
background-color: $bg_color;
&:hover{background-color: $bg_color;}
}
}
}
@@ -42,7 +42,7 @@ notebook {
&:backdrop { box-shadow: none; }
&:checked {
background-color: $base_color;
background-color: $bg_color;
box-shadow: -1px 0 0 $borders_color,
0px 1px 0 $borders_color,
1px 0 0 $borders_color;
@@ -61,7 +61,7 @@ notebook {
&:backdrop { box-shadow: none; }
&:checked {
background-color: $base_color;
background-color: $bg_color;
box-shadow: 0px 1px 0 $borders_color,
0px -1px 0 $borders_color,
0px 1px 0 $borders_color;
@@ -80,7 +80,7 @@ notebook {
&:backdrop { box-shadow: none; }
&:checked {
background-color: $base_color;
background-color: $bg_color;
box-shadow: 0px 1px 0 $borders_color,
0px -1px 0 $borders_color,
1px 0 0 $borders_color;
@@ -203,7 +203,7 @@ notebook {
color: $backdrop_fg_color;
&.reorderable-page {
border-color: $backdrop_borders_color;
background-color: $backdrop_base_color;
background-color: $backdrop_bg_color;
}
}
@@ -288,8 +288,8 @@ notebook {
}
> stack:not(:only-child) { // the :not(:only-child) is for "hidden" notebooks
background-color: $base_color;
background-color: $bg_color;
&:backdrop { background-color: $backdrop_base_color; }
&:backdrop { background-color: $backdrop_bg_color; }
}
}

10
gtk-3.0/widgets/_scales.scss
View File

@@ -30,8 +30,8 @@
&:backdrop,
&:active:backdrop {
border-color: lighten($selected_bg_color, 5%);
background-color: lighten($selected_bg_color, 5%);
border-color: lighten(#ff8b26, 5%);
background-color: lighten(#ff8b26, 5%);
&:disabled {
background-color: $scale_disabled_bg;
}
@@ -74,7 +74,7 @@ scale {
transition-property: background, border, box-shadow;
&:active {
background-color: $selected_bg_color;
background-color: #ff8b26;
&:disabled {
background-color: $insensitive_bg_color;
@@ -152,7 +152,7 @@ scale {
$_scale_disabled_bg: darken($_scale_bg, 15%);
slider {
border-color: $base_color;
border: 2px solid #00f17d;
border: 2px solid #ff8b26;
border-radius: 12px;
background-color: $_scale_bg;
@@ -284,7 +284,7 @@ scale {
min-height: 15px;
min-width: 15px;
margin: -7px;
border: 2px solid #00f17d;
border: 2px solid #ff8b26;
border-radius: 50%;
background-color: $_scale_bg;

67
gtk-3.0/widgets/_sidebar.scss
View File

@@ -31,30 +31,7 @@
transition: $backdrop_transition;
}
row{
padding: 8px 12px;
transition: all .12s ease-in;
label{
color: #98abb2;
}
&:selected{
color: #fff;
// border-left: 4px solid $selected_bg_color;
&:backdrop{
color: $backdrop_selected_bg_color;
background: transparent;
label{
color: #fff;
}
}
&:hover{
// background-color: transparentize($selected_bg_color, 0.8);
}
label{
color: #fff;
}
}
}
//elementary os file manager
&.source-list{
@@ -84,6 +61,33 @@
paned & { &.left, &.right, &.left:dir(rtl), &:dir(rtl), &:dir(ltr), & {
border-style: none;
border-color: $borders_color;
list {
row{
padding: 8px 12px;
transition: all .12s ease-in;
label{
color: $fg_color;
}
&:selected{
color: lighten($fg_color, 20%);
// border-left: 4px solid $selected_bg_color;
&:backdrop{
color: $backdrop_selected_bg_color;
background: transparent;
label{
color: lighten($fg_color, 20%);
}
}
&:hover{
// background-color: transparentize($selected_bg_color, 0.8);
}
label{
color: lighten($fg_color, 20%);
}
}
}
}
}
}
}
@@ -119,11 +123,10 @@ stacksidebar {
/*******************************************************************/
/*--*/
placessidebar{
&.sidebar{
background-color: transparent;
background-image:linear-gradient(to right, #171e27 40px,
background-image:linear-gradient(to right, darken($main_dark_color, 2%) 40px,
$_sidebar_color 35px,$_sidebar_color 36px,
$_sidebar_color 36px,$_sidebar_color 99%,
$_sidebar_color 100%);
@@ -135,7 +138,7 @@ placessidebar{
margin-right: 12px;
padding-left: 14px;
padding-right: 12px;
color: #9ecfa2;
color: $fg_color;
}
}
&:hover{
@@ -153,9 +156,9 @@ placessidebar{
}
&:selected{
color: rgba(255, 255, 255, 0.938);
color: $selected_fg_color;
background-color: transparent;
background-image:linear-gradient(to right, $selected_bg_color 40px,
background-image:linear-gradient(to right, darken($main_dark_color, 5%) 40px,
rgba(65,67,75,0) 36px, rgba(65,67,75,0)97%);
&:hover{
color: #ffffff;
@@ -165,14 +168,14 @@ placessidebar{
}
}
&:backdrop{
color: rgba(0,0,0,0.54);;
color: rgba(0,0,0,0.54);
background-color: transparent;
background-image:linear-gradient(to right, $selected_bg_color 40px,
background-image:linear-gradient(to right, darken($main_dark_color, 5%) 40px,
rgba(65,67,75,0) 36px, rgba(65,67,75,0)97%);
}
.sidebar-icon {
-gtk-icon-shadow: 0 1px transparentize(#fff, 0.2);
-gtk-icon-shadow: 0 1px transparentize($selected_fg_color, 0.2);
color: inherit;
}
}

14
gtk-3.0/widgets/_switches.scss
View File

@@ -12,8 +12,8 @@ switch {
color: transparent;
padding: 2.3px 0px;
background: linear-gradient(to right, #859398, #859398);
// border: 1px solid rgba(170, 170, 170, 0.4);
background: linear-gradient(to right, #0e1011, #0e1011);
border: 1px solid #0a0b0c;
&:disabled {
background-color: $insensitive_bg_color;
}
@@ -28,18 +28,14 @@ switch {
&:active,
&:checked {
// border: 1px solid $teal;
background: linear-gradient(to right, #ff9200, #fadd00);
slider{
background: #fff;
background: linear-gradient(to right, #00a6c9, #00e4ce);
}
&:backdrop {
//border: 1px solid $teal;
background: linear-gradient(to right, darken(#ff9200, 5%), darken(#fadd00, 5%));
slider {
&:backdrop {
box-shadow:none;
background-color:transparentize($base_color, 0.1);
background: linear-gradient(to right, darken(#00a6c9, 10%), darken(#00e4ce, 10%));
border:none;
}
}
@@ -55,7 +51,7 @@ switch {
border-radius: 100%;
transition: $button_transition;
background-color: lighten(#859398, 20%);
background-color: lighten(#0e1011, 5%);
&:backdrop {
padding:2px;