From beb88adf5f4fef169eb31466ec2d912c12614609 Mon Sep 17 00:00:00 2001
From: Patrick Marsceill <patrick.marsceill@gmail.com>
Date: Fri, 1 May 2020 17:32:33 -0400
Subject: [PATCH] Typography fixes
---
_layouts/default.html | 2 +-
_sass/base.scss | 26 ++++++++++++--------------
_sass/content.scss | 10 ++++++++++
_sass/support/_variables.scss | 4 ++--
_sass/support/mixins/_typography.scss | 7 ++++++-
_sass/typography.scss | 2 +-
6 files changed, 32 insertions(+), 19 deletions(-)
diff --git a/_layouts/default.html b/_layouts/default.html
index de394ddb..de5c7222 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -45,7 +45,7 @@ layout: table_wrappers
{% for link in site.aux_links %}
<li class="d-inline-block my-0{% unless forloop.last %} mr-2{% endunless %}">
<a href="{{ link.last }}"
- {% if site.aux_links_new_tab %}
+ {% if site.aux_links_new_tab %}
target="_blank" rel="noopener noreferrer"
{% endif %}
>
diff --git a/_sass/base.scss b/_sass/base.scss
index 20e49e8c..25f8b7d2 100644
--- a/_sass/base.scss
+++ b/_sass/base.scss
@@ -25,25 +25,23 @@ body {
background-color: $body-background-color;
}
-p,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
ol,
ul,
+dl,
pre,
address,
blockquote,
-dl,
+.table-wrapper {
+ margin-top: 0.5em;
+}
+
+table,
+p,
div,
-fieldset,
-form,
hr,
-noscript,
-table {
+form,
+fieldset,
+noscript {
margin-top: 0;
}
@@ -53,8 +51,8 @@ h3,
h4,
h5,
h6 {
- margin-top: 1.2em;
- margin-bottom: 0.8em;
+ margin-top: 1.5em;
+ margin-bottom: 0.25em;
font-weight: 500;
line-height: $body-heading-line-height;
color: $body-heading-color;
diff --git a/_sass/content.scss b/_sass/content.scss
index 2940286f..2dd65ba0 100644
--- a/_sass/content.scss
+++ b/_sass/content.scss
@@ -156,5 +156,15 @@
h5,
h6 {
position: relative;
+
+ &:first-child {
+ margin-top: 0;
+ }
+ }
+ + table,
+ .table-wrapper,
+ .code-example,
+ .highlighter-rouge {
+ margin-top: 1em;
}
}
diff --git a/_sass/support/_variables.scss b/_sass/support/_variables.scss
index 76d8b5df..3665a363 100644
--- a/_sass/support/_variables.scss
+++ b/_sass/support/_variables.scss
@@ -7,8 +7,8 @@ $body-font-family: -apple-system, BlinkMacSystemFont, "helvetica neue",
$mono-font-family: "SFMono-Regular", Menlo, Consolas, Monospace !default;
$root-font-size: 16px !default; // Base font-size for rems
$body-line-height: 1.4 !default;
-$content-line-height: 1.5 !default;
-$body-heading-line-height: 1.15 !default !default;
+$content-line-height: 1.6 !default;
+$body-heading-line-height: 1.25 !default;
//
// Colors
diff --git a/_sass/support/mixins/_typography.scss b/_sass/support/mixins/_typography.scss
index e6d85bea..1718a932 100644
--- a/_sass/support/mixins/_typography.scss
+++ b/_sass/support/mixins/_typography.scss
@@ -25,7 +25,7 @@
}
@mixin fs-4 {
- font-size: 14px !important;
+ font-size: 15px !important;
@include mq(sm) {
font-size: 16px !important;
@@ -45,11 +45,13 @@
@include mq(sm) {
font-size: 24px !important;
+ line-height: $body-heading-line-height;
}
}
@mixin fs-7 {
font-size: 24px !important;
+ line-height: $body-heading-line-height;
@include mq(sm) {
font-size: 32px !important;
@@ -58,6 +60,7 @@
@mixin fs-8 {
font-size: 32px !important;
+ line-height: $body-heading-line-height;
@include mq(sm) {
font-size: 36px !important;
@@ -66,6 +69,7 @@
@mixin fs-9 {
font-size: 36px !important;
+ line-height: $body-heading-line-height;
@include mq(sm) {
font-size: 42px !important;
@@ -74,6 +78,7 @@
@mixin fs-10 {
font-size: 42px !important;
+ line-height: $body-heading-line-height;
@include mq(sm) {
font-size: 48px !important;
diff --git a/_sass/typography.scss b/_sass/typography.scss
index fa8dcef6..91325e27 100644
--- a/_sass/typography.scss
+++ b/_sass/typography.scss
@@ -22,7 +22,7 @@ h3,
h4,
.text-delta {
@include fs-2;
- font-weight: 300;
+ font-weight: 400;
text-transform: uppercase;
letter-spacing: 0.1em;
}
--
GitLab