123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778 |
- /*
- * 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;
- }
|