aboutsummaryrefslogtreecommitdiff
path: root/assets/scss/_main.scss
diff options
context:
space:
mode:
authorhellekin <how@cepheide.org>2023-04-24 14:44:27 +0200
committerhellekin <how@cepheide.org>2023-04-24 14:44:27 +0200
commit1664fb9dc8d85a0e3e0dad4895197e1970136f3d (patch)
treef8e50975b14106300410f47a8d2c7eff6a1c35e6 /assets/scss/_main.scss
parentb1f9d3b7e61bbe2edd013bc2bb86f71e6af02d58 (diff)
downloadlesoiseaux.io-1664fb9dc8d85a0e3e0dad4895197e1970136f3d.tar.gz
New version of /txt/
Diffstat (limited to 'assets/scss/_main.scss')
-rw-r--r--assets/scss/_main.scss176
1 files changed, 88 insertions, 88 deletions
diff --git a/assets/scss/_main.scss b/assets/scss/_main.scss
index 0327543..013ac6c 100644
--- a/assets/scss/_main.scss
+++ b/assets/scss/_main.scss
@@ -9,141 +9,141 @@ body > main {
max-width: 96rem;
> article {
- /* background: $bg-txt-ps-on; */
+ /* background: $bg-txt-ps-on; */
background-color: $bg-main;
- margin: 0 auto;
- max-width: 60rem;
- min-height: calc(100vh - 24rem);
- height: auto;
- padding: 12rem 9rem;
+ margin: 0 auto;
+ max-width: 60rem;
+ min-height: calc(100vh - 24rem);
+ height: auto;
+ padding: 12rem 9rem;
}
}
article {
> header {
- p {
- font-size: 2rem;
- line-height: 1.25;
- font-family: $serif;
- text-variant: italic;
- /* padding: 2rem 4rem; */
+ p {
+ font-size: 2rem;
+ line-height: 1.25;
+ font-family: $serif;
+ text-variant: italic;
+ /* padding: 2rem 4rem; */
padding: 0rem 4rem;
- text-align: justify;
+ text-align: justify;
&:last-child {
- padding-bottom: 2rem;
- }
- }
+ padding-bottom: 2rem;
+ }
+ }
}
section:after {
- display: table;
- content: "";
- clear: both;
- margin-bottom: 2rem;
+ display: table;
+ content: "";
+ clear: both;
+ margin-bottom: 2rem;
}
aside {
- ul {
- display: table;
- position: relative;
- list-style: none;
- margin: 0 -8rem 1rem -8rem;
- width: calc(100% + 16rem);
+ ul {
+ display: table;
+ position: relative;
+ list-style: none;
+ margin: 0 -8rem 1rem -8rem;
+ width: calc(100% + 16rem);
- li {
- display: table-cell;
- text-align: center;
- }
+ li {
+ display: table-cell;
+ text-align: center;
+ }
- img {
- display: block;
+ img {
+ display: block;
background-color: black;
- width: 16rem; /* 16:9 for video */
- height: 9rem;
- margin: 1rem auto;
- }
- }
+ width: 16rem; /* 16:9 for video */
+ height: 9rem;
+ margin: 1rem auto;
+ }
+ }
}
.intro {
- background-color: rgba(255, 255, 255, 0.1);
- box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.5);
- height: auto;
- max-height: 2rem;
- margin: 2rem;
- padding: 2rem;
- overflow: hidden;
- text-overflow: ellipsis;
+ background-color: rgba(255, 255, 255, 0.1);
+ box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.5);
+ height: auto;
+ max-height: 2rem;
+ margin: 2rem;
+ padding: 2rem;
+ overflow: hidden;
+ text-overflow: ellipsis;
- p {
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
-
- &:hover {
- max-height: 100vh;
- p {
- white-space: normal;
- overflow: auto;
- }
- }
+ p {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ &:hover {
+ max-height: 100vh;
+ p {
+ white-space: normal;
+ overflow: auto;
+ }
+ }
}
.outro {
- p {
- font-size: 2rem;
- text-align: justify;
- }
+ p {
+ font-size: 2rem;
+ text-align: justify;
+ }
}
video, iframe {
- max-width: 100%;
+ max-width: 100%;
}
.video {
- margin: 0 -6rem 0 -4rem;
+ margin: 0 -6rem 0 -4rem;
- video {
- width: 30rem;
+ video {
+ width: 30rem;
height: 18.875rem;
- background: black;
- float: left;
- margin: 0 2rem 0 -4rem;
- }
- p {
- line-height: 1.25;
- }
- &:hover {
- video, iframe {
- width: 68rem;
+ background: black;
+ float: left;
+ margin: 0 2rem 0 -4rem;
+ }
+ p {
+ line-height: 1.25;
+ }
+ &:hover {
+ video, iframe {
+ width: 68rem;
height: 38.25rem;
- float: none;
+ float: none;
margin: auto;
- }
-/* video {
- width: calc(100% + 6rem);
- height: auto;
- float: none;
- } */
- }
+ }
+/* video {
+ width: calc(100% + 6rem);
+ height: auto;
+ float: none;
+ } */
+ }
}
}
section {
h2 + h3 {
- font-size: 2.5rem;
- font-style: italic;
- margin-top: -2rem;
+ font-size: 2.5rem;
+ font-style: italic;
+ margin-top: -2rem;
}
}
article {
#intro h2 {
- transform: rotate(270deg) translate(13.6rem, -34rem);
+ transform: rotate(270deg) translate(13.6rem, -34rem);
}
}