@use "sass:color"; @use "scheme"; @use "font"; $scale: 0.068rem; @function s($value: 1) { @return $value * $scale; } @mixin rounded($all, $tl: $all, $tr: $all, $br: $all, $bl: $all) { border-radius: s($tl) s($tr) s($br) s($bl); -gtk-outline-radius: s($tl) s($tr) s($br) s($bl); } @mixin border($colour, $alpha: 1, $width: 1, $style: solid, $force: false) { @if $force or scheme.$borders { border: s($width) $style color.change($colour, $alpha: $alpha); } } @mixin shadow($colour: black, $alpha: 0.64, $x: 0, $y: 0, $blur: 3, $spread: 0) { box-shadow: s($x) s($y) s($blur) s($spread) color.change($colour, $alpha: $alpha); } @mixin spacing($val: 5, $vertical: false) { $dir: if($vertical, bottom, right); & > *:not(:last-child) { margin-#{$dir}: s($val); } } @mixin element-decel($duration: 200ms) { transition: $duration cubic-bezier(0, 0.55, 0.45, 1); } @mixin fluent-decel($duration: 200ms) { transition: $duration cubic-bezier(0.1, 1, 0, 1); } @mixin overshot { transition-timing-function: cubic-bezier(0.05, 0.9, 0.1, 1.1); } @mixin ease-in-out { transition-timing-function: cubic-bezier(0.85, 0, 0.15, 1); }