breakpoint to 1085px

This commit is contained in:
isUnknown 2024-09-21 15:57:20 +02:00
parent 65d0740f92
commit 3809d96504
18 changed files with 36 additions and 35 deletions

View file

@ -112,7 +112,7 @@
text-align: -webkit-right;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.calendar-strip {
--padding-vertical: 1rem;
border-top: var(--border);

View file

@ -16,7 +16,7 @@ section.callout a {
align-items: center;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
section.callout {
padding: 2.25rem 2rem;
}

View file

@ -76,14 +76,14 @@
width: auto !important;
}
@media screen and (min-width: 1050px) {
@media screen and (min-width: 1085px) {
.session .left-column,
.session .right-column {
display: contents;
}
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.collapsable__content .session {
grid-template-columns: 1fr 1fr !important;
column-gap: 9vw;

View file

@ -20,7 +20,7 @@ section.key-infos .key-infos__key:not(:last-child) {
margin-right: 3rem;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
section.key-infos ul {
display: grid;
grid-template-columns: 1fr 1fr;

View file

@ -20,7 +20,7 @@
font-size: var(--font-size-s);
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.presentation {
grid-template-columns: 1fr;
row-gap: 1rem;

View file

@ -67,7 +67,7 @@
z-index: 3;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.events-grid {
--padding-vertical: 10vw;
}

View file

@ -42,7 +42,7 @@
top: 0;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.main-footer {
grid-template-columns: 1fr;
row-gap: 1rem;

View file

@ -256,7 +256,7 @@ img.show {
scale: var(--scale-up);
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.mobile-group {
display: block;
}

View file

@ -74,7 +74,7 @@
opacity: 0;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.hero__text h2 {
text-align: center;
}

View file

@ -170,7 +170,7 @@
max-width: 0.9ch;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.main-nav__featured-pages {
display: none;
}

View file

@ -41,7 +41,7 @@ section.newsletter form button[type="submit"]:hover::before {
transform: translateX(-2.5rem);
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
section.newsletter {
--padding-vertical: 1.3rem;
}

View file

@ -79,7 +79,7 @@
object-fit: contain;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.anchors-strip {
display: none;
}

View file

@ -2,7 +2,7 @@
margin-right: 4vw;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.filters {
display: none;
}

View file

@ -1,4 +1,4 @@
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.grid,
.hero {
grid-template-columns: 1fr;

View file

@ -45,7 +45,7 @@
width: 2.5rem;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
#swiper {
position: static !important;
}

View file

@ -45,7 +45,7 @@
--transition-image-opacity: opacity 0.3s ease-in-out;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
:root {
--font-size-xl: 2.5rem;
--font-size-h1: 1.875rem;

35
assets/dist/style.css vendored
View file

@ -138,7 +138,7 @@ input {
--transition-image-opacity: opacity 0.3s ease-in-out;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
:root {
--font-size-xl: 2.5rem;
--font-size-h1: 1.875rem;
@ -463,7 +463,7 @@ img.show {
scale: var(--scale-up);
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.mobile-group {
display: block;
}
@ -694,7 +694,7 @@ button:focus-visible {
max-width: 0.9ch;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.main-nav__featured-pages {
display: none;
}
@ -854,7 +854,7 @@ button:focus-visible {
opacity: 0;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.hero__text h2 {
text-align: center;
}
@ -999,7 +999,7 @@ button:focus-visible {
text-align: -webkit-right;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.calendar-strip {
--padding-vertical: 1rem;
border-top: var(--border);
@ -1187,7 +1187,7 @@ a.to-blank:hover > .ticket svg path.dot {
z-index: 3;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.events-grid {
--padding-vertical: 10vw;
}
@ -1224,7 +1224,7 @@ section.callout a {
align-items: center;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
section.callout {
padding: 2.25rem 2rem;
}
@ -1283,7 +1283,7 @@ section.newsletter form button[type="submit"]:hover::before {
transform: translateX(-2.5rem);
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
section.newsletter {
--padding-vertical: 1.3rem;
}
@ -1311,7 +1311,7 @@ section.key-infos .key-infos__key:not(:last-child) {
margin-right: 3rem;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
section.key-infos ul {
display: grid;
grid-template-columns: 1fr 1fr;
@ -1349,7 +1349,7 @@ section.key-infos .key-infos__key:not(:last-child) {
font-size: var(--font-size-s);
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.presentation {
grid-template-columns: 1fr;
row-gap: 1rem;
@ -1403,7 +1403,7 @@ section.key-infos .key-infos__key:not(:last-child) {
width: 2.5rem;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
#swiper {
position: static !important;
}
@ -1497,14 +1497,14 @@ section.key-infos .key-infos__key:not(:last-child) {
width: auto !important;
}
@media screen and (min-width: 1050px) {
@media screen and (min-width: 1085px) {
.session .left-column,
.session .right-column {
display: contents;
}
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.collapsable__content .session {
grid-template-columns: 1fr 1fr !important;
column-gap: 9vw;
@ -1549,7 +1549,7 @@ section.key-infos .key-infos__key:not(:last-child) {
margin-right: 4vw;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.filters {
display: none;
}
@ -1636,7 +1636,7 @@ section.key-infos .key-infos__key:not(:last-child) {
object-fit: contain;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.anchors-strip {
display: none;
}
@ -1721,7 +1721,7 @@ section.key-infos .key-infos__key:not(:last-child) {
top: 0;
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.main-footer {
grid-template-columns: 1fr;
row-gap: 1rem;
@ -1739,10 +1739,11 @@ section.key-infos .key-infos__key:not(:last-child) {
}
}
@media screen and (max-width: 1050px) {
@media screen and (max-width: 1085px) {
.grid,
.hero {
grid-template-columns: 1fr;
row-gap: var(--padding-vertical);
}
}

View file

@ -1,6 +1,6 @@
<?php if (isset($file)): ?>
<?php
$sizes = isset($size) ? '(min-width: 1050px) ' . $size . 'vw, 100vw' : '(min-width: 1050px) 50vw, 100vw';
$sizes = isset($size) ? '(min-width: 1085px) ' . $size . 'vw, 100vw' : '(min-width: 1085px) 50vw, 100vw';
$alt = $alt ?? $file->alt();
$crop = $crop ?? false;