horizontal scroll
All checks were successful
Deploy / Deploy to Production (push) Successful in 13s

This commit is contained in:
Julie Blanc 2026-02-06 17:07:18 +01:00
parent 65ffae5071
commit debbefb623
5 changed files with 188 additions and 32 deletions

View file

@ -271,6 +271,18 @@
gap: var(--padding-body);
margin-bottom: calc(var(--spacing)*4);
position: relative;
.media{
margin-inline: auto;
max-width: var(--max-w-content);
padding-left: var(--padding-inner);
padding-right: var(--padding-inner);
position: sticky;
top: calc(var(--header-h) + var(--spacing));
align-self: start;
}
}
@ -282,14 +294,45 @@
padding-bottom: calc(var(--spacing)*6);
}
.media{
margin-inline: auto;
max-width: var(--max-w-content);
padding-left: var(--padding-inner);
padding-right: var(--padding-inner);
position: sticky;
top: calc(var(--header-h) + var(--spacing));
align-self: start;
.subsection-w-hscroll{
position: relative;
margin-bottom: calc(var(--spacing)*4);
.horizontal-scroll{
height: 100vh;
width: 100vw;
overflow: hidden;
display: flex;
align-items: center;
}
.horizontal-scroll-wrapper{
display: flex;
flex-wrap: nowrap;
will-change: transform;
}
.horizontal-scroll-slide{
flex-shrink: 0;
width: 90vw;
max-width: 700px;
padding: 0 calc(var(--spacing) * 1);
figure, img{
width: 100%;
}
}
.horizontal-scroll-pagination{
position: fixed;
bottom: calc(var(--spacing) * 2);
left: 50%;
transform: translateX(-50%);
display: flex;
gap: 8px;
z-index: 10;
}
}