hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Convert basic scss vars to css vars

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2020-11-09 13:34:13 +03:00
parent c4cfc6455c
commit 35fec8ea6a
3 changed files with 23 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/renderer/components/app.scss
View File

@ -11,6 +11,18 @@
} }
:root { :root {
--unit: 8px;
--padding: var(--unit);
--margin: var(--unit);
--border-radius: 3px;
--font-main: 'Roboto', 'Helvetica', 'Arial', sans-serif;
--font-monospace: Lucida Console, Monaco, Consolas, monospace;
--font-size-small: calc(1.5 * var(--unit));
--font-size: calc(1.75 * var(--unit));
--font-size-big: calc(2 * var(--unit));
--font-weight-thin: 300;
--font-weight-normal: 400;
--font-weight-bold: 500;
--mainBackground: #1e2124; --mainBackground: #1e2124;
--main-layout-header: 40px; --main-layout-header: 40px;
--drag-region-height: 22px --drag-region-height: 22px
@ -122,7 +134,7 @@ code {
vertical-align: middle; vertical-align: middle;
border-radius: $radius; border-radius: $radius;
font-family: $font-monospace; font-family: $font-monospace;
font-size: $font-size * .9; font-size: calc($font-size * .9);
color: #b4b5b4; color: #b4b5b4;
&.block { &.block {

2
src/renderer/components/radio/radio.scss
View File

@ -97,7 +97,7 @@
.tick { .tick {
color: $tickColor; color: $tickColor;
font: $font-size * 1.3 "Material Icons"; font: calc($font-size * 1.3) "Material Icons";
&:after { &:after {
content: "radio_button_unchecked"; content: "radio_button_unchecked";

18
src/renderer/components/vars.scss
View File

@ -5,17 +5,17 @@
$unit: 8px; $unit: 8px;
$padding: $unit; $padding: $unit;
$margin: $unit; $margin: $unit;
$radius: ceil($unit * .3); $radius: var(--border-radius);
// Fonts // Fonts
$font-main: 'Roboto', 'Helvetica', 'Arial', sans-serif !default; $font-main: var(--font-main);
$font-monospace: Lucida Console, Monaco, Consolas, monospace; $font-monospace: var(--font-monospace);
$font-size-small: floor(1.5 * $unit); $font-size-small: var(--font-size-small);
$font-size: floor(1.75 * $unit); $font-size: var(--font-size);
$font-size-big: floor(2 * $unit); $font-size-big: var(--font-size-big);
$font-weight-thin: 300; $font-weight-thin: var(--font-weight-thin);
$font-weight-normal: 400; $font-weight-normal: var(--font-weight-normal);
$font-weight-bold: 500; $font-weight-bold: var(--font-weight-bold);
// Z-index correlations // Z-index correlations
$zIndex-sidebar-hover: 500; $zIndex-sidebar-hover: 500;