{#if isValidDate(publishTime)}
Published
@@ -136,96 +143,10 @@
diff --git a/src/components/Theme/@types/component.ts b/src/components/Theme/@types/component.ts
index adeff911..1a961fbf 100644
--- a/src/components/Theme/@types/component.ts
+++ b/src/components/Theme/@types/component.ts
@@ -12,6 +12,10 @@ interface FontFamily {
'serif': string,
'sans-serif': string,
'monospace': string,
+ hed: string,
+ subhed: string,
+ body: string,
+ note: string,
}
interface FontSize {
diff --git a/src/components/Theme/themes/common.js b/src/components/Theme/themes/common.js
index 5696fb71..cd5ff952 100644
--- a/src/components/Theme/themes/common.js
+++ b/src/components/Theme/themes/common.js
@@ -6,6 +6,10 @@ export default {
'sans-serif': 'Knowledge, sans-serif',
monospace:
'Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
+ hed: 'var(--theme-font-family-sans-serif)',
+ subhed: 'var(--theme-font-family-sans-serif)',
+ body: 'var(--theme-font-family-serif)',
+ note: 'var(--theme-font-family-sans-serif)',
},
size: {
xxs: 'clamp(0.79rem, -0.2vw + 0.83rem, 0.67rem)',
diff --git a/src/scss/_TO-DEPRECATE/_body-text.scss b/src/scss/mixins/texts/_body.scss
similarity index 78%
rename from src/scss/_TO-DEPRECATE/_body-text.scss
rename to src/scss/mixins/texts/_body.scss
index d89e3006..3121db3b 100644
--- a/src/scss/_TO-DEPRECATE/_body-text.scss
+++ b/src/scss/mixins/texts/_body.scss
@@ -1,7 +1,8 @@
-@import '../fonts/mixins';
-@import '../fonts/variables';
-@import '../typography_old/font-size';
-@import '../colours/thematic/tr';
+// @import '../fonts/mixins';
+// @import '../fonts/variables';
+// @import '../typography_old/font-size';
+// @import '../colours/thematic/tr';
+@use '../../mixins' as *;
@mixin body-text {
h2,
@@ -12,7 +13,7 @@
p,
li,
blockquote {
- color: var(--theme-colour-text-primary, var(--tr-dark-grey));
+ @include text-primary;
}
p,
@@ -21,10 +22,9 @@
ol li,
ol li p {
-webkit-font-smoothing: antialiased;
- font-family: var(--theme-font-family-body, $font-family-serif);
- color: var(--theme-colour-text-primary, var(--tr-dark-grey));
-
- @extend .paragraph-size;
+ @include font-serif;
+ @include text-primary;
+ @include text-base;
a {
color: currentColor;
@@ -53,15 +53,6 @@
margin: 4rem 0 2rem;
text-align: center;
font-weight: 600;
-
- &::after {
- display: block;
- content: '';
- background: var(--theme-colour-text-secondary, var(--tr-medium-grey));
- height: 3px;
- width: 100px;
- margin: 10px auto 2rem;
- }
}
ul {
diff --git a/src/scss/_TO-DEPRECATE/_graphic.scss b/src/scss/mixins/texts/_graphic.scss
similarity index 100%
rename from src/scss/_TO-DEPRECATE/_graphic.scss
rename to src/scss/mixins/texts/_graphic.scss
diff --git a/src/scss/_TO-DEPRECATE/_note-text.scss b/src/scss/mixins/texts/_note.scss
similarity index 100%
rename from src/scss/_TO-DEPRECATE/_note-text.scss
rename to src/scss/mixins/texts/_note.scss
diff --git a/src/scss/reset/_main.scss b/src/scss/reset/_main.scss
index 401a9fef..cc958be6 100644
--- a/src/scss/reset/_main.scss
+++ b/src/scss/reset/_main.scss
@@ -40,3 +40,7 @@ ol ul,
ul ol {
margin-bottom: 0;
}
+
+a {
+ color: inherit;
+}
diff --git a/src/scss/tokens/spacers/_margin.scss b/src/scss/tokens/spacers/_margin.scss
index c78ca8e5..77ddd2b2 100644
--- a/src/scss/tokens/spacers/_margin.scss
+++ b/src/scss/tokens/spacers/_margin.scss
@@ -1,13 +1,38 @@
$margin-levels: (
'0': 0,
- '1': 1rem,
- '2': 2rem,
- '3': 3rem,
- '4': 4rem,
- '5': 5rem,
- '6': 6rem,
- '7': 7rem,
- '8': 8rem,
+ '0\\.5': 0.125rem,
+ '1': 0.25rem,
+ '1\\.5': 0.375rem,
+ '2': 0.5rem,
+ '2\\.5': 0.625rem,
+ '3': 0.75rem,
+ '3\\.5': 0.875rem,
+ '4': 1rem,
+ '5': 1.25rem,
+ '6': 1.5rem,
+ '7': 1.75rem,
+ '8': 2rem,
+ '9': 2.25rem,
+ '10': 2.5rem,
+ '11': 2.75rem,
+ '12': 3rem,
+ '14': 3.5rem,
+ '16': 4rem,
+ '20': 5rem,
+ '24': 6rem,
+ '28': 7rem,
+ '32': 8rem,
+ '36': 9rem,
+ '40': 10rem,
+ '44': 11rem,
+ '48': 12rem,
+ '52': 13rem,
+ '56': 14rem,
+ '60': 15rem,
+ '64': 16rem,
+ '72': 18rem,
+ '80': 20rem,
+ '96': 24rem,
);
@each $level, $value in $margin-levels {
diff --git a/src/scss/tokens/spacers/_padding.scss b/src/scss/tokens/spacers/_padding.scss
index 8d80255f..6d1a94c7 100644
--- a/src/scss/tokens/spacers/_padding.scss
+++ b/src/scss/tokens/spacers/_padding.scss
@@ -1,13 +1,38 @@
$padding-levels: (
'0': 0,
- '1': 0.5rem,
- '2': 1rem,
- '3': 1.75rem,
- '4': 2.25rem,
- '5': 3rem,
- '6': 4rem,
- '7': 5rem,
- '8': 6rem,
+ '0\\.5': 0.125rem,
+ '1': 0.25rem,
+ '1\\.5': 0.375rem,
+ '2': 0.5rem,
+ '2\\.5': 0.625rem,
+ '3': 0.75rem,
+ '3\\.5': 0.875rem,
+ '4': 1rem,
+ '5': 1.25rem,
+ '6': 1.5rem,
+ '7': 1.75rem,
+ '8': 2rem,
+ '9': 2.25rem,
+ '10': 2.5rem,
+ '11': 2.75rem,
+ '12': 3rem,
+ '14': 3.5rem,
+ '16': 4rem,
+ '20': 5rem,
+ '24': 6rem,
+ '28': 7rem,
+ '32': 8rem,
+ '36': 9rem,
+ '40': 10rem,
+ '44': 11rem,
+ '48': 12rem,
+ '52': 13rem,
+ '56': 14rem,
+ '60': 15rem,
+ '64': 16rem,
+ '72': 18rem,
+ '80': 20rem,
+ '96': 24rem,
);
@each $level, $value in $padding-levels {
diff --git a/src/scss/tokens/text/_font-family.scss b/src/scss/tokens/text/_font-family.scss
index ba9ce421..9abc2bbd 100644
--- a/src/scss/tokens/text/_font-family.scss
+++ b/src/scss/tokens/text/_font-family.scss
@@ -9,6 +9,18 @@
.font-mono {
@include font-mono;
}
+.font-hed {
+ @include font-hed;
+}
+.font-subhed {
+ @include font-subhed;
+}
+.font-body {
+ @include font-body;
+}
+.font-note {
+ @include font-note;
+}
.\!font-serif {
@include \!font-serif;
}
@@ -18,3 +30,15 @@
.\!font-mono {
@include \!font-mono;
}
+.\!font-hed {
+ @include \!font-hed;
+}
+.\!font-subhed {
+ @include \!font-subhed;
+}
+.\!font-body {
+ @include \!font-body;
+}
+.\!font-note {
+ @include \!font-note;
+}
diff --git a/src/scss/tokens/text/mixins/_font-family.scss b/src/scss/tokens/text/mixins/_font-family.scss
index 61c3ebac..d76132ec 100644
--- a/src/scss/tokens/text/mixins/_font-family.scss
+++ b/src/scss/tokens/text/mixins/_font-family.scss
@@ -7,6 +7,18 @@
@mixin font-mono {
font-family: var(--theme-font-family-monospace);
}
+@mixin font-hed {
+ font-family: var(--theme-font-family-hed);
+}
+@mixin font-subhed {
+ font-family: var(--theme-font-family-subhed);
+}
+@mixin font-body {
+ font-family: var(--theme-font-family-body);
+}
+@mixin font-note {
+ font-family: var(--theme-font-family-note);
+}
@mixin \!font-serif {
font-family: var(--theme-font-family-serif) !important;
}
@@ -16,3 +28,15 @@
@mixin \!font-mono {
font-family: var(--theme-font-family-monospace) !important;
}
+@mixin \!font-hed {
+ font-family: var(--theme-font-family-hed) !important;
+}
+@mixin \!font-subhed {
+ font-family: var(--theme-font-family-subhed) !important;
+}
+@mixin \!font-body {
+ font-family: var(--theme-font-family-body) !important;
+}
+@mixin \!font-note {
+ font-family: var(--theme-font-family-note) !important;
+}