mirror of
https://github.com/vinceliuice/Colloid-gtk-theme.git
synced 2026-07-23 22:10:19 -07:00
vinceliuice
97 lines
2.4 KiB
SCSS
97 lines
2.4 KiB
SCSS
@import '../tweaks-temp';
|
|
|
|
$asset_suffix: if($variant == 'dark', '-dark', '');
|
|
|
|
//
|
|
// Sizes
|
|
//
|
|
|
|
$base_padding: if($compact == 'false', 6px, 4px);
|
|
$menu_margin: 6px; //margin around menuitems & sidebar items
|
|
$menu_padding: 12px; //inner menuitem padding
|
|
|
|
$small_size: if($compact == 'false', 24px, 22px);
|
|
$medium_size: if($compact == 'false', 36px, 32px);
|
|
$large_size: if($compact == 'false', 48px, 40px);
|
|
|
|
$menuitem_size: if($compact == 'false', 28px, 24px);
|
|
|
|
//
|
|
// Radiuses
|
|
//
|
|
|
|
$button_radius: 6px;
|
|
$card_radius: $button_radius + 6px;
|
|
$menuitem_radius: $button_radius;
|
|
$window_radius: $button_radius + $base_padding;
|
|
$popover_radius: $menuitem_radius + $base_padding;
|
|
$circular_radius: 9999px;
|
|
|
|
//
|
|
// Durations
|
|
//
|
|
|
|
$duration: 75ms;
|
|
$ripple_fade_in_duration: 225ms;
|
|
$ripple_fade_out_duration: 300ms;
|
|
$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_out_quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
|
|
|
//
|
|
// Transition shorthands
|
|
//
|
|
|
|
$transition: all $duration $ease_out;
|
|
$transition_shadow: box-shadow 200ms ease-out;
|
|
$backdrop_transition: 200ms ease-out;
|
|
$focus_transition: outline-color 200ms $ease_out_quad,
|
|
outline-width 200ms $ease_out_quad,
|
|
outline-offset 200ms $ease_out_quad;
|
|
$button_transition: background 200ms $ease_out_quad,
|
|
box-shadow 200ms $ease_out_quad;
|
|
//
|
|
// Shadows
|
|
//
|
|
|
|
$shadow-z1:
|
|
0 2px 3px -2px rgba(black, 0.3),
|
|
0 1px 2px -1px rgba(black, 0.24),
|
|
0 1px 2px -1px rgba(black, 0.17);
|
|
$shadow-z2:
|
|
0 4px 3px -3px rgba(black, 0.2),
|
|
0 2px 2px -1px rgba(black, 0.24),
|
|
0 1px 3px 0 rgba(black, 0.12);
|
|
$shadow-z3:
|
|
0 3px 3px -2px rgba(black, 0.05),
|
|
0 2px 3px -1px rgba(black, 0.06),
|
|
0 1px 4px 0 rgba(black, 0.05);
|
|
$shadow-z4:
|
|
0 1px 2px 0 rgba(black, 0.15),
|
|
0 3px 3px 0 rgba(black, 0.18),
|
|
0 3px 6px 0 rgba(black, 0.12);
|
|
$shadow-z5:
|
|
0 2px 3px -1px rgba(black, 0.05),
|
|
0 4px 6px 0 rgba(black, 0.06),
|
|
0 1px 10px 0 rgba(black, 0.05);
|
|
$shadow-z6:
|
|
0 2px 3px -1px rgba(black, 0.1),
|
|
0 4px 6px 0 rgba(black, 0.12),
|
|
0 1px 10px 0 rgba(black, 0.1);
|
|
$shadow-z12:
|
|
0 7px 5px -4px rgba(black, 0.2),
|
|
0 12px 10px 2px rgba(black, 0.14),
|
|
0 5px 13px 4px rgba(black, 0.12);
|
|
$shadow-z16:
|
|
0 1px 3px 0 rgba(black, 0.2),
|
|
0 15px 16px 2px rgba(black, 0.14),
|
|
0 6px 18px 5px rgba(black, 0.12);
|