forked from Shinonome/dots-hyprland
Merge with latest main
This commit is contained in:
midn8hustlr
@@ -393,4 +393,4 @@ $bar_ws_width_focus_active: 2.045rem;
|
||||
font-size: 1.032rem;
|
||||
color: $barspacerightOnLayer0;
|
||||
padding: 0.205rem 0.341rem;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,38 +1,41 @@
|
||||
///////////// COLOR MODIFICATIONS /////////////
|
||||
// Material colors provide excellent readability, but can be uninteresting.
|
||||
// This is an attempt to improve that.
|
||||
$transparency_enabled: false;
|
||||
//$transparency_enabled: false;
|
||||
|
||||
@if $transparency_enabled ==false {
|
||||
@if $darkmode ==true {
|
||||
$primary: mix($primary, white, 70%);
|
||||
$primaryContainer: mix($primaryContainer, white, 90%);
|
||||
$background: mix(mix($background, $primary, 94%), #000000, 50%);
|
||||
$surface: mix($surface, $primaryContainer, 98%);
|
||||
$surfaceVariant: mix($surfaceVariant, #000000, 75%);
|
||||
}
|
||||
|
||||
@if $darkmode ==false {
|
||||
$primaryContainer: mix($primaryContainer, white, 90%);
|
||||
$surface: mix($surface, $primaryContainer, 98%);
|
||||
}
|
||||
}
|
||||
|
||||
@if $transparency_enabled ==true {
|
||||
@if $darkmode ==true {
|
||||
$background: mix(mix($background, $primary, 94%), #000000, 50%);
|
||||
$surface: mix($surface, $primaryContainer, 98%);
|
||||
$surfaceVariant: mix($surfaceVariant, #000000, 55%);
|
||||
}
|
||||
|
||||
@if $darkmode ==false {
|
||||
$background: mix($background, $primary, 94%);
|
||||
$surface: mix($surface, $primary, 93%);
|
||||
$surfaceVariant: mix($surfaceVariant, #ffffff, 55%);
|
||||
}
|
||||
}
|
||||
|
||||
// Amounts
|
||||
//@if $transparency_enabled ==false {
|
||||
// @if $darkmode ==true {
|
||||
// $primary: mix($primary, white, 70%);
|
||||
// $primaryContainer: mix($primaryContainer, white, 90%);
|
||||
// $background: mix(mix($background, $primary, 94%), #000000, 50%);
|
||||
// $surface: mix($surface, $primaryContainer, 98%);
|
||||
// $surfaceVariant: mix($surfaceVariant, #000000, 75%);
|
||||
// // $secondaryContainer: mix($secondaryContainer, $primaryContainer, 90%);
|
||||
// }
|
||||
//
|
||||
// @if $darkmode ==false {
|
||||
// $background: mix($background, $primary, 87%);
|
||||
// $surface: mix($surface, $primary, 93%);
|
||||
// $surfaceVariant: mix($surfaceVariant, #ffffff, 25%);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//@if $transparency_enabled ==true {
|
||||
// @if $darkmode ==true {
|
||||
// $background: mix(mix($background, $primary, 94%), #000000, 50%);
|
||||
// $surface: mix($surface, $primaryContainer, 98%);
|
||||
// $surfaceVariant: mix($surfaceVariant, #000000, 55%);
|
||||
// }
|
||||
//
|
||||
// @if $darkmode ==false {
|
||||
// $background: mix($background, $primary, 94%);
|
||||
// $surface: mix($surface, $primary, 93%);
|
||||
// $surfaceVariant: mix($surfaceVariant, #ffffff, 55%);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Amounts
|
||||
$transparency: 0.7;
|
||||
$transparentize_amount: 0.3;
|
||||
$transparentize_surface_amount_less: 0.6;
|
||||
$transparentize_surface_amount_less_less: 0.55;
|
||||
@@ -40,19 +43,19 @@ $transparentize_surface_amount: 0.7;
|
||||
$transparentize_surface_amount_more: 0.8;
|
||||
$transparentize_surface_amount_subtract_surface: $transparentize_surface_amount - $transparentize_amount;
|
||||
|
||||
@if $darkmode ==true {
|
||||
// Less transparency
|
||||
$transparentize_amount: 0.15;
|
||||
$transparentize_surface_amount_less: 0.5;
|
||||
$transparentize_surface_amount_less_less: 0.55;
|
||||
$transparentize_surface_amount: 0.69;
|
||||
$transparentize_surface_amount_more: 0.9;
|
||||
$transparentize_surface_amount_subtract_surface: $transparentize_surface_amount - $transparentize_amount;
|
||||
}
|
||||
|
||||
@if $transparency_enabled ==false {
|
||||
$transparentize_amount: 0;
|
||||
}
|
||||
//@if $darkmode ==true {
|
||||
// // Less transparency
|
||||
// $transparentize_amount: 0.15;
|
||||
// $transparentize_surface_amount_less: 0.5;
|
||||
// $transparentize_surface_amount_less_less: 0.55;
|
||||
// $transparentize_surface_amount: 0.69;
|
||||
// $transparentize_surface_amount_more: 0.9;
|
||||
// $transparentize_surface_amount_subtract_surface: $transparentize_surface_amount - $transparentize_amount;
|
||||
//}
|
||||
//
|
||||
//@if $transparency_enabled ==false {
|
||||
// $transparentize_amount: 0;
|
||||
//}
|
||||
|
||||
// Extended material
|
||||
$success: #4f6354;
|
||||
@@ -60,7 +63,7 @@ $onSuccess: #ffffff;
|
||||
$successContainer: #d1e8d5;
|
||||
$onSuccessContainer: #0c1f13;
|
||||
|
||||
@if $darkmode ==true {
|
||||
@if $darkmode == True {
|
||||
// Dark variant
|
||||
$success: #b5ccba;
|
||||
$onSuccess: #213528;
|
||||
@@ -68,6 +71,22 @@ $onSuccessContainer: #0c1f13;
|
||||
$onSuccessContainer: #d1e9d6;
|
||||
}
|
||||
|
||||
@if $transparent == True {
|
||||
|
||||
$background: transparentize($background, $transparency);
|
||||
$surface: transparentize($surface, $transparency);
|
||||
$surfaceDim: transparentize($surfaceDim, $transparency);
|
||||
$surfaceBright: transparentize($surfaceBright, $transparency);
|
||||
$surfaceContainerLowest: transparentize($surfaceContainerLowest, $transparency);
|
||||
$surfaceContainerLow: transparentize($surfaceContainerLow, $transparency);
|
||||
$surfaceContainer: transparentize($surfaceContainer, $transparency);
|
||||
$surfaceContainerHigh: transparentize($surfaceContainerHigh, $transparency);
|
||||
$surfaceContainerHighest: transparentize($surfaceContainerHighest, $transparency);
|
||||
$surfaceVariant: transparentize($surfaceVariant, $transparency);
|
||||
$inverseSurface: transparentize($inverseSurface, $transparency);
|
||||
$surfaceTint: transparentize($surfaceTint, $transparency);
|
||||
}
|
||||
|
||||
// Transparent versions
|
||||
$t_primary: transparentize($primary, $transparentize_amount);
|
||||
$t_onPrimary: transparentize($onPrimary, $transparentize_amount);
|
||||
@@ -87,7 +106,7 @@ $t_error: transparentize($error, $transparentize_amount);
|
||||
$t_onError: transparentize($onError, $transparentize_amount);
|
||||
$t_errorContainer: transparentize($errorContainer, $transparentize_amount);
|
||||
$t_onErrorContainer: transparentize($onErrorContainer, $transparentize_amount);
|
||||
$t_colorbarbg: transparentize($colorbarbg, $transparentize_amount);
|
||||
//$t_colorbarbg: transparentize($colorbarbg, $transparentize_amount);
|
||||
$t_background: transparentize($background, $transparentize_amount);
|
||||
$t_t_background: transparentize($background, $transparentize_surface_amount_more);
|
||||
$t_onBackground: transparentize($onBackground, $transparentize_amount);
|
||||
@@ -112,15 +131,15 @@ $t_onSuccessContainer: transparentize($onErrorContainer,
|
||||
$transparentize_amount);
|
||||
|
||||
// Others
|
||||
$hovercolor: mix($t_surface, $t_onSurface, 50%);
|
||||
$activecolor: mix($t_surface, $t_onSurface, 30%);
|
||||
$subtext: mix($onBackground, $background, 70%);
|
||||
//$hovercolor: #AA0000;//$surfaceContainerHigh;
|
||||
//$activecolor: mix($t_surface, $t_onSurface, 30%);
|
||||
$subtext: $outline;
|
||||
$actiontext: mix($onBackground, $background, 85%);
|
||||
$black: black;
|
||||
$white: white;
|
||||
|
||||
// Terminal colors
|
||||
$termbg: mix($t_surfaceVariant, $t_onSurfaceVariant, 80%);
|
||||
$termbg: $surfaceContainerHigh;
|
||||
$termfg: $onSurfaceVariant;
|
||||
$term0: $t_background;
|
||||
$term1: $error;
|
||||
|
||||
@@ -209,6 +209,31 @@ popover {
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.multipleselection-container {
|
||||
}
|
||||
|
||||
.multipleselection-btn {
|
||||
@include small-rounding;
|
||||
padding: 0rem 0.341rem;
|
||||
border: 0.034rem solid $outlineVariant;
|
||||
}
|
||||
|
||||
.multipleselection-btn:focus,
|
||||
.multipleselection-btn:hover {
|
||||
background-color: $hovercolor;
|
||||
}
|
||||
|
||||
.multipleselection-btn-enabled {
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.multipleselection-btn-enabled:hover,
|
||||
.multipleselection-btn-enabled:focus {
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.gap-v-5 {
|
||||
min-height: 0.341rem;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
// Common colors
|
||||
$hovercolor: rgba(128, 128, 128, 0.3);
|
||||
$activecolor: rgba(128, 128, 128, 0.7);
|
||||
$hovercolor: $surfaceContainerHigh;
|
||||
$activecolor: $surfaceContainerHighest;
|
||||
$rounding_small: 0.818rem;
|
||||
$rounding_mediumsmall: 0.955rem;
|
||||
$rounding_medium: 1.159rem;
|
||||
|
||||
@@ -1,29 +1,56 @@
|
||||
$darkmode: true;
|
||||
$primary: #ffb4a9;
|
||||
$onPrimary: #5f1410;
|
||||
$primaryContainer: #7e2b24;
|
||||
$onPrimaryContainer: #ffdad4;
|
||||
$secondary: #e7bcb7;
|
||||
$onSecondary: #442926;
|
||||
$secondaryContainer: #5d3f3b;
|
||||
$onSecondaryContainer: #ffdad5;
|
||||
$tertiary: #e0c38c;
|
||||
$onTertiary: #3f2e04;
|
||||
$tertiaryContainer: #574419;
|
||||
$onTertiaryContainer: #fddfa6;
|
||||
$error: #ffb4a9;
|
||||
$onError: #680003;
|
||||
$errorContainer: #930006;
|
||||
$onErrorContainer: #ffb4a9;
|
||||
$colorbarbg: #130F0F;
|
||||
$background: #130F0F;
|
||||
$onBackground: #ede0de;
|
||||
$surface: #211a19;
|
||||
$onSurface: #ede0de;
|
||||
$surfaceVariant: #534341;
|
||||
$onSurfaceVariant: #d8c2bf;
|
||||
$outline: #a08c89;
|
||||
$darkmode: True;
|
||||
$transparent: False;
|
||||
$primary_paletteKeyColor: #727C35;
|
||||
$secondary_paletteKeyColor: #76795C;
|
||||
$tertiary_paletteKeyColor: #537F73;
|
||||
$neutral_paletteKeyColor: #78786D;
|
||||
$neutral_variant_paletteKeyColor: #77786A;
|
||||
$background: #13140D;
|
||||
$onBackground: #E4E3D6;
|
||||
$surface: #13140D;
|
||||
$surfaceDim: #13140D;
|
||||
$surfaceBright: #393A31;
|
||||
$surfaceContainerLowest: #FFFFFF;
|
||||
$surfaceContainerLow: #1B1C14;
|
||||
$surfaceContainer: #1F2018;
|
||||
$surfaceContainerHigh: #2A2B22;
|
||||
$surfaceContainerHighest: #35352D;
|
||||
$onSurface: #E4E3D6;
|
||||
$surfaceVariant: #47483B;
|
||||
$onSurfaceVariant: #C8C7B7;
|
||||
$inverseSurface: #E4E3D6;
|
||||
$inverseOnSurface: #303129;
|
||||
$outline: #919283;
|
||||
$outlineVariant: #47483B;
|
||||
$shadow: #000000;
|
||||
$inverseSurface: #ede0de;
|
||||
$inverseOnSurface: #362f2e;
|
||||
$inversePrimary: #9c4239;
|
||||
$scrim: #000000;
|
||||
$surfaceTint: #C2CD7C;
|
||||
$primary: #C2CD7C;
|
||||
$onPrimary: #2D3400;
|
||||
$primaryContainer: #434B06;
|
||||
$onPrimaryContainer: #DEE995;
|
||||
$inversePrimary: #5A631F;
|
||||
$secondary: #C6C9A7;
|
||||
$onSecondary: #2F321A;
|
||||
$secondaryContainer: #484B31;
|
||||
$onSecondaryContainer: #E4E7C3;
|
||||
$tertiary: #A2D0C2;
|
||||
$onTertiary: #06372E;
|
||||
$tertiaryContainer: #6D9A8D;
|
||||
$onTertiaryContainer: #000000;
|
||||
$error: #FFB4AB;
|
||||
$onError: #690005;
|
||||
$errorContainer: #93000A;
|
||||
$onErrorContainer: #FFDAD6;
|
||||
$primaryFixed: #DEE995;
|
||||
$primaryFixedDim: #C2CD7C;
|
||||
$onPrimaryFixed: #191E00;
|
||||
$onPrimaryFixedVariant: #434B06;
|
||||
$secondaryFixed: #E2E5C2;
|
||||
$secondaryFixedDim: #C6C9A7;
|
||||
$onSecondaryFixed: #1A1D07;
|
||||
$onSecondaryFixedVariant: #46492F;
|
||||
$tertiaryFixed: #BDECDE;
|
||||
$tertiaryFixedDim: #A2D0C2;
|
||||
$onTertiaryFixed: #00201A;
|
||||
$onTertiaryFixedVariant: #224E44;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
$notif_surface: $t_background;
|
||||
$notif_surface: $surfaceContainer;
|
||||
|
||||
@mixin notif-rounding {
|
||||
@include normal-rounding;
|
||||
@@ -6,7 +6,7 @@ $notif_surface: $t_background;
|
||||
|
||||
.notif-low {
|
||||
@include notif-rounding;
|
||||
background-color: $l_l_t_surfaceVariant;
|
||||
background-color: $surfaceContainerHigh;
|
||||
color: $onSurfaceVariant;
|
||||
padding: $rounding_small;
|
||||
padding-right: $rounding_small + 0.545rem;
|
||||
@@ -14,7 +14,7 @@ $notif_surface: $t_background;
|
||||
|
||||
.notif-normal {
|
||||
@include notif-rounding;
|
||||
background-color: $l_l_t_surfaceVariant;
|
||||
background-color: $surfaceContainerHigh;
|
||||
color: $onSurfaceVariant;
|
||||
padding: $rounding_small;
|
||||
padding-right: $rounding_small + 0.545rem;
|
||||
@@ -29,21 +29,23 @@ $notif_surface: $t_background;
|
||||
}
|
||||
|
||||
.notif-clicked-low {
|
||||
background-color: mix($l_l_t_surfaceVariant, $t_onSurfaceVariant, 85%);
|
||||
background-color: $surfaceContainerLow;
|
||||
}
|
||||
|
||||
.notif-clicked-normal {
|
||||
background-color: mix($l_l_t_surfaceVariant, $t_onSurfaceVariant, 85%);
|
||||
background-color: $surfaceContainerLow;
|
||||
}
|
||||
|
||||
.notif-clicked-critical {
|
||||
background-color: mix($secondaryContainer, $onSecondaryContainer, 95%);
|
||||
background-color: $onSecondary;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.popup-notif-low {
|
||||
@include notif-rounding;
|
||||
min-width: 30.682rem;
|
||||
background-color: $notif_surface;
|
||||
border: 0.034rem solid $outlineVariant;
|
||||
color: $onSurfaceVariant;
|
||||
padding: $rounding_small;
|
||||
padding-right: $rounding_small + 0.545rem;
|
||||
@@ -53,6 +55,7 @@ $notif_surface: $t_background;
|
||||
@include notif-rounding;
|
||||
min-width: 30.682rem;
|
||||
background-color: $notif_surface;
|
||||
border: 0.034rem solid $outlineVariant;
|
||||
color: $onSurfaceVariant;
|
||||
padding: $rounding_small;
|
||||
padding-right: $rounding_small + 0.545rem;
|
||||
@@ -62,29 +65,31 @@ $notif_surface: $t_background;
|
||||
@include notif-rounding;
|
||||
min-width: 30.682rem;
|
||||
background-color: $secondaryContainer;
|
||||
border: 0.034rem solid $onSecondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
padding: $rounding_small;
|
||||
padding-right: $rounding_small + 0.545rem;
|
||||
}
|
||||
|
||||
.popup-notif-clicked-low {
|
||||
background-color: mix($notif_surface, $onBackground, 94%);
|
||||
background-color: $surfaceContainerLow;
|
||||
}
|
||||
|
||||
.popup-notif-clicked-normal {
|
||||
background-color: mix($notif_surface, $onBackground, 94%);
|
||||
background-color: $surfaceContainerLow;
|
||||
}
|
||||
|
||||
.popup-notif-clicked-critical {
|
||||
background-color: mix($secondaryContainer, $onSecondaryContainer, 96%);
|
||||
background-color: $onSecondary;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.notif-body-low {
|
||||
color: mix($onSurfaceVariant, $surfaceVariant, 67%);
|
||||
color: $outline;
|
||||
}
|
||||
|
||||
.notif-body-normal {
|
||||
color: mix($onSurfaceVariant, $surfaceVariant, 67%);
|
||||
color: $outline;
|
||||
}
|
||||
|
||||
.notif-body-critical {
|
||||
@@ -99,23 +104,23 @@ $notif_surface: $t_background;
|
||||
}
|
||||
|
||||
.notif-icon-material {
|
||||
background-color: $t_secondaryContainer;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.notif-icon-material-low {
|
||||
background-color: $t_secondaryContainer;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.notif-icon-material-normal {
|
||||
background-color: $t_secondaryContainer;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.notif-icon-material-critical {
|
||||
background-color: $t_onSecondaryContainer;
|
||||
color: $secondaryContainer;
|
||||
background-color: $secondary;
|
||||
color: $onSecondary;
|
||||
}
|
||||
|
||||
.notif-expand-btn {
|
||||
@@ -163,8 +168,7 @@ $notif_surface: $t_background;
|
||||
|
||||
.osd-notif {
|
||||
@include notif-rounding;
|
||||
background-color: transparentize($background,
|
||||
$transparentize_surface_amount_subtract_surface );
|
||||
background-color: $background;
|
||||
min-width: 30.682rem;
|
||||
}
|
||||
|
||||
@@ -201,43 +205,43 @@ $notif_surface: $t_background;
|
||||
}
|
||||
|
||||
.notif-action-low {
|
||||
background-color: mix($t_onSurfaceVariant, $t_surface, 10%);
|
||||
background-color: $surfaceContainerHighest;
|
||||
color: $onSurfaceVariant;
|
||||
}
|
||||
|
||||
.notif-action-low:focus,
|
||||
.notif-action-low:hover {
|
||||
background-color: $hovercolor;
|
||||
border: 0.040rem solid $outlineVariant;
|
||||
}
|
||||
|
||||
.notif-action-low:active {
|
||||
background-color: $activecolor;
|
||||
background-color: $surfaceBright;
|
||||
}
|
||||
|
||||
.notif-action-normal {
|
||||
background-color: mix($t_onSurfaceVariant, $t_surface, 10%);
|
||||
background-color: $surfaceContainerHighest;
|
||||
color: $onSurfaceVariant;
|
||||
}
|
||||
|
||||
.notif-action-normal:focus,
|
||||
.notif-action-normal:hover {
|
||||
background-color: $hovercolor;
|
||||
border: 0.040rem solid $outlineVariant;
|
||||
}
|
||||
|
||||
.notif-action-normal:active {
|
||||
background-color: $activecolor;
|
||||
background-color: $surfaceBright;
|
||||
}
|
||||
|
||||
.notif-action-critical {
|
||||
background-color: mix($t_onSecondaryContainer, $t_secondaryContainer, 10%);
|
||||
background-color: mix($secondary, $onSecondary, 30%);
|
||||
color: $onSurfaceVariant;
|
||||
}
|
||||
|
||||
.notif-action-critical:focus,
|
||||
.notif-action-critical:hover {
|
||||
background-color: mix($t_onSecondaryContainer, $t_secondaryContainer, 18%);
|
||||
border: 0.040rem solid $outline;
|
||||
}
|
||||
|
||||
.notif-action-critical:active {
|
||||
background-color: mix($t_onSecondaryContainer, $t_secondaryContainer, 23%);
|
||||
}
|
||||
background-color: mix($secondary, $onSecondary, 40%);
|
||||
}
|
||||
|
||||
+70
-11
@@ -10,7 +10,7 @@
|
||||
.osd-value {
|
||||
@include elevation-border;
|
||||
@include elevation2;
|
||||
background-color: $t_background;
|
||||
background-color: $background;
|
||||
border-radius: 1.023rem;
|
||||
padding: 0.625rem 1.023rem;
|
||||
padding-top: 0.313rem;
|
||||
@@ -65,20 +65,27 @@
|
||||
|
||||
.osd-colorscheme {
|
||||
border-radius: 1.023rem;
|
||||
background-color: $t_background;
|
||||
padding: 1.023rem;
|
||||
background-color: $background;
|
||||
padding: 0.313rem 0.626rem;
|
||||
@include elevation2;
|
||||
}
|
||||
|
||||
.osd-colorscheme-settings {
|
||||
background-color: $background;
|
||||
padding: 0.313rem 0.626rem;
|
||||
@include small-rounding;
|
||||
}
|
||||
|
||||
.osd-color {
|
||||
@include full-rounding;
|
||||
border-radius: 0.650rem;
|
||||
-gtk-outline-radius: 0.650rem;
|
||||
min-width: 2.727rem;
|
||||
min-height: 1.705rem;
|
||||
padding: 0rem 0.341rem;
|
||||
font-weight: bold;
|
||||
|
||||
box {
|
||||
@include full-rounding;
|
||||
@include small-rounding;
|
||||
margin: 0.409rem;
|
||||
}
|
||||
}
|
||||
@@ -103,26 +110,78 @@
|
||||
color: $onSecondaryContainer;
|
||||
box { background-color: $onSecondaryContainer; }
|
||||
}
|
||||
|
||||
.osd-color-tertiary {
|
||||
background-color: $tertiary;
|
||||
color: $onTertiary;
|
||||
box { background-color: $onTertiary; }
|
||||
}
|
||||
.osd-color-tertiaryContainer {
|
||||
background-color: $tertiaryContainer;
|
||||
color: $onTertiaryContainer;
|
||||
box { background-color: $onTertiaryContainer; }
|
||||
}
|
||||
|
||||
.osd-color-error {
|
||||
background-color: $error;
|
||||
color: $onError;
|
||||
box { background-color: $onError; }
|
||||
}
|
||||
.osd-color-errorContainer {
|
||||
background-color: $errorContainer;
|
||||
color: $onErrorContainer;
|
||||
box { background-color: $onErrorContainer; }
|
||||
}
|
||||
|
||||
.osd-color-surface {
|
||||
background-color: $surface;
|
||||
color: $onSurface;
|
||||
border: 0.068rem solid $outlineVariant;
|
||||
box { background-color: $onSurface; }
|
||||
}
|
||||
|
||||
.osd-color-surfaceContainer {
|
||||
background-color: $surfaceContainer;
|
||||
color: $onSurface;
|
||||
box { background-color: $onSurface; }
|
||||
}
|
||||
|
||||
.osd-color-inverseSurface {
|
||||
background-color: $inverseSurface;
|
||||
color: $inverseOnSurface;
|
||||
box { background-color: $onSurfaceVariant; }
|
||||
}
|
||||
|
||||
.osd-color-surfaceVariant {
|
||||
background-color: $surfaceVariant;
|
||||
color: $onSurfaceVariant;
|
||||
box { background-color: $onSurfaceVariant; }
|
||||
}
|
||||
.osd-color-surface {
|
||||
background-color: $surface;
|
||||
color: $onSurface;
|
||||
box { background-color: $onSurface; }
|
||||
}
|
||||
|
||||
.osd-color-background {
|
||||
background-color: $background;
|
||||
color: $onBackground;
|
||||
box { background-color: $onBackground; }
|
||||
}
|
||||
|
||||
.osd-settings-btn-arrow {
|
||||
@include full-rounding;
|
||||
@include icon-material;
|
||||
min-width: 1.705rem;
|
||||
min-height: 1.705rem;
|
||||
|
||||
&:hover {
|
||||
background-color: $surfaceContainerHigh;
|
||||
}
|
||||
&:active {
|
||||
background-color: $surfaceContainerHighest;
|
||||
}
|
||||
}
|
||||
|
||||
.osd-show {
|
||||
transition: 200ms cubic-bezier(0.1, 1, 0, 1);
|
||||
}
|
||||
|
||||
.osd-hide {
|
||||
transition: 190ms cubic-bezier(0.85, 0, 0.15, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
min-height: 3.409rem;
|
||||
padding: 0rem 1.364rem;
|
||||
padding-right: 2.864rem;
|
||||
background-color: $t_background;
|
||||
background-color: $background;
|
||||
color: $onBackground;
|
||||
|
||||
selection {
|
||||
@@ -53,8 +53,8 @@
|
||||
@include elevation2;
|
||||
min-width: 28.773rem;
|
||||
padding: 0.682rem;
|
||||
background-color: $t_background;
|
||||
color: $onBackground;
|
||||
background-color: $surfaceContainerLow;
|
||||
color: $onSurface;
|
||||
}
|
||||
|
||||
.overview-search-results-icon {
|
||||
@@ -97,7 +97,7 @@
|
||||
@include elevation-border;
|
||||
@include elevation2;
|
||||
padding: 0.341rem;
|
||||
background-color: $t_background;
|
||||
background-color: $background;
|
||||
color: $onBackground;
|
||||
}
|
||||
|
||||
@@ -105,35 +105,37 @@
|
||||
@include normal-rounding;
|
||||
// @include elevation-border;
|
||||
margin: 0.341rem;
|
||||
background-color: mix($t_t_surface, $t_onSurface, 93%);
|
||||
background-color: $surfaceContainerLow;
|
||||
}
|
||||
|
||||
.overview-tasks-workspace-number {
|
||||
@include mainfont;
|
||||
color: mix($t_onSurface, $t_surface, 93%);
|
||||
color: $onSurfaceVariant;
|
||||
}
|
||||
|
||||
.overview-tasks-window {
|
||||
@include normal-rounding;
|
||||
@include menu_decel;
|
||||
background-color: $t_surfaceVariant;
|
||||
color: $onSecondaryContainer;
|
||||
border: 0.068rem solid $t_t_t_onSecondaryContainer;
|
||||
background-color: $surfaceContainerHigh;
|
||||
color: $onSurface;
|
||||
border: 0.068rem solid $outlineVariant;
|
||||
}
|
||||
|
||||
.overview-tasks-window:hover,
|
||||
.overview-tasks-window:focus {
|
||||
background-color: mix($l_t_secondaryContainer, $primary, 95%);
|
||||
background-color: $secondaryContainer;
|
||||
}
|
||||
|
||||
.overview-tasks-window:active {
|
||||
background-color: mix($l_t_secondaryContainer, $primary, 90%);
|
||||
background-color: $tertiaryContainer;
|
||||
background-color: mix($secondaryContainer, $hovercolor, 70%);
|
||||
}
|
||||
|
||||
.overview-tasks-window-selected {
|
||||
background-color: mix($l_t_secondaryContainer, $primary, 90%);
|
||||
background-color: $tertiaryContainer;
|
||||
background-color: mix($secondaryContainer, $hovercolor, 70%);
|
||||
}
|
||||
|
||||
.overview-tasks-window-dragging {
|
||||
opacity: 0.2;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
$sidebar_chat_textboxareaColor: mix($onSurfaceVariant, $surfaceVariant, 40%);
|
||||
$textboxColor: mix($surface, $surfaceVariant, 80%);
|
||||
$textboxColor: $surfaceContainerHigh;
|
||||
$system: $secondary;
|
||||
$onSystem: $onSecondary;
|
||||
$chatgpt: $primary;
|
||||
@@ -16,7 +16,7 @@ $onChatgpt: $onPrimary;
|
||||
border-radius: $rounding_large - $elevation_margin + 0.068rem;
|
||||
min-width: 27.818rem; // COMMENT THIS LATER IF TEXT WRAP IS USED
|
||||
// min-height: 29.591rem;
|
||||
background-color: $t_background;
|
||||
background-color: $background;
|
||||
padding: 1.023rem;
|
||||
}
|
||||
|
||||
@@ -37,7 +37,7 @@ $onChatgpt: $onPrimary;
|
||||
border-radius: $rounding_large - $elevation_margin + 0.068rem;
|
||||
min-width: 27.818rem; // COMMENT THIS LATER IF TEXT WRAP IS USED
|
||||
// min-height: 29.591rem;
|
||||
background-color: $t_background;
|
||||
background-color: $background;
|
||||
padding: 1.023rem;
|
||||
}
|
||||
|
||||
@@ -54,12 +54,12 @@ $onChatgpt: $onPrimary;
|
||||
.sidebar-group {
|
||||
@include normal-rounding;
|
||||
@include group-padding;
|
||||
background-color: $t_surface;
|
||||
background-color: $surfaceContainer;
|
||||
}
|
||||
|
||||
.sidebar-group-nopad {
|
||||
@include normal-rounding;
|
||||
background-color: $t_surface;
|
||||
background-color: $surfaceContainer;
|
||||
}
|
||||
|
||||
.sidebar-group-invisible {
|
||||
@@ -73,7 +73,7 @@ $onChatgpt: $onPrimary;
|
||||
.sidebar-togglesbox {
|
||||
@include full-rounding;
|
||||
@include group-padding;
|
||||
background-color: $t_surface;
|
||||
background-color: $surfaceContainer;
|
||||
}
|
||||
|
||||
.sidebar-iconbutton {
|
||||
@@ -96,8 +96,6 @@ $onChatgpt: $onPrimary;
|
||||
.sidebar-button {
|
||||
@include element_decel;
|
||||
padding: 0rem $rounding_small;
|
||||
background-color: $t_secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.sidebar-button:hover,
|
||||
@@ -206,16 +204,16 @@ $onChatgpt: $onPrimary;
|
||||
@include element_decel;
|
||||
min-width: 0.273rem;
|
||||
min-height: 2.045rem;
|
||||
background-color: $t_onSurfaceVariant;
|
||||
background-color: transparentize($onSurfaceVariant, 0.7);
|
||||
}
|
||||
|
||||
slider:hover,
|
||||
slider:focus {
|
||||
background-color: mix($t_onSurfaceVariant, $onSurfaceVariant, 80%);
|
||||
background-color: transparentize($onSurfaceVariant, 0.6);
|
||||
}
|
||||
|
||||
slider:active {
|
||||
background-color: mix($onSurfaceVariant, $surfaceVariant, 50%);
|
||||
background-color: transparentize($onSurface, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -256,7 +254,7 @@ $onChatgpt: $onPrimary;
|
||||
}
|
||||
|
||||
.sidebar-calendar-btn-othermonth {
|
||||
color: mix($onSurface, $surface, 50%);
|
||||
color: $outline;
|
||||
}
|
||||
|
||||
.sidebar-calendar-header {
|
||||
@@ -267,19 +265,17 @@ $onChatgpt: $onPrimary;
|
||||
@include full-rounding;
|
||||
@include element_decel;
|
||||
padding: 0rem 0.682rem;
|
||||
background-color: $t_surfaceVariant;
|
||||
color: $onSurfaceVariant;
|
||||
background-color: $surfaceContainer;
|
||||
color: $outline;
|
||||
}
|
||||
|
||||
.sidebar-calendar-monthyear-btn:hover,
|
||||
.sidebar-calendar-monthyear-btn:focus {
|
||||
background-color: $hovercolor;
|
||||
color: mix($onSurfaceVariant, $surfaceVariant, 95%);
|
||||
}
|
||||
|
||||
.sidebar-calendar-monthyear-btn:active {
|
||||
background-color: $activecolor;
|
||||
color: mix($onSurfaceVariant, $surfaceVariant, 85%);
|
||||
}
|
||||
|
||||
.sidebar-calendar-monthshift-btn {
|
||||
@@ -287,28 +283,22 @@ $onChatgpt: $onPrimary;
|
||||
@include element_decel;
|
||||
min-width: 2.045rem;
|
||||
min-height: 2.045rem;
|
||||
background-color: $t_surfaceVariant;
|
||||
color: $onSurfaceVariant;
|
||||
background-color: $surfaceContainer;
|
||||
color: $outline;
|
||||
}
|
||||
|
||||
.sidebar-calendar-monthshift-btn:hover {
|
||||
background-color: $hovercolor;
|
||||
color: mix($onSurfaceVariant, $surfaceVariant, 95%);
|
||||
}
|
||||
|
||||
.sidebar-calendar-monthshift-btn:active {
|
||||
background-color: $activecolor;
|
||||
color: mix($onSurfaceVariant, $surfaceVariant, 85%);
|
||||
}
|
||||
|
||||
.sidebar-todo-item {
|
||||
padding-right: 0.545rem;
|
||||
}
|
||||
|
||||
.sidebar-todo-item-even {
|
||||
background-color: $t_t_surfaceVariant;
|
||||
}
|
||||
|
||||
.sidebar-todo-item-action {
|
||||
@include element_decel;
|
||||
border-radius: 9999px;
|
||||
@@ -349,11 +339,13 @@ $onChatgpt: $onPrimary;
|
||||
|
||||
.sidebar-todo-new,
|
||||
.sidebar-todo-new:focus {
|
||||
background-color: mix($t_secondaryContainer, $t_onSecondaryContainer, 97%);
|
||||
color: $onSecondaryContainer;
|
||||
background-color: $secondaryContainer;
|
||||
}
|
||||
|
||||
.sidebar-todo-new:active {
|
||||
background-color: mix($t_secondaryContainer, $t_onSecondaryContainer, 80%);
|
||||
color: $onPrimaryContainer;
|
||||
background-color: $primaryContainer;
|
||||
}
|
||||
|
||||
.sidebar-todo-add {
|
||||
@@ -367,11 +359,11 @@ $onChatgpt: $onPrimary;
|
||||
|
||||
.sidebar-todo-add:hover,
|
||||
.sidebar-todo-add:focus {
|
||||
background-color: mix($t_secondaryContainer, $t_onSecondaryContainer, 97%);
|
||||
background-color: $surfaceContainerHigh;
|
||||
}
|
||||
|
||||
.sidebar-todo-add:active {
|
||||
background-color: mix($t_secondaryContainer, $t_onSecondaryContainer, 80%);
|
||||
background-color: $surfaceContainerHighest;
|
||||
}
|
||||
|
||||
.sidebar-todo-add-available {
|
||||
@@ -386,11 +378,11 @@ $onChatgpt: $onPrimary;
|
||||
|
||||
.sidebar-todo-add-available:hover,
|
||||
.sidebar-todo-add-available:focus {
|
||||
background-color: mix($primary, $onPrimary, 97%);
|
||||
background-color: mix($primary, $hovercolor, 70%);
|
||||
}
|
||||
|
||||
.sidebar-todo-add-available:active {
|
||||
background-color: mix($primary, $onPrimary, 80%);
|
||||
background-color: mix($primary, $hovercolor, 40%);
|
||||
}
|
||||
|
||||
.sidebar-todo-entry {
|
||||
@@ -403,24 +395,24 @@ $onChatgpt: $onPrimary;
|
||||
min-height: 1.773rem;
|
||||
min-width: 0rem;
|
||||
padding: 0.205rem 0.682rem;
|
||||
border: 0.068rem solid mix($onSurfaceVariant, $surfaceVariant, 50%);
|
||||
border: 0.068rem solid $outline;
|
||||
}
|
||||
|
||||
.sidebar-todo-entry:focus {
|
||||
border: 0.068rem solid mix($onSurfaceVariant, $surfaceVariant, 90%);
|
||||
border: 0.068rem solid $onSurfaceVariant;
|
||||
}
|
||||
|
||||
.sidebar-module {
|
||||
@include normal-rounding;
|
||||
@include group-padding;
|
||||
background-color: $l_l_t_surfaceVariant;
|
||||
background-color: $surfaceContainer;
|
||||
padding: 0.682rem;
|
||||
}
|
||||
|
||||
.sidebar-module-btn-arrow {
|
||||
@include full-rounding;
|
||||
@include icon-material;
|
||||
background-color: $l_l_t_surfaceVariant;
|
||||
background-color: $surfaceContainerHigh;
|
||||
min-width: 1.705rem;
|
||||
min-height: 1.705rem;
|
||||
|
||||
@@ -432,7 +424,7 @@ $onChatgpt: $onPrimary;
|
||||
.sidebar-module-scripts-button {
|
||||
@include full-rounding;
|
||||
@include icon-material;
|
||||
background-color: $l_l_t_surfaceVariant;
|
||||
background-color: $surfaceContainer;
|
||||
min-width: 1.705rem;
|
||||
min-height: 1.705rem;
|
||||
|
||||
@@ -508,7 +500,7 @@ $colorpicker_rounding: 0.341rem;
|
||||
.sidebar-chat-apiswitcher {
|
||||
@include full-rounding;
|
||||
@include group-padding;
|
||||
background-color: $t_surface;
|
||||
background-color: $surfaceContainer;
|
||||
}
|
||||
|
||||
.sidebar-chat-apiswitcher-icon {
|
||||
@@ -573,11 +565,11 @@ $colorpicker_rounding: 0.341rem;
|
||||
|
||||
.sidebar-chat-send:hover,
|
||||
.sidebar-chat-send:focus {
|
||||
background-color: $surfaceVariant;
|
||||
background-color: $surfaceBright;
|
||||
}
|
||||
|
||||
.sidebar-chat-send:active {
|
||||
background-color: mix($surfaceVariant, $onBackground, 80%);
|
||||
background-color: $surfaceVariant;
|
||||
}
|
||||
|
||||
.sidebar-chat-send-available {
|
||||
@@ -587,11 +579,11 @@ $colorpicker_rounding: 0.341rem;
|
||||
|
||||
.sidebar-chat-send-available:hover,
|
||||
.sidebar-chat-send-available:focus {
|
||||
background-color: mix($primary, $onPrimary, 97%);
|
||||
background-color: mix($primary, $hovercolor, 70%);
|
||||
}
|
||||
|
||||
.sidebar-chat-send-available:active {
|
||||
background-color: mix($primary, $onPrimary, 80%);
|
||||
background-color: mix($primary, $hovercolor, 40%);
|
||||
}
|
||||
|
||||
.sidebar-chat-message {
|
||||
@@ -653,17 +645,17 @@ $colorpicker_rounding: 0.341rem;
|
||||
background-color: $termbg;
|
||||
color: $termfg;
|
||||
margin: 0rem 0.682rem;
|
||||
border: 0.068rem solid $t_t_t_onSecondaryContainer;
|
||||
border: 0.068rem solid $outlineVariant;
|
||||
}
|
||||
|
||||
.sidebar-chat-codeblock-topbar {
|
||||
@include mainfont;
|
||||
margin: 0.273rem;
|
||||
margin-bottom: 0rem;
|
||||
background-color: mix($t_secondaryContainer, $t_onSurfaceVariant, 30%);
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
border-radius: $rounding_medium - 0.273rem;
|
||||
border: 0.068rem solid mix($secondaryContainer, $onSecondaryContainer, 90%);
|
||||
border: 0.068rem solid $outlineVariant;
|
||||
border-top-left-radius: $rounding_small + 0.068rem;
|
||||
border-top-right-radius: $rounding_small + 0.068rem;
|
||||
padding: 0.341rem 0.477rem;
|
||||
@@ -682,11 +674,11 @@ $colorpicker_rounding: 0.341rem;
|
||||
|
||||
.sidebar-chat-codeblock-topbar-btn:hover,
|
||||
.sidebar-chat-codeblock-topbar-btn:focus {
|
||||
background-color: mix($t_secondaryContainer, $t_onSecondaryContainer, 80%);
|
||||
background-color: mix($secondaryContainer, $onSecondaryContainer, 90%);
|
||||
}
|
||||
|
||||
.sidebar-chat-codeblock-topbar-btn:active {
|
||||
background-color: mix($t_secondaryContainer, $t_onSecondaryContainer, 60%);
|
||||
background-color: mix($secondaryContainer, $onSecondaryContainer, 80%);
|
||||
}
|
||||
|
||||
.sidebar-chat-codeblock-code {
|
||||
@@ -794,11 +786,11 @@ $colorpicker_rounding: 0.341rem;
|
||||
|
||||
.sidebar-pin-enabled:hover,
|
||||
.sidebar-pin-enabled:focus {
|
||||
background-color: mix($primary, $onPrimary, 90%);
|
||||
background-color: mix($primary, $hovercolor, 70%);
|
||||
}
|
||||
|
||||
.sidebar-pin-enabled:active {
|
||||
background-color: mix($primary, $onPrimary, 80%);
|
||||
background-color: mix($primary, $hovercolor, 40%);
|
||||
}
|
||||
|
||||
.sidebar-waifu-heading {
|
||||
@@ -869,4 +861,4 @@ $waifu_image_overlay_transparency: 0.7;
|
||||
// background-color: rgba(100, 100, 0, 0.3);
|
||||
@include element_decel;
|
||||
margin: 0.545rem;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user