aboutsummaryrefslogtreecommitdiff
path: root/assets/scss/home.scss
diff options
context:
space:
mode:
authorhellekin <how@cepheide.org>2023-05-07 10:10:06 +0200
committerhellekin <how@cepheide.org>2023-05-07 10:10:06 +0200
commitc424180f2d5bff5dc8368fb37294f116792ef2dc (patch)
tree8bf24e2e3a5044de8cab906f11ad7b87a73e772f /assets/scss/home.scss
parent915627f6c4b10ee9e0963f5b635812e5816e323d (diff)
downloadlesoiseaux.io-c424180f2d5bff5dc8368fb37294f116792ef2dc.tar.gz
Update index.html
Diffstat (limited to 'assets/scss/home.scss')
-rw-r--r--assets/scss/home.scss41
1 files changed, 35 insertions, 6 deletions
diff --git a/assets/scss/home.scss b/assets/scss/home.scss
index a80e473..57ebccc 100644
--- a/assets/scss/home.scss
+++ b/assets/scss/home.scss
@@ -1,5 +1,7 @@
@charset 'UTF-8';
+@import 'variables';
+@import 'branding';
html[lang='en'] :lang(fr) {
display: none !important;
@@ -351,14 +353,11 @@ body > footer {
overflow-y: auto;
}
-
-
body > header:hover ~ footer {
position: fixed;
bottom: 0;
display: block;
}
-
body > header:hover ~ footer > nav {
display: block;
}
@@ -400,7 +399,7 @@ body > footer {
color: rgba(0,0,0,0.2);
}
- h4, p {
+ h4, p, figure {
display: none;
}
@@ -414,7 +413,7 @@ body > footer {
color: rgba(0, 0, 0, 1);
}
- h4, p {
+ h4, p, figure {
display: block;
padding: 1rem;
color: black;
@@ -426,7 +425,7 @@ body > footer {
.media #gfx {
background: rgba(191, 138, 112,0.7);
transform: rotate(-4deg);
- margin: 0 -5vw 0 -2vw;
+ margin: 0 -3vw 0 0;
left: 0;
h3 {
@@ -452,6 +451,13 @@ body > footer {
transform: rotate(0) translateX(0) translateY(-4rem);
}
+ figure {
+ display: inline-block;
+ width: 197px;
+ padding: 0;
+ margin: 1rem;
+ }
+
svg {
opacity: 0.3;
width: calc(100% + 4rem);
@@ -492,6 +498,7 @@ body > footer {
text-decoration: none;
color: inherit;
}
+ .media #gfx:hover p.tagline,
.media #txt:hover p.tagline {
position: absolute;
top: 6rem;
@@ -590,6 +597,16 @@ body > footer {
transform: rotate(2deg) translate(0rem, 19.5vh);
}
+ footer {
+ position: fixed;
+ left: 0;
+ right: 0;
+ font-size: smaller;
+ background-color: rgba(109, 78, 128, 1);
+ display: none;
+ margin: 5rem auto 2rem auto;
+ width: 80vw;
+ }
}
@media screen and (max-device-width: 1023px) {
@@ -604,6 +621,18 @@ body > footer {
background: url(../img/logo-ps.svg) center calc(92% - 50vh) / contain no-repeat fixed;
}
+ body > footer {
+ position: relative;
+ left: 0;
+ right: 0;
+ font-size: smaller;
+ background-color: rgba(109, 78, 128, 1);
+ display: none;
+ margin: 1rem auto;
+ width: 80vw;
+ font-size: smaller;
+ }
+
}
.sinewave{