sass: Omit leading “0”s in variables
Eventually we should do this in all values.
by roundabout, Monday, 30 December 2019, 23:57:47 (1577750267), pushed by roundabout, Sunday, 11 May 2025, 13:22:47 (1746969767)
Author identity: nana-4 <hnmaigo@gmail.com>
d0cc5224f19e8f3449a9385d82fda25f8ff271b3
src/_sass/_colors.scss
@@ -100,9 +100,9 @@ $success: if($variant == 'light', #0F9D58, #81C995
$visited: if($variant == 'light', $purple-500, $purple-200);
$os-background: $-dark-background;
$tooltip: rgba(#616161, 0.9);
$scrim: rgba(black, 0.6);
$scrim-alt: rgba(black, 0.3);
$tooltip: rgba(#616161, .9);
$scrim: rgba(black, .6);
$scrim-alt: rgba(black, .3);
$panel: if($topbar == 'dark', #1F1F1F, $scrim);
$panel-solid: if($topbar == 'dark', #1F1F1F, #CCCCCC); // for Unity panel which doesn't allow translucent colors
@@ -122,12 +122,12 @@ $overlay-active-opacity: .12;
$overlay-checked-opacity: .12;
$overlay-selected-opacity: .24;
$overlay-hover: gtkalpha(currentColor, 0.08);
$overlay-focus: gtkalpha(currentColor, 0.08);
$overlay-focus-hover: gtkalpha(currentColor, 0.16);
$overlay-active: gtkalpha(currentColor, 0.12);
$overlay-checked: gtkalpha(currentColor, 0.12);
$overlay-selected: rgba($primary, 0.24);
$overlay-hover: gtkalpha(currentColor, .08);
$overlay-focus: gtkalpha(currentColor, .08);
$overlay-focus-hover: gtkalpha(currentColor, .16);
$overlay-active: gtkalpha(currentColor, .12);
$overlay-checked: gtkalpha(currentColor, .12);
$overlay-selected: rgba($primary, .24);
//
// “On” colors
src/_sass/_variables.scss
@@ -33,10 +33,10 @@ $ripple-fade-out-opacity-duration: 1200ms;
// Timing functions
//
$ease: cubic-bezier(0.4, 0.0, 0.2, 1);
$ease-out: cubic-bezier(0.0, 0.0, 0.2, 1);
$ease-in: cubic-bezier(0.4, 0.0, 1, 1);
$ease-in-out: cubic-bezier(0.4, 0.0, 0.6, 1);
$ease: cubic-bezier(.4, 0, .2, 1);
$ease-out: cubic-bezier(0, 0, .2, 1);
$ease-in: cubic-bezier(.4, 0, 1, 1);
$ease-in-out: cubic-bezier(.4, 0, .6, 1);
//
// Transition shorthands
@@ -58,59 +58,59 @@ $transition-shadow: box-shadow $duration $ease-out;
// NOTE 2: Compared to rendering on the Web, GTK seems to have a bigger blur.
$shadow-z1:
// 0 2px (1px * .6) -1px rgba(black, 0.2),
0 2px 2px -2px rgba(black, 0.3),
// 0 1px (1px * .6) 0 rgba(black, 0.14),
0 1px 2px -1px rgba(black, 0.24),
// 0 1px (3px * .6) 0 rgba(black, 0.12);
0 1px 2px -.6px rgba(black, 0.17);
// 0 2px (1px * .6) -1px rgba(black, .2),
0 2px 2px -2px rgba(black, .3),
// 0 1px (1px * .6) 0 rgba(black, .14),
0 1px 2px -1px rgba(black, .24),
// 0 1px (3px * .6) 0 rgba(black, .12);
0 1px 2px -.6px rgba(black, .17);
$shadow-z2:
// 0 3px (1px * .6) -2px rgba(black, 0.2),
0 3px 2px -3px rgba(black, 0.3),
// 0 2px (2px * .6) 0 rgba(black, 0.14),
0 2px 2px -1px rgba(black, 0.24),
0 1px (5px * .6) 0 rgba(black, 0.12);
// 0 3px (1px * .6) -2px rgba(black, .2),
0 3px 2px -3px rgba(black, .3),
// 0 2px (2px * .6) 0 rgba(black, .14),
0 2px 2px -1px rgba(black, .24),
0 1px (5px * .6) 0 rgba(black, .12);
$shadow-z3:
// 0 3px (3px * .6) -2px rgba(black, 0.2),
0 3px 2px -2px rgba(black, 0.2),
0 3px (4px * .6) 0 rgba(black, 0.14),
0 1px (8px * .6) 0 rgba(black, 0.12);
// 0 3px (3px * .6) -2px rgba(black, .2),
0 3px 2px -2px rgba(black, .2),
0 3px (4px * .6) 0 rgba(black, .14),
0 1px (8px * .6) 0 rgba(black, .12);
$shadow-z4:
0 2px (4px * .6) -1px rgba(black, 0.2),
0 4px (5px * .6) 0 rgba(black, 0.14),
0 1px (10px * .6) 0 rgba(black, 0.12);
0 2px (4px * .6) -1px rgba(black, .2),
0 4px (5px * .6) 0 rgba(black, .14),
0 1px (10px * .6) 0 rgba(black, .12);
$shadow-z6:
0 3px (5px * .6) -1px rgba(black, 0.2),
0 6px (10px * .6) 0 rgba(black, 0.14),
0 1px (18px * .6) 0 rgba(black, 0.12);
0 3px (5px * .6) -1px rgba(black, .2),
0 6px (10px * .6) 0 rgba(black, .14),
0 1px (18px * .6) 0 rgba(black, .12);
$shadow-z8:
0 5px (5px * .6) -3px rgba(black, 0.2),
0 8px (10px * .6) 1px rgba(black, 0.14),
0 3px (14px * .6) 2px rgba(black, 0.12);
0 5px (5px * .6) -3px rgba(black, .2),
0 8px (10px * .6) 1px rgba(black, .14),
0 3px (14px * .6) 2px rgba(black, .12);
$shadow-z12:
0 7px (8px * .6) -4px rgba(black, 0.2),
0 12px (17px * .6) 2px rgba(black, 0.14),
0 5px (22px * .6) 4px rgba(black, 0.12);
0 7px (8px * .6) -4px rgba(black, .2),
0 12px (17px * .6) 2px rgba(black, .14),
0 5px (22px * .6) 4px rgba(black, .12);
$shadow-z16:
0 8px (10px * .6) -5px rgba(black, 0.2),
0 16px (24px * .6) 2px rgba(black, 0.14),
0 6px (30px * .6) 5px rgba(black, 0.12);
0 8px (10px * .6) -5px rgba(black, .2),
0 16px (24px * .6) 2px rgba(black, .14),
0 6px (30px * .6) 5px rgba(black, .12);
$shadow-z24:
0 11px (15px * .6) -7px rgba(black, 0.2),
0 24px (38px * .6) 3px rgba(black, 0.14),
0 9px (46px * .6) 8px rgba(black, 0.12);
0 11px (15px * .6) -7px rgba(black, .2),
0 24px (38px * .6) 3px rgba(black, .14),
0 9px (46px * .6) 8px rgba(black, .12);
$text-shadow:
0 1px 1px rgba(black, 0.2),
0 1px 2px rgba(black, 0.14),
0 1px 3px rgba(black, 0.12);
0 1px 1px rgba(black, .2),
0 1px 2px rgba(black, .14),
0 1px 3px rgba(black, .12);
// workaround for selection-mode checkboxes
$icon-shadow-z2:
0 1px 1px rgba(black, 0.2),
0 2px 2px rgba(black, 0.14),
0 1px (5px * .6) rgba(black, 0.12);
0 1px 1px rgba(black, .2),
0 2px 2px rgba(black, .14),
0 1px (5px * .6) rgba(black, .12);
$icon-shadow-z4:
0 2px 2px rgba(black, 0.2),
0 4px (5px * .6) rgba(black, 0.14),
0 1px (10px * .6) rgba(black, 0.12);
0 2px 2px rgba(black, .2),
0 4px (5px * .6) rgba(black, .14),
0 1px (10px * .6) rgba(black, .12);