studio-variable/index-website-static
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

page-article > page-enquete
All checks were successful
Deploy / Deploy to pre-production (push) Successful in 5s
Details

Browse source
This commit is contained in:
Julie Blanc 2025-12-19 10:48:31 +01:00
parent c20b493478
commit 16d9851535
7 changed files with 275 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

99
assets/css/template/_page-article.scss
View file

@ -1,99 +0,0 @@
.page-article header{
max-width: var(--max-w-content);
margin: calc(var(--spacing)*2) auto;
.page-type{
text-transform: uppercase;
color: var(--color-txt-light);
margin-bottom: calc(var(--spacing)*0.5);
}
h2{
font-size: var(--fs-xbig);
}
}
.page-article .section__article{
max-width: var(--max-w-content);
margin: calc(var(--spacing)*3) auto;
a:hover{
color: var(--grey-200);
}
.section__title{
font-weight: normal;
text-transform: uppercase;
font-size: var(--fs-medium);
margin-bottom: calc(var(--spacing)*1)
}
}
.page-article .hero{
width: 100vw;
position: relative;
left: calc(var(--padding-body)*-1);
margin: calc(var(--spacing)*3) 0;
figcaption{
color: var(--color-txt-light);
font-size: var(--fs-small);
max-width: var(--max-w-content);
margin: 0 auto;
padding-top: calc(var(--spacing)*0.5);
}
&.hero-video{
figure{
width: 100%;
img{
width: 100%;
aspect-ratio: 16/9;
object-fit: cover;
}
}
}
}
.page-article .short{
font-size: var(--fs-medium);
// margin: calc(var(--spacing)*3) auto;
max-width: var(--max-w-content);
}
.page-article #section__synthese{
font-size: var(--fs-medium);
}
.page-article #banner--page{
height: calc(100dvh - var(--header-h));
height: calc(100dvh - var(--header-h));
margin-bottom: calc((100dvh - var(--header-h))*-1);
background-color: red;
position: sticky;
top: var(--header-h);
width: 240px;
}
.page-article #section__dl{
margin-top: 0px;
border-bottom: var(--border-light);
.dl__group{
display: grid;
grid-template-columns: 40% 1fr;
border-top: var(--border-light);
padding: calc(var(--spacing)*0.5) 0;
}
dt{
color: var(--color-txt-light);
}
}

145
assets/css/template/_page-enquete.scss Normal file
View file

@ -0,0 +1,145 @@
.page-enquete{
header{
max-width: var(--max-w-content);
margin: calc(var(--spacing)*2) auto;
.page-type{
text-transform: uppercase;
color: var(--color-txt-light);
margin-bottom: calc(var(--spacing)*0.5);
}
h2{
font-size: var(--fs-xbig);
}
}
.section__article{
max-width: var(--max-w-content);
margin: calc(var(--spacing)*3) auto;
a:hover{
color: var(--grey-200);
}
.section__title{
font-weight: normal;
text-transform: uppercase;
font-size: var(--fs-medium);
margin-bottom: calc(var(--spacing)*1)
}
}
.hero{
width: 100vw;
position: relative;
left: calc(var(--padding-body)*-1);
margin: calc(var(--spacing)*3) 0;
figcaption{
color: var(--color-txt-light);
font-size: var(--fs-small);
max-width: var(--max-w-content);
margin: 0 auto;
padding-top: calc(var(--spacing)*0.5);
}
&.hero-video{
figure{
width: 100%;
img{
width: 100%;
aspect-ratio: 16/9;
object-fit: cover;
}
}
}
}
.short{
font-size: var(--fs-medium);
margin: auto;
max-width: var(--max-w-content);
}
#section__synthese{
font-size: var(--fs-medium);
p + p{
margin-top: 0.5em;
}
h4{
margin-top: 2em;
margin-bottom: 1em;
font-size: var(--fs-normal);
font-weight: normal;
text-decoration: 1px underline var(--color-txt-light);
text-underline-offset: 3px;
}
}
#banner--page{
height: calc(100vh - var(--header-h));
height: calc(100dvh - var(--header-h));
margin-bottom: calc((100vh - var(--header-h))*-1);
margin-bottom: calc((100dvh - var(--header-h))*-1);
padding-bottom: var(--padding-body);
position: sticky;
top: var(--header-h);
width: 240px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
#section__dl{
margin-top: calc(var(--spacing)*1.5);
border-bottom: var(--border-light);
.dl__group{
display: grid;
grid-template-columns: 40% 1fr;
border-top: var(--border-light);
padding: calc(var(--spacing)*0.5) 0;
}
dt{
color: var(--color-txt-light);
}
ul:not(.keywords){
list-style: none;
li{
padding-bottom: 0.2em;
}
}
}
#nav--page{
ul{
list-style: none;
li{
text-align: center;
color: var(--color-txt-light);
// text-transform: uppercase;
a{
display: block;
padding: 0.3em 0;
text-decoration: none;
}
}
}
}
}