From fdf0a17056e9da0d4b3aea275b63094019eae667 Mon Sep 17 00:00:00 2001
From: shamalainen <sebastian@hamse.fi>
Date: Fri, 29 Jan 2021 15:52:41 +0200
Subject: [PATCH] Fine tune typography spacing
---
src/components/hy-hero/hy-hero.scss | 31 ++++++++++-------------------
1 file changed, 11 insertions(+), 20 deletions(-)
diff --git a/src/components/hy-hero/hy-hero.scss b/src/components/hy-hero/hy-hero.scss
index ccecc844..3daba811 100644
--- a/src/components/hy-hero/hy-hero.scss
+++ b/src/components/hy-hero/hy-hero.scss
@@ -314,20 +314,9 @@
}
h1 {
- @include font-weight($bold);
- box-decoration-break: clone;
- color: var(--grayscale-black);
display: inline-block !important;
- display: inline;
- font-family: var(--main-font-family);
- font-weight: bold;
- hyphens: auto;
- letter-spacing: -0.75px;
margin-bottom: 12px !important;
max-width: 100%;
- position: relative;
- text-transform: uppercase;
- word-wrap: break-word;
@include breakpoint($narrow) {
margin-bottom: 16px !important;
@@ -372,31 +361,33 @@
}
}
+// TODO: Update this to use styles straight from DSLIB (Ingress).
.hy-hero__description {
- // Ingress Small
- @include font-size(16px, 24px);
+ @include font-size(16px);
color: var(--grayscale-black);
font-family: var(--main-font-family);
font-weight: 600;
letter-spacing: -0.1px;
+ line-height: 22px;
margin: 0;
padding: 0;
+ position: relative;
@include breakpoint($narrow) {
- // Ingress Medium
- @include font-size(18px, 28px);
- letter-spacing: -0.1px;
+ line-height: 24px;
}
@include breakpoint($wide) {
- @include font-size(18px, 28px);
- letter-spacing: -0.1px;
- padding: 16px 40px 20px 0;
+ margin-top: -8px;
max-width: 40.21%;
- position: relative;
+ padding: 16px 40px 20px 0;
}
@include breakpoint($extrawide) {
+ @include font-size(18px);
+ letter-spacing: -0.16px;
+ line-height: 26px;
+ max-width: 40.13%;
padding: 28px 40px 32px 0;
}
}
--
GitLab