🌈 Organise colors with vars only

This commit is contained in:
tatianamac 2020-02-19 18:48:29 +11:00
parent b78dd4a334
commit 228a119b30
2 changed files with 15 additions and 15 deletions

View File

@ -0,0 +1,11 @@
$primary-color: hsl(0, 100%, 50%);
$secondary-color: hsl(120, 100%, 25%);
$dark-red: hsl(0, 100%, 32.2%);
$pink: hsl(349.5, 100%, 87.6%);
$black: hsl(0, 0%, 13%);
$white: hsl(0, 0%, 100%);
$dark-grey: hsl(0, 0%, 31%);
$mid-grey: hsl(0, 0%, 46.3%); // the lightest shade of grey you can get away with, #a11y
$light-grey: hsl(0, 0%, 93.3%); // for backgrounds only

View File

@ -3,6 +3,7 @@
@import '~prism-themes/themes/prism-a11y-dark';
@import '_sass/functions';
@import '_sass/colours'
$browser-context: 16;
@ -11,9 +12,9 @@ pre[class*='language-'] {
}
code {
background-color: #333333;
border: pxToRem(1) solid black;
color: white;
background-color: $dark-grey;
border: 1px solid $black;
color: $white;
padding: 0.15em;
border-radius: 0.25em;
font-size: 95%;
@ -34,18 +35,6 @@ code {
--l-gap: 1rem;
}
$primary-color: #0e4bff; //cobalt blue is so pretty//
$secondary-color: #f3f315; //
$black: #222222;
$white: #ffffff;
$pistachio: #e5ffe5;
$yellow: #ffff00;
$dark-grey: #4f4f4f;
$mid-grey: #767676; // the lightest shade of grey you can get away with, #a11y
$light-grey: #eeeeee; // for backgrounds only
// TYPOGRAPHY //
$sans-serif: monotype-grotesque, 'Lucida Sans', sans-serif;
$serif: orpheuspro, Palatino, Times, serif;