Overview
Comment: | add fabulist stylesheet |
---|---|
Downloads: | Tarball | ZIP archive | SQL archive |
Timelines: | family | ancestors | descendants | both | trunk |
Files: | files | file ages | folders |
SHA3-256: |
689acafd8235c427fa7f0d2f5f521003 |
User & Date: | lexi on 2019-07-29 06:11:34 |
Other Links: | manifest | tags |
Context
2019-07-29
| ||
06:29 | make css work with dillo check-in: b8722bb3e8 user: lexi tags: trunk | |
06:11 | add fabulist stylesheet check-in: 689acafd82 user: lexi tags: trunk | |
06:11 | updates check-in: e82124aeb7 user: lexi tags: trunk | |
Changes
Added fabulist.scss version [4bdf92a95d].
1 +body { 2 + background: #370017; 3 + color: #FFE1ED; 4 + max-width: 35em; 5 + padding: 1em; 6 + margin: auto; 7 + font-family: Alegreya, Junicode, GaramondNo8, "Garamond Premier Pro", "Adobe Garamond", Garamond, serif; 8 + font-size: 15pt; 9 +} 10 +$widget-accent:#610028; 11 +%widget { 12 + font-family: Alegreya, Junicode, GaramondNo8, "Garamond Premier Pro", "Adobe Garamond", Garamond, serif; 13 + font-size: 14pt; 14 + border: 1px inset darken($widget-accent,8); 15 + background: $widget-accent; 16 + color: white; 17 + padding: 0.3em; 18 + flex-grow: 2; 19 + text-shadow: 0 0 10px #E84B8C; 20 + box-sizing: border-box; 21 + &:focus { 22 + outline: none; 23 + background: lighten($widget-accent,5); 24 + } 25 +} 26 +textarea { @extend %widget; } 27 +input { 28 + @extend %widget; 29 + &[type=submit] { 30 + position: absolute; 31 + flex-grow: 0; 32 + width: 30%; 33 + right: 0; 34 + top: 1em; 35 + text-shadow: 0 0 10px #E84B8C; 36 + border: 1px solid black; 37 + &:hover { 38 + background-color: #E31E6F; 39 + color: black; 40 + } 41 + &:active { 42 + background-color: darken($widget-accent,9); 43 + color: lighten($widget-accent,60); 44 + padding-bottom: calc(0.3em - 2px); 45 + padding-top: calc(0.3em + 2px); 46 + } 47 + } 48 +} 49 +code { 50 + font-family: Inconsolata, Monaco, monocode; 51 + padding: 0.2em 0.3em; 52 + background: #740C38; 53 + border: 1px solid #260010; 54 +} 55 +textarea { 56 + height: 6em; 57 +} 58 +form { 59 + > div { 60 + position: relative; 61 + display: flex; 62 + width: 100%; 63 + align-items: center; 64 + } 65 + label { 66 + margin-right: 0.5em; 67 + margin-bottom: 0.5em; 68 + margin-top: 0.5em; 69 + font-weight: bold; 70 + } 71 +} 72 +a[href] { 73 + $a-color: #FF2E84; 74 + color: $a-color; 75 + text-decoration-color: darken($a-color,30); 76 + &:hover { 77 + color: lighten($a-color,40); 78 + text-decoration-color: lighten($a-color,20); 79 + } 80 +} 81 +h1 { 82 + font-weight: 100; 83 + margin-bottom: 0.0em; 84 + border-bottom: 1px solid #FF7AB1; 85 + a[href] { 86 + color: #FF7AB1; 87 + text-decoration: none; 88 + } 89 +}