@reuters-graphics/graphics-components 0.1.6 → 0.1.7--canary.99.331bdb0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reuters-graphics/graphics-components",
-  "version": "0.1.6",
+  "version": "0.1.7--canary.99.331bdb0.0",
   "type": "module",
   "private": false,
   "homepage": "https://reuters-graphics.github.io/graphics-components",
@@ -8,6 +8,10 @@
     "type": "git",
     "url": "git+https://github.com/reuters-graphics/graphics-components.git"
   },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
   "scripts": {
     "start": "storybook dev -p 3000",
     "new": "node ./bin/newComponent/index.cjs",
@@ -15,7 +19,6 @@
     "build:chromatic": "storybook build -o docs",
     "build:docs": "storybook build -o docs && touch ./docs/.nojekyll",
     "build": "npm-run-all build:package build:docs",
-    "prepublishOnly": "npm run build:package",
     "postversion": "git push origin && git push origin --tags"
   },
   "license": "MIT",
@@ -27,64 +30,79 @@
     "node": ">=16.19"
   },
   "devDependencies": {
+    "@americanexpress/css-to-js": "^1.0.1",
     "@babel/core": "^7.21.4",
     "@babel/eslint-parser": "^7.21.3",
     "@babel/eslint-plugin": "^7.19.1",
     "@babel/preset-env": "^7.21.4",
     "@evilmartians/lefthook": "^1.3.10",
     "@reuters-graphics/eslint-config": "^0.0.2",
-    "@storybook/addon-actions": "^7.0.20",
-    "@storybook/addon-docs": "^7.0.20",
-    "@storybook/addon-essentials": "^7.0.20",
-    "@storybook/addon-interactions": "^7.0.20",
-    "@storybook/addon-links": "^7.0.20",
-    "@storybook/addon-mdx-gfm": "^7.0.20",
-    "@storybook/addon-svelte-csf": "^3.0.3",
-    "@storybook/blocks": "^7.0.20",
-    "@storybook/builder-vite": "^7.0.20",
-    "@storybook/manager-api": "^7.0.20",
+    "@storybook/addon-actions": "^7.1.0",
+    "@storybook/addon-docs": "^7.1.0",
+    "@storybook/addon-essentials": "^7.1.0",
+    "@storybook/addon-interactions": "^7.1.0",
+    "@storybook/addon-links": "^7.1.0",
+    "@storybook/addon-mdx-gfm": "^7.1.0",
+    "@storybook/addon-svelte-csf": "3.0.7",
+    "@storybook/blocks": "^7.1.0",
+    "@storybook/builder-vite": "^7.1.0",
+    "@storybook/manager-api": "^7.1.0",
     "@storybook/mdx2-csf": "^1.1.0",
-    "@storybook/svelte": "^7.0.20",
-    "@storybook/svelte-vite": "^7.0.20",
+    "@storybook/svelte": "^7.1.0",
+    "@storybook/svelte-vite": "^7.1.0",
     "@storybook/testing-library": "^0.1.0",
-    "@storybook/theming": "^7.0.20",
+    "@storybook/theming": "^7.1.0",
     "@sveltejs/vite-plugin-svelte": "^2.4.1",
     "@tsconfig/svelte": "^4.0.1",
     "@types/gtag.js": "^0.0.12",
+    "@types/mdx": "^2.0.5",
     "@types/proper-url-join": "^2.1.1",
     "@types/react-syntax-highlighter": "^15.5.7",
     "@typescript-eslint/eslint-plugin": "^5.59.0",
     "@typescript-eslint/parser": "^5.59.0",
+    "auto": "^11.0.0",
     "autoprefixer": "^10.4.14",
     "babel-loader": "^9.1.2",
     "change-case": "^4.1.2",
     "chromatic": "^6.19.9",
+    "colord": "^2.9.3",
+    "css-color-converter": "^2.0.0",
+    "deep-object-diff": "^1.1.9",
     "eslint": "^8.42.0",
     "eslint-config-prettier": "^8.8.0",
+    "eslint-config-standard-jsx": "^11.0.0",
+    "eslint-config-standard-react": "^13.0.0",
+    "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-n": "^16.0.0",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-storybook": "^0.6.12",
     "eslint-plugin-svelte3": "^4.0.0",
     "fs-extra": "^11.1.1",
     "kleur": "^4.1.5",
+    "mermaid": "^10.3.0",
     "npm-run-all": "^4.1.5",
     "postcss": "^8.4.24",
     "postcss-load-config": "^4.0.1",
     "prettier": "^2.8.8",
     "prettier-plugin-svelte": "^2.10.1",
     "prompts": "^2.4.2",
+    "prop-types": "^15.8.1",
     "react": "^18.2.0",
+    "react-colorful": "^5.6.1",
     "react-dom": "^18.2.0",
     "react-syntax-highlighter": "^15.5.0",
     "remark-gfm": "^3.0.1",
     "rimraf": "^5.0.0",
     "sass": "^1.63.0",
-    "storybook": "^7.0.20",
+    "storybook": "^7.1.0",
     "svelte": "^3.59.1",
     "svelte-loader": "^3.1.8",
     "svelte-preprocess": "^5.0.4",
     "svelte2tsx": "^0.6.15",
     "tiny-glob": "^0.2.9",
-    "typescript": "^5.1.3",
+    "typescript": "^5.1.6",
     "vite": "^4.3.9"
   },
   "dependencies": {
@@ -93,13 +111,13 @@
     "@fortawesome/free-solid-svg-icons": "^5.15.3",
     "@splidejs/svelte-splide": "^0.2.9",
     "@sveltejs/svelte-scroller": "^2.0.7",
-    "bootstrap": "^5.2.0",
     "classnames": "^2.3.1",
     "dayjs": "^1.11.3",
     "journalize": "^2.5.1",
     "lodash-es": "^4.17.21",
     "lottie-web": "^5.7.13",
     "marked": "^4.0.8",
+    "normalize.css": "^8.0.1",
     "proper-url-join": "^2.1.1",
     "pym.js": "^1.3.2",
     "slugify": "^1.6.5",
@@ -211,6 +229,7 @@
     "./components/Table/utils": "./dist/components/Table/utils.js",
     "./components/Theme/@types/component.ts": "./dist/components/Theme/@types/component.ts",
     "./components/Theme/Theme.svelte": "./dist/components/Theme/Theme.svelte",
+    "./components/Theme/themes/common": "./dist/components/Theme/themes/common.js",
     "./components/Theme/themes/dark": "./dist/components/Theme/themes/dark.js",
     "./components/Theme/themes/light": "./dist/components/Theme/themes/light.js",
     "./components/Theme/utils/flatten": "./dist/components/Theme/utils/flatten.js",
@@ -221,33 +240,115 @@
     "./components/Visible/Visible.svelte": "./dist/components/Visible/Visible.svelte",
     "./globals.d.ts": "./dist/globals.d.ts",
     "./scss/mixins": "./dist/scss/_mixins.scss",
-    "./scss/variables": "./dist/scss/_variables.scss",
-    "./scss/bootstrap/main": "./dist/scss/bootstrap/_main.scss",
-    "./scss/bootstrap/variables": "./dist/scss/bootstrap/_variables.scss",
+    "./scss/colours/main": "./dist/scss/colours/_main.scss",
+    "./scss/colours/primary/amber": "./dist/scss/colours/primary/_amber.scss",
+    "./scss/colours/primary/blue": "./dist/scss/colours/primary/_blue.scss",
+    "./scss/colours/primary/cyan": "./dist/scss/colours/primary/_cyan.scss",
+    "./scss/colours/primary/emerald": "./dist/scss/colours/primary/_emerald.scss",
+    "./scss/colours/primary/fuchsia": "./dist/scss/colours/primary/_fuchsia.scss",
+    "./scss/colours/primary/green": "./dist/scss/colours/primary/_green.scss",
+    "./scss/colours/primary/grey": "./dist/scss/colours/primary/_grey.scss",
+    "./scss/colours/primary/indigo": "./dist/scss/colours/primary/_indigo.scss",
+    "./scss/colours/primary/lime": "./dist/scss/colours/primary/_lime.scss",
+    "./scss/colours/primary/neutral": "./dist/scss/colours/primary/_neutral.scss",
+    "./scss/colours/primary/orange": "./dist/scss/colours/primary/_orange.scss",
+    "./scss/colours/primary/pink": "./dist/scss/colours/primary/_pink.scss",
+    "./scss/colours/primary/purple": "./dist/scss/colours/primary/_purple.scss",
+    "./scss/colours/primary/red": "./dist/scss/colours/primary/_red.scss",
+    "./scss/colours/primary/rose": "./dist/scss/colours/primary/_rose.scss",
+    "./scss/colours/primary/sky": "./dist/scss/colours/primary/_sky.scss",
+    "./scss/colours/primary/slate": "./dist/scss/colours/primary/_slate.scss",
+    "./scss/colours/primary/stone": "./dist/scss/colours/primary/_stone.scss",
+    "./scss/colours/primary/teal": "./dist/scss/colours/primary/_teal.scss",
+    "./scss/colours/primary/violet": "./dist/scss/colours/primary/_violet.scss",
+    "./scss/colours/primary/yellow": "./dist/scss/colours/primary/_yellow.scss",
+    "./scss/colours/primary/zinc": "./dist/scss/colours/primary/_zinc.scss",
+    "./scss/colours/thematic/grey": "./dist/scss/colours/thematic/_grey.scss",
     "./scss/colours/thematic/nord": "./dist/scss/colours/thematic/_nord.scss",
     "./scss/colours/thematic/tr": "./dist/scss/colours/thematic/_tr.scss",
-    "./scss/components/hero-title": "./dist/scss/components/_hero-title.scss",
     "./scss/fonts/font-faces": "./dist/scss/fonts/_font-faces.scss",
-    "./scss/fonts/mixins": "./dist/scss/fonts/_mixins.scss",
-    "./scss/fonts/rules": "./dist/scss/fonts/_rules.scss",
-    "./scss/fonts/variables": "./dist/scss/fonts/_variables.scss",
     "./scss/main": "./dist/scss/main.scss",
     "./scss/mixins/block": "./dist/scss/mixins/_block.scss",
-    "./scss/mixins/body-text": "./dist/scss/mixins/_body-text.scss",
-    "./scss/mixins/graphic": "./dist/scss/mixins/_graphic.scss",
-    "./scss/mixins/note-text": "./dist/scss/mixins/_note-text.scss",
-    "./scss/mixins/visually-hidden": "./dist/scss/mixins/_visually-hidden.scss",
-    "./scss/spacers/rules": "./dist/scss/spacers/_rules.scss",
-    "./scss/spacers/variables": "./dist/scss/spacers/_variables.scss",
-    "./scss/typography/box-shadow": "./dist/scss/typography/_box-shadow.scss",
-    "./scss/typography/font-size": "./dist/scss/typography/_font-size.scss",
-    "./scss/typography/letter-spacing": "./dist/scss/typography/_letter-spacing.scss",
-    "./scss/typography/main": "./dist/scss/typography/_main.scss",
-    "./scss/typography/mixins": "./dist/scss/typography/_mixins.scss",
-    "./scss/typography/rules": "./dist/scss/typography/_rules.scss",
-    "./scss/typography/text-shadow": "./dist/scss/typography/_text-shadow.scss",
-    "./scss/typography/transform": "./dist/scss/typography/_transform.scss",
-    "./scss/typography/variables": "./dist/scss/typography/_variables.scss",
+    "./scss/mixins/main": "./dist/scss/mixins/_main.scss",
+    "./scss/reset/main": "./dist/scss/reset/_main.scss",
+    "./scss/reset/typography": "./dist/scss/reset/_typography.scss",
+    "./scss/token-classes": "./dist/scss/token-classes.scss",
+    "./scss/tokens/accessibility/main": "./dist/scss/tokens/accessibility/_main.scss",
+    "./scss/tokens/accessibility/visibility": "./dist/scss/tokens/accessibility/_visibility.scss",
+    "./scss/tokens/accessibility/mixins/main": "./dist/scss/tokens/accessibility/mixins/_main.scss",
+    "./scss/tokens/accessibility/mixins/visibility": "./dist/scss/tokens/accessibility/mixins/_visibility.scss",
+    "./scss/tokens/backgrounds/background-color": "./dist/scss/tokens/backgrounds/_background-color.scss",
+    "./scss/tokens/backgrounds/main": "./dist/scss/tokens/backgrounds/_main.scss",
+    "./scss/tokens/backgrounds/mixins/background-color": "./dist/scss/tokens/backgrounds/mixins/_background-color.scss",
+    "./scss/tokens/backgrounds/mixins/main": "./dist/scss/tokens/backgrounds/mixins/_main.scss",
+    "./scss/tokens/borders/border-color": "./dist/scss/tokens/borders/_border-color.scss",
+    "./scss/tokens/borders/border-radius": "./dist/scss/tokens/borders/_border-radius.scss",
+    "./scss/tokens/borders/border-style": "./dist/scss/tokens/borders/_border-style.scss",
+    "./scss/tokens/borders/border-width": "./dist/scss/tokens/borders/_border-width.scss",
+    "./scss/tokens/borders/main": "./dist/scss/tokens/borders/_main.scss",
+    "./scss/tokens/interactivity/cursor": "./dist/scss/tokens/interactivity/_cursor.scss",
+    "./scss/tokens/interactivity/main": "./dist/scss/tokens/interactivity/_main.scss",
+    "./scss/tokens/interactivity/pointer-events": "./dist/scss/tokens/interactivity/_pointer-events.scss",
+    "./scss/tokens/layout/box-sizing": "./dist/scss/tokens/layout/_box-sizing.scss",
+    "./scss/tokens/layout/display": "./dist/scss/tokens/layout/_display.scss",
+    "./scss/tokens/layout/floats": "./dist/scss/tokens/layout/_floats.scss",
+    "./scss/tokens/layout/main": "./dist/scss/tokens/layout/_main.scss",
+    "./scss/tokens/layout/object-fit": "./dist/scss/tokens/layout/_object-fit.scss",
+    "./scss/tokens/layout/object-position": "./dist/scss/tokens/layout/_object-position.scss",
+    "./scss/tokens/layout/overflow": "./dist/scss/tokens/layout/_overflow.scss",
+    "./scss/tokens/layout/position": "./dist/scss/tokens/layout/_position.scss",
+    "./scss/tokens/layout/flex/align-content": "./dist/scss/tokens/layout/flex/_align-content.scss",
+    "./scss/tokens/layout/flex/align-items": "./dist/scss/tokens/layout/flex/_align-items.scss",
+    "./scss/tokens/layout/flex/align-self": "./dist/scss/tokens/layout/flex/_align-self.scss",
+    "./scss/tokens/layout/flex/flex-direction": "./dist/scss/tokens/layout/flex/_flex-direction.scss",
+    "./scss/tokens/layout/flex/flex-grow": "./dist/scss/tokens/layout/flex/_flex-grow.scss",
+    "./scss/tokens/layout/flex/flex-shrink": "./dist/scss/tokens/layout/flex/_flex-shrink.scss",
+    "./scss/tokens/layout/flex/flex-wrap": "./dist/scss/tokens/layout/flex/_flex-wrap.scss",
+    "./scss/tokens/layout/flex/flex": "./dist/scss/tokens/layout/flex/_flex.scss",
+    "./scss/tokens/layout/flex/justify-content": "./dist/scss/tokens/layout/flex/_justify-content.scss",
+    "./scss/tokens/layout/flex/justify-items": "./dist/scss/tokens/layout/flex/_justify-items.scss",
+    "./scss/tokens/layout/flex/justify-self": "./dist/scss/tokens/layout/flex/_justify-self.scss",
+    "./scss/tokens/layout/flex/main": "./dist/scss/tokens/layout/flex/_main.scss",
+    "./scss/tokens/sizing/height": "./dist/scss/tokens/sizing/_height.scss",
+    "./scss/tokens/sizing/main": "./dist/scss/tokens/sizing/_main.scss",
+    "./scss/tokens/sizing/max-height": "./dist/scss/tokens/sizing/_max-height.scss",
+    "./scss/tokens/sizing/max-width": "./dist/scss/tokens/sizing/_max-width.scss",
+    "./scss/tokens/sizing/min-height": "./dist/scss/tokens/sizing/_min-height.scss",
+    "./scss/tokens/sizing/min-width": "./dist/scss/tokens/sizing/_min-width.scss",
+    "./scss/tokens/sizing/width": "./dist/scss/tokens/sizing/_width.scss",
+    "./scss/tokens/spacers/fluid-margin": "./dist/scss/tokens/spacers/_fluid-margin.scss",
+    "./scss/tokens/spacers/fluid-padding": "./dist/scss/tokens/spacers/_fluid-padding.scss",
+    "./scss/tokens/spacers/main": "./dist/scss/tokens/spacers/_main.scss",
+    "./scss/tokens/spacers/margin": "./dist/scss/tokens/spacers/_margin.scss",
+    "./scss/tokens/spacers/padding": "./dist/scss/tokens/spacers/_padding.scss",
+    "./scss/tokens/spacers/mixins/fluid-margin": "./dist/scss/tokens/spacers/mixins/_fluid-margin.scss",
+    "./scss/tokens/spacers/mixins/fluid-padding": "./dist/scss/tokens/spacers/mixins/_fluid-padding.scss",
+    "./scss/tokens/spacers/mixins/main": "./dist/scss/tokens/spacers/mixins/_main.scss",
+    "./scss/tokens/text/color": "./dist/scss/tokens/text/_color.scss",
+    "./scss/tokens/text/font-family": "./dist/scss/tokens/text/_font-family.scss",
+    "./scss/tokens/text/font-size": "./dist/scss/tokens/text/_font-size.scss",
+    "./scss/tokens/text/font-style": "./dist/scss/tokens/text/_font-style.scss",
+    "./scss/tokens/text/font-weight": "./dist/scss/tokens/text/_font-weight.scss",
+    "./scss/tokens/text/letter-spacing": "./dist/scss/tokens/text/_letter-spacing.scss",
+    "./scss/tokens/text/line-height": "./dist/scss/tokens/text/_line-height.scss",
+    "./scss/tokens/text/main": "./dist/scss/tokens/text/_main.scss",
+    "./scss/tokens/text/text-align": "./dist/scss/tokens/text/_text-align.scss",
+    "./scss/tokens/text/text-decoration": "./dist/scss/tokens/text/_text-decoration.scss",
+    "./scss/tokens/text/text-stroke": "./dist/scss/tokens/text/_text-stroke.scss",
+    "./scss/tokens/text/text-transform": "./dist/scss/tokens/text/_text-transform.scss",
+    "./scss/tokens/text/vertical-align": "./dist/scss/tokens/text/_vertical-align.scss",
+    "./scss/tokens/text/white-space": "./dist/scss/tokens/text/_white-space.scss",
+    "./scss/tokens/text/word-break": "./dist/scss/tokens/text/_word-break.scss",
+    "./scss/tokens/text/mixins/color": "./dist/scss/tokens/text/mixins/_color.scss",
+    "./scss/tokens/text/mixins/font-family": "./dist/scss/tokens/text/mixins/_font-family.scss",
+    "./scss/tokens/text/mixins/font-size": "./dist/scss/tokens/text/mixins/_font-size.scss",
+    "./scss/tokens/text/mixins/font-weight": "./dist/scss/tokens/text/mixins/_font-weight.scss",
+    "./scss/tokens/text/mixins/letter-spacing": "./dist/scss/tokens/text/mixins/_letter-spacing.scss",
+    "./scss/tokens/text/mixins/line-height": "./dist/scss/tokens/text/mixins/_line-height.scss",
+    "./scss/tokens/text/mixins/main": "./dist/scss/tokens/text/mixins/_main.scss",
+    "./scss/tokens/text/mixins/text-stroke": "./dist/scss/tokens/text/mixins/_text-stroke.scss",
+    "./scss/tokens/variables/main": "./dist/scss/tokens/variables/_main.scss",
+    "./scss/tokens/variables/theme": "./dist/scss/tokens/variables/_theme.scss",
     ".": "./dist/index.js"
   },
   "svelte": "./dist/index.js",
@@ -255,4 +356,4 @@
     "url": "https://github.com/reuters-graphics/graphics-components/issues"
   },
   "readme": "ERROR: No README data found!"
-}
+}

package/dist/scss/_variables.scss

@@ -1,2 +0,0 @@
-@import "fonts/variables";
-@import "typography/variables";

package/dist/scss/bootstrap/_main.scss

@@ -1,34 +0,0 @@
-// Bootstrap overrides...
-@import "variables";
-
-
-// Configuration
-@import "bootstrap/scss/functions";
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/maps";
-@import "bootstrap/scss/mixins";
-@import "bootstrap/scss/utilities";
-
-// Layout & components
-@import "bootstrap/scss/root";
-@import "bootstrap/scss/reboot";
-@import "bootstrap/scss/type";
-@import "bootstrap/scss/images";
-@import "bootstrap/scss/containers";
-@import "bootstrap/scss/grid";
-@import "bootstrap/scss/tables";
-@import "bootstrap/scss/forms";
-@import "bootstrap/scss/buttons";
-@import "bootstrap/scss/transitions";
-@import "bootstrap/scss/dropdown";
-@import "bootstrap/scss/button-group";
-
-// // Helpers
-// @import "bootstrap/scss/helpers";
-
-// // Utilities
-// @import "bootstrap/scss/utilities/api";
-
-
-// // This should go somewhere...
-// $hr-border-width: $border-width !default;

package/dist/scss/bootstrap/_variables.scss

@@ -1,10 +0,0 @@
-// Controls spacing like bootstrap's margin classes...
-$spacer: 1rem;
-$spacers: (
-  0: 0,
-  1: $spacer * .25,
-  2: $spacer * .5,
-  3: $spacer,
-  4: $spacer * 1.5,
-  5: $spacer * 3,
-);

package/dist/scss/components/_hero-title.scss

@@ -1,118 +0,0 @@
-// TO BE DELETED...
-
-@import '~@reuters-graphics/style-color/scss/categorical/base';
-
-section.hero-title {
-  @extend .clearfix;
-  @extend .well, .widest;
-
-  position: relative;
-
-  figure {
-    position: relative;
-    margin-left: -15px;
-    width: 100vw;
-    height: calc(100vh - 60px);
-    max-height: 150vw;
-
-    @include media-breakpoint-down(sm) {
-      height: calc(70vh);
-    }
-
-    img {
-      position: absolute;
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
-      left: 50%;
-      top: 50%;
-      transform: translate(-50%, -50%);
-
-      &.crop-left {
-        object-position: 100% 0;
-      }
-
-      &.crop-right {
-        object-position: 0 0;
-      }
-    }
-
-    .overlay {
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      background-color: rgba(0, 0, 0, 0.1);
-
-      &.darker {
-        background-color: rgba(0, 0, 0, 0.25);
-      }
-
-      &.darkest {
-        background-color: rgba(0, 0, 0, 0.5);
-      }
-
-      &.light {
-        background-color: rgba(255, 255, 255, 0.2);
-      }
-
-      &.lighter {
-        background-color: rgba(255, 255, 255, 0.4);
-      }
-
-      &.lightest {
-        background-color: rgba(255, 255, 255, 0.6);
-      }
-    }
-  }
-
-  .title {
-    width: 100%;
-    position: absolute;
-    top: calc(50% - 60px);
-    text-align: center;
-
-    &.top {
-      top: 20px;
-    }
-
-    &.bottom {
-      top: auto;
-      bottom: 20px;
-    }
-
-    &.left {
-      text-align: left;
-    }
-
-    &.right {
-      text-align: right;
-    }
-
-    h2,
-    p {
-      @extend .font-sans;
-    }
-
-    h2 {
-      margin: 0;
-      font-size: 4rem;
-      line-height: 4rem;
-
-      @include media-breakpoint-down(sm) {
-        font-size: 2.5rem;
-        line-height: 2.5rem;
-      }
-    }
-
-    p.section-title {
-      @extend .spaced-least;
-      @extend .uppercase;
-
-      margin: 0 0 2px;
-      font-weight: 600;
-      font-size: 0.8rem;
-    }
-  }
-}

package/dist/scss/fonts/_mixins.scss

@@ -1,25 +0,0 @@
-@import '../fonts/variables';
-
-@mixin font-sans($i: false) {
-  $important: if($i, '!important', '');
-
-  font-family: $font-family-sans-serif #{$important};
-}
-
-@mixin font-serif($i: false) {
-  $important: if($i, '!important', '');
-
-  font-family: $font-family-serif #{$important};
-}
-
-@mixin font-monospace($i: false) {
-  $important: if($i, '!important', '');
-
-  font-family: $font-family-monospace #{$important};
-}
-
-@mixin font-display($i: false) {
-  $important: if($i, '!important', '');
-
-  font-family: $font-family-display #{$important};
-}

package/dist/scss/fonts/_rules.scss

@@ -1,19 +0,0 @@
-@import 'variables';
-
-.font-sans {
-  font-family: var(
-    --theme-font-family-sans-serif,
-    $font-family-display
-  ) !important;
-}
-
-.font-serif {
-  font-family: var(--theme-font-family-serif, $font-family-serif) !important;
-}
-
-.font-monospace {
-  font-family: var(
-    --theme-font-family-monospace,
-    $font-family-monospace
-  ) !important;
-}

package/dist/scss/fonts/_variables.scss

@@ -1,26 +0,0 @@
-$font-family-serif: var(--theme-font-family-serif, 'freight-book', serif);
-
-$font-family-sans-serif: var(
-  --theme-font-family-sans-serif,
-  'Source Sans Pro',
-  -apple-system,
-  BlinkMacSystemFont,
-  'Segoe UI',
-  Roboto,
-  'Helvetica Neue',
-  Helvetica,
-  Arial,
-  sans-serif
-);
-
-$font-family-monospace: var(
-  --theme-font-family-monspace,
-  Menlo,
-  Monaco,
-  Consolas,
-  'Liberation Mono',
-  'Courier New',
-  monospace
-);
-
-$font-family-display: 'Knowledge', 'Source Sans Pro', Arial, sans-serif;

package/dist/scss/mixins/_body-text.scss

@@ -1,113 +0,0 @@
-@import '../fonts/mixins';
-@import '../fonts/variables';
-@import '../typography/font-size';
-@import '../colours/thematic/tr';
-
-@mixin body-text {
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  p,
-  li,
-  blockquote {
-    color: var(--theme-colour-text-primary, $tr-dark-grey);
-  }
-  p,
-  ul li,
-  ul li p,
-  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, $tr-dark-grey);
-
-    @extend .paragraph-size;
-
-    a {
-      color: currentColor;
-      background-size: 1px 1px;
-      background-image: url('data:image/svg+xml;utf8,<svg preserveAspectRatio="none" viewBox="0 0 1 1" xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="0" x2="2" y2="2" style="stroke: currentColor; opacity: 0.8;" /></svg>');
-      background-position: 0 1.3rem;
-      background-repeat: repeat-x;
-      text-decoration: none;
-      // TODO: Assign this to background colour CSS var and the underline will skip descenders
-      text-shadow: 1px 1px var(--theme-colour-background, #ffffff),
-        1px -1px var(--theme-colour-background, #ffffff),
-        -1px 1px var(--theme-colour-background, #ffffff),
-        -1px -1px var(--theme-colour-background, #ffffff);
-
-      @media (max-width: 540px) {
-        background-position: 0 1.1rem;
-      }
-
-      &:hover {
-        text-decoration: none;
-      }
-    }
-  }
-
-  h2 {
-    margin: 4rem 0 2rem;
-    text-align: center;
-    font-weight: 600;
-
-    &::after {
-      display: block;
-      content: '';
-      background: var(--theme-colour-text-secondary, $tr-medium-grey);
-      height: 3px;
-      width: 100px;
-      margin: 10px auto 2rem;
-    }
-  }
-
-  ul {
-    padding-left: 1.75rem;
-    list-style-type: square;
-  }
-  p + ul {
-    margin-top: -0.75rem;
-  }
-
-  blockquote {
-    margin: 30px 0;
-    border-left: 2px solid var(--theme-colour-text-secondary, $tr-medium-grey);
-    padding-left: 15px;
-
-    p {
-      @extend .blockquote-size;
-      font-family: var(--theme-font-family-body, $font-family-serif);
-    }
-
-    // Markdown cheat to use for attribution
-    blockquote {
-      border: 0;
-      padding: 0;
-      margin: -5px 0 0;
-
-      p {
-        font-family: var(--theme-font-family-body, $font-family-serif);
-        color: var(--theme-colour-text-primary, $tr-dark-grey);
-        font-size: 1rem;
-
-        @media (max-width: 540px) {
-          font-size: 0.9rem;
-        }
-      }
-
-      // Kill any additional nestings...
-      blockquote {
-        display: none;
-      }
-    }
-  }
-
-  &.font-sans {
-    font-family: var(
-      --theme-font-family-sans-serif,
-      $font-family-sans-serif
-    ) !important;
-  }
-}