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

fix investigation__header
All checks were successful
Deploy / Deploy to Production (push) Successful in 12s
Details

Browse source
This commit is contained in:
isUnknown 2026-02-27 16:38:28 +01:00
parent e4f04b9be6
commit b8352c81fa
3 changed files with 86 additions and 95 deletions
Download patch file Download diff file Expand all files Collapse all files

51
assets/css/components/_investigation-hero.scss
View file

@ -1,59 +1,56 @@
#investigation__hero{ #investigation__hero {
width: 100%; width: 100%;
max-width: var(--max-w-cards); max-width: var(--max-w-cards);
margin-inline: auto; margin-inline: auto;
figcaption {
figcaption{
color: var(--color-txt-light); color: var(--color-txt-light);
font-size: var(--fs-small); font-size: var(--fs-small);
@media #{$x-small}{ font-size: var(--fs-xsmall); } @media #{$x-small} {
padding: calc(var(--spacing)*0.5) var(--padding-body); font-size: var(--fs-xsmall);
}
padding: calc(var(--spacing) * 0.5) var(--padding-body);
padding-bottom: 0; padding-bottom: 0;
text-align: center; text-align: center;
max-width: var(--max-w-content); max-width: var(--max-w-content);
margin-inline: auto; margin-inline: auto;
} }
figure{ figure {
width: 100%; width: 100%;
position: relative; position: relative;
img{ img {
width: 100%; width: 100%;
height: auto;
aspect-ratio: 2/1; aspect-ratio: 2/1;
object-fit: cover; object-fit: cover;
} }
} }
.player-container {
.player-container{
width: 100%; width: 100%;
position: relative; position: relative;
aspect-ratio: 2/1; aspect-ratio: 2/1;
.extract, video{ .extract,
video {
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: cover; object-fit: cover;
position: relative; position: relative;
} }
.video-full {
.video-full{
width: 100%; width: 100%;
height: 100%; height: 100%;
iframe{ iframe {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
display: none; display: none;
} }
#hero-play-video{ #hero-play-video {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -64,39 +61,31 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
.btn--bold {
.btn--bold{
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 1ch; gap: 1ch;
padding: 0 1ch; padding: 0 1ch;
opacity: 0.8; opacity: 0.8;
&:hover{ &:hover {
opacity: 1; opacity: 1;
} }
} }
.text{ .text {
color: black; color: black;
font-weight: 500; font-weight: 500;
line-height: 1; line-height: 1;
padding-top: 4px; padding-top: 4px;
} }
svg{ svg {
width: 18px; width: 18px;
height: 18px; height: 18px;
fill: black; fill: black;
opacity: 0.8; opacity: 0.8;
} }
} }
} }
}
}

4
assets/css/style.css
View file

@ -975,6 +975,7 @@ figcaption,
} }
#investigation__hero figure img { #investigation__hero figure img {
width: 100%; width: 100%;
height: auto;
aspect-ratio: 2/1; aspect-ratio: 2/1;
-o-object-fit: cover; -o-object-fit: cover;
object-fit: cover; object-fit: cover;
@ -984,7 +985,8 @@ figcaption,
position: relative; position: relative;
aspect-ratio: 2/1; aspect-ratio: 2/1;
} }
#investigation__hero .player-container .extract, #investigation__hero .player-container video { #investigation__hero .player-container .extract,
#investigation__hero .player-container video {
width: 100%; width: 100%;
height: 100%; height: 100%;
-o-object-fit: cover; -o-object-fit: cover;

2
assets/css/style.css.map
View file

File diff suppressed because one or more lines are too long