diff options
Diffstat (limited to 'assets/scss')
| -rw-r--r-- | assets/scss/_aside.scss | 2 | ||||
| -rw-r--r-- | assets/scss/_variables.scss | 8 | ||||
| -rw-r--r-- | assets/scss/_vda.scss | 38 | ||||
| -rw-r--r-- | assets/scss/_vdo.scss | 13 | ||||
| -rw-r--r-- | assets/scss/home.scss | 12 | ||||
| -rw-r--r-- | assets/scss/mobile.scss | 6 | ||||
| -rw-r--r-- | assets/scss/screen.scss | 6 | ||||
| -rw-r--r-- | assets/scss/txt.scss | 14 |
8 files changed, 64 insertions, 35 deletions
diff --git a/assets/scss/_aside.scss b/assets/scss/_aside.scss index 6afe3b6..1cafa25 100644 --- a/assets/scss/_aside.scss +++ b/assets/scss/_aside.scss @@ -124,7 +124,7 @@ body > aside { } &:last-child { - background: $bg-vdo; + background: $bg-vda; } */ } diff --git a/assets/scss/_variables.scss b/assets/scss/_variables.scss index e09fcf9..1f99762 100644 --- a/assets/scss/_variables.scss +++ b/assets/scss/_variables.scss @@ -22,8 +22,8 @@ $fg-ps: rgba(243, 240, 228, 1); $bg-gfx-ps-on: rgba(191, 138, 112, 0.9); $bg-txt-ps-on: rgba(166, 191, 112, 0.9); -$bg-vdo-ps-off: rgba(112, 166, 191, 0.5); -$bg-vdo-ps-on: rgba(112, 166, 191, 0.9); +$bg-vda-ps-off: rgba(112, 166, 191, 0.5); +$bg-vda-ps-on: rgba(112, 166, 191, 0.9); // On other pages: $bg-main: $fg-header; @@ -33,6 +33,6 @@ $bg-gfx-off: rgba(191, 138, 112, 0.7); $bg-gfx-on: rgba(205, 168, 150, 1); $bg-txt-off: rgba(166, 191, 112, 0.7); $bg-txt-on: rgba(187, 205, 150, 1); -$bg-vdo-off: rgba(109, 144, 162, 0.7); -$bg-vdo-on: rgba(109, 144, 162, 1); +$bg-vda-off: rgba(109, 144, 162, 0.7); +$bg-vda-on: rgba(109, 144, 162, 1); diff --git a/assets/scss/_vda.scss b/assets/scss/_vda.scss new file mode 100644 index 0000000..5caa950 --- /dev/null +++ b/assets/scss/_vda.scss @@ -0,0 +1,38 @@ +body.vda { + > main > article { +/* background: $bg-vda-on; */ + } + > aside { + &:hover, &:focus { + background-color: $bg-vda-on; + nav ul li:last-child { + background: $bg-vda-on; + } + } + } + #HeLa { + p > span { + display: block; + background-color: teal; + color: white; + font-weight: bold; + margin-top: 2rem; + padding: 1rem; + border-top-left-radius: 2rem; + } + button { + border: 1rem solid #ff667f; + height: auto; + background-color: teal; + color: white; + width: 100%; + border-radius: 0; + border-bottom-right-radius: 3rem; + font-size: larger; + &:hover, &:focus { + border-color: teal; + background-color: #ff667f; + } + } + } +} diff --git a/assets/scss/_vdo.scss b/assets/scss/_vdo.scss deleted file mode 100644 index 3578b93..0000000 --- a/assets/scss/_vdo.scss +++ /dev/null @@ -1,13 +0,0 @@ -body.vdo { - > main > article { - background: $bg-vdo-on; - } - > aside { - &:hover, &:focus { - background-color: $bg-vdo-on; - nav ul li:last-child { - background: $bg-vdo-on; - } - } - } -} diff --git a/assets/scss/home.scss b/assets/scss/home.scss index 72ec9a9..eec293b 100644 --- a/assets/scss/home.scss +++ b/assets/scss/home.scss @@ -502,7 +502,7 @@ body > footer { padding: 1rem 2rem; } - .media #vdo { + .media #vda { left: 0; background: rgba(112, 166, 191, 0.5); transform: rotate(-5deg); @@ -513,7 +513,7 @@ body > footer { display: none; } } - .media #vdo video { + .media #vda video { position: absolute; top: 50%; left: 50%; @@ -525,19 +525,19 @@ body > footer { z-index: -101; opacity: 0.1; } - .media #vdo:hover video { + .media #vda:hover video { opacity: 1; } - .media #vdo:hover { + .media #vda:hover { background: rgba(112, 166, 191, 0.9); margin: 0; transform: rotate(0); width: 40vw; } - .media #vdo h3 { + .media #vda h3 { transform: rotate(5deg) translateX(-2vw); } - .media #vdo:hover h3 { + .media #vda:hover h3 { transform: rotate(0) translateX(0) translateY(-5rem); color: rgba(109, 144, 162, 0.7); font-size: 18vw; diff --git a/assets/scss/mobile.scss b/assets/scss/mobile.scss index e568feb..38d3605 100644 --- a/assets/scss/mobile.scss +++ b/assets/scss/mobile.scss @@ -101,8 +101,8 @@ body { #txt, #txt h3 { background-color: $bg-txt-off; } -#vdo, #vdo h3 { - background-color: $bg-vdo-off; +#vda, #vda h3 { + background-color: $bg-vda-off; } .fixed.libre { @@ -176,7 +176,7 @@ body { &#txt h3 { right: 18vw; } - &#vdo h3 { + &#vda h3 { right: 2vw; } diff --git a/assets/scss/screen.scss b/assets/scss/screen.scss index 8828c85..4dcda84 100644 --- a/assets/scss/screen.scss +++ b/assets/scss/screen.scss @@ -16,7 +16,7 @@ **/ @import 'gfx'; @import 'txt'; -@import 'vdo'; +@import 'vda'; /** * Languages @@ -62,3 +62,7 @@ body { text-decoration: underline; } } + +img { + max-width: 100%; +} diff --git a/assets/scss/txt.scss b/assets/scss/txt.scss index 1ab8727..3a7d70b 100644 --- a/assets/scss/txt.scss +++ b/assets/scss/txt.scss @@ -7,8 +7,8 @@ $bg-gfx: rgba(191, 138, 112, 0.7); $bg-gfx-on: rgba(205, 168, 150, 1); $bg-txt: rgba(166, 191, 112, 0.9); $bg-txt-on: rgba(187, 205, 150, 1); -$bg-vdo: rgba(109, 144, 162, 0.7); -$bg-vdo-on: rgba(109, 144, 162, 1); +$bg-vda: rgba(109, 144, 162, 0.7); +$bg-vda-on: rgba(109, 144, 162, 1); $a-link: rgba(23, 123, 93, 1); $a-hover: black; @@ -168,13 +168,13 @@ body { } } - &.vdo { - background-color: $bg-vdo-on; + &.vda { + background-color: $bg-vda-on; > aside { &:hover, &:focus { - background-color: $bg-vdo-on; + background-color: $bg-vda-on; nav ul li:last-child { - background: $bg-vdo-on; + background: $bg-vda-on; } } } @@ -319,7 +319,7 @@ body { } &:last-child { - background: $bg-vdo; + background: $bg-vda; } } } |