flayks/housesof
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Use global typography styles on Poster page layout

Browse Source
This commit is contained in:
Félix Péault
2022-09-14 22:07:31 +02:00
parent 07060c8661
commit 0728491aa6
3 changed files with 19 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/style/_typography.scss
View File

@@ -142,9 +142,16 @@
// Large
.text-large {
font-size: rem(32px);
font-size: rem(24px);
font-weight: 400;
line-height: 1.5;
line-height: 1.4;
@include bp (sm) {
font-size: rem(28px);
}
@include bp (sd) {
font-size: rem(32px);
}
}
// Medium

22
src/style/layouts/_poster.scss
View File

@@ -73,20 +73,15 @@
// Title
dt {
color: $color-secondary;
font-family: $font-serif;
font-size: rem(36px);
line-height: 1.3;
line-height: 1.2;
}
// Text
dd {
margin-top: 8px;
font-size: rem(14px);
line-height: 1.4;
color: $color-gray;
@include bp (sm) {
max-width: none;
font-size: rem(16px);
}
}
}
@@ -177,7 +172,7 @@
white-space: pre-line;
@include bp (sm) {
padding: 144px 0 260px;
padding: clamp(88px, 20vw, 144px) 0 clamp(256px, 20vw, 320px);
margin: -120px 0;
}
@@ -186,25 +181,20 @@
max-width: 768px;
margin-left: 0;
margin-right: 0;
font-size: clamp(#{rem(22px)}, 5vw, #{rem(28px)});
font-weight: 200;
@include bp (sm) {
grid-column: 5 / span 12;
font-size: rem(32px);
}
}
.headline {
font-weight: 300;
}
.details {
color: $color-gray;
font-size: rem(16px);
margin-top: 32px;
line-height: 1.5;
font-weight: 300;
@include bp (sm) {
margin-top: 56px;
font-size: rem(18px);
margin-top: 40px;
}
}
}