aboutsummaryrefslogtreecommitdiff
path: root/assets/scss
diff options
context:
space:
mode:
Diffstat (limited to 'assets/scss')
-rw-r--r--assets/scss/_aside.scss2
-rw-r--r--assets/scss/_variables.scss8
-rw-r--r--assets/scss/_vda.scss38
-rw-r--r--assets/scss/_vdo.scss13
-rw-r--r--assets/scss/home.scss12
-rw-r--r--assets/scss/mobile.scss6
-rw-r--r--assets/scss/screen.scss6
-rw-r--r--assets/scss/txt.scss14
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;
}
}
}