sito-hackit-20/themes/maya0x17/static/theme.scss
2020-08-04 15:24:47 +02:00

78 lines
1.8 KiB
SCSS

/*
* palette da 4 colori che pare abbiano un che di maya:
* Crimson sky (#CF6766),Indigo (#30415D), Ultramarine (#031424) e Light Blue (#8EAEBD);
* oppureuna palette forse veramente troppo colorata e accesa:
* Papaya (#E24E42), Mustard(#E9B000), Blush (#EB6E80) e Aqua (#008F95).
* */
// variant 1
$c-crimson-sky: #CF6766;
$c-indigo: #30415D;
$c-ultramarine: #031424;
$c-lightblue: #8EAEBD;
// variant 2
$c-papaya: #E24E42;
$c-mustard: #E9B000;
$c-blush: #EB6E80;
$c-aqua: #008F95;
// variant 1
$c-primary: $c-crimson-sky;
$c-secondary: $c-lightblue;
$c-tertiary: $c-ultramarine;
$c-quaternary: $c-indigo;
$c-text: $c-secondary;
$c-bg: $c-tertiary;
$c-titles: $c-primary;
// variant 2
$c-primary: $c-papaya;
$c-secondary: $c-mustard;
$c-tertiary: $c-blush;
$c-quaternary: $c-aqua;
$c-text: $c-secondary;
$c-bg: $c-tertiary;
$c-titles: $c-primary;
#all-wrapper {
h1,h2,h3,h4,h5,h6,strong,b { color: $c-titles; font-weight: 400; }
}
body { background-color: $c-bg; font-size: 18px; color: $c-text; }
a, a:focus, a:hover, a:visited { color: $c-titles; }
h1 > (a, a:focus, a:active) { color: $c-titles; }
#all-wrapper {
padding-left: 8vw;
}
#menu-row {
display: none;
position: fixed;
top: 0px;
left: 8vw;
background: adjust-color($c-bg, $lightness: -50%); //rgb(34, 34, 34);
width: 89vw;
margin-top: 8vw;
border-radius: 1em;
padding: 1em 0px;
ul { list-style: none; }
> .columns { font-size: 120%; }
}
#logo-div {
position: fixed;
top: 5vw;
left: -8vw;
border-radius: 50%;
box-shadow: 0px 0 3vw black;
line-height: 0;
}
#logo-img {
width: 16vw;
/* alloca una dimensione approssimativa prima del rendering
* non sappiamo la dimensione esatta, ma con min-height possiamo indicargli che è circa-quadrata
* */
min-height: 15vw;
}