diff options
Diffstat (limited to 'assets/scss')
| -rw-r--r-- | assets/scss/_main.scss | 3 | ||||
| -rw-r--r-- | assets/scss/_txt.scss | 4 | ||||
| -rw-r--r-- | assets/scss/screen.scss | 105 |
3 files changed, 65 insertions, 47 deletions
diff --git a/assets/scss/_main.scss b/assets/scss/_main.scss index b7c235a..0327543 100644 --- a/assets/scss/_main.scss +++ b/assets/scss/_main.scss @@ -61,9 +61,8 @@ article { img { display: block; background-color: black; - width: 16rem; + width: 16rem; /* 16:9 for video */ height: 9rem; - /* height: 22.55rem; */ margin: 1rem auto; } } diff --git a/assets/scss/_txt.scss b/assets/scss/_txt.scss index de132e4..76cca30 100644 --- a/assets/scss/_txt.scss +++ b/assets/scss/_txt.scss @@ -25,4 +25,8 @@ body.txt { margin-top: auto; } } + article aside ul img { /* see _main */ + height: 22.55rem; /* 1:1.41 for books */ + } + } diff --git a/assets/scss/screen.scss b/assets/scss/screen.scss index 6e6f060..a18c9b9 100644 --- a/assets/scss/screen.scss +++ b/assets/scss/screen.scss @@ -1,18 +1,70 @@ +/** + * Variables + **/ @import 'variables'; + +/** + * Fonts + **/ +@import 'fonts'; + +/** + * Reset + **/ @import 'normalize'; @import 'skeleton'; + +/** + * Defaults + **/ + +a { + text-decoration: none; + + &:link { + color: $a-link; + } + &:hover { + color: $a-hover; + text-decoration: underline; + } + &:active { + color: $a-active; + } + &:visited { + color: $a-visited; + } +} + +img { + max-width: 100%; +} + +@keyframes fade-in { + from { + opacity: 0.2; + } to { + opacity: 1; + } +} +@keyframes fade-out { + from { + opacity: 1; + } to { + opacity: 0.2; + } +} + +/** + * Layout + **/ @import 'header'; @import 'main'; @import 'aside'; @import 'footer'; /** - * Fonts - **/ -@import 'fonts'; - -/** - * Pages + * Page overrides **/ @import 'gfx'; @import 'txt'; @@ -40,27 +92,9 @@ html[lang='fr'] :lang(en) { } /** - * Defaults + * Branding **/ -a { - text-decoration: none; - - &:link { - color: $a-link; - } - &:hover { - color: $a-hover; - text-decoration: underline; - } - &:active { - color: $a-active; - } - &:visited { - color: $a-visited; - } -} - span.ps { background: url(../img/logo-ps.svg) top left / 3rem no-repeat; opacity: 0.75; @@ -74,8 +108,7 @@ body { > header, > footer { :link, :visited { - color: $fg-header-h1; - text-decoration: none; + color: $fg-main; } } @@ -84,21 +117,3 @@ body { } } -img { - max-width: 100%; -} - -@keyframes fade-in { - from { - opacity: 0.2; - } to { - opacity: 1; - } -} -@keyframes fade-out { - from { - opacity: 1; - } to { - opacity: 0.2; - } -} |