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

package/dist/scss/colours/primary/_teal.scss

@@ -0,0 +1,13 @@
+:root {
+  --teal-50: #f0fdfa;
+  --teal-100: #ccfbf1;
+  --teal-200: #99f6e4;
+  --teal-300: #5eead4;
+  --teal-400: #2dd4bf;
+  --teal-500: #14b8a6;
+  --teal-600: #0d9488;
+  --teal-700: #0f766e;
+  --teal-800: #115e59;
+  --teal-900: #134e4a;
+  --teal-950: #042f2e;
+}

package/dist/scss/colours/primary/_violet.scss

@@ -0,0 +1,13 @@
+:root {
+  --violet-50: #f5f3ff;
+  --violet-100: #ede9fe;
+  --violet-200: #ddd6fe;
+  --violet-300: #c4b5fd;
+  --violet-400: #a78bfa;
+  --violet-500: #8b5cf6;
+  --violet-600: #7c3aed;
+  --violet-700: #6d28d9;
+  --violet-800: #5b21b6;
+  --violet-900: #4c1d95;
+  --violet-950: #2e1065;
+}

package/dist/scss/colours/primary/_yellow.scss

@@ -0,0 +1,13 @@
+:root {
+  --yellow-50: #fefce8;
+  --yellow-100: #fef9c3;
+  --yellow-200: #fef08a;
+  --yellow-300: #fde047;
+  --yellow-400: #facc15;
+  --yellow-500: #eab308;
+  --yellow-600: #ca8a04;
+  --yellow-700: #a16207;
+  --yellow-800: #854d0e;
+  --yellow-900: #713f12;
+  --yellow-950: #422006;
+}

package/dist/scss/colours/primary/_zinc.scss

@@ -0,0 +1,13 @@
+:root {
+  --zinc-50: #fafafa;
+  --zinc-100: #f4f4f5;
+  --zinc-200: #e4e4e7;
+  --zinc-300: #d4d4d8;
+  --zinc-400: #a1a1aa;
+  --zinc-500: #71717a;
+  --zinc-600: #52525b;
+  --zinc-700: #3f3f46;
+  --zinc-800: #27272a;
+  --zinc-900: #18181b;
+  --zinc-950: #09090b;
+}

package/dist/scss/colours/thematic/_grey.scss

@@ -0,0 +1,13 @@
+:root {
+  --grey-50: #f9fafb;
+  --grey-100: #f3f4f6;
+  --grey-200: #e5e7eb;
+  --grey-300: #d1d5db;
+  --grey-400: #9ca3af;
+  --grey-500: #6b7280;
+  --grey-600: #4b5563;
+  --grey-700: #374151;
+  --grey-800: #1f2937;
+  --grey-900: #111827;
+  --grey-950: #030712;
+}

package/dist/scss/colours/thematic/_nord.scss

@@ -1,40 +1,42 @@
-$nord-0: #2E3440;
-$nord-polar-night-0: #2E3440;
-$nord-black: #2E3440;
-$nord-1: #3B4252;
-$nord-polar-night-1: #3B4252;
-$nord-2: #434C5E;
-$nord-polar-night-2: #434C5E;
-$nord-3: #4C566A;
-$nord-polar-night-3: #4C566A;
-$nord-4: #D8DEE9;
-$nord-snow-storm-0: #D8DEE9;
-$nord-5: #E5E9F0;
-$nord-snow-storm-1: #E5E9F0;
-$nord-6: #ECEFF4;
-$nord-snow-storm-2: #ECEFF4;
-$nord-white: #ECEFF4;
-$nord-7: #8FBCBB;
-$nord-frost-0: #8FBCBB;
-$nord-8: #88C0D0;
-$nord-frost-1: #88C0D0;
-$nord-9: #81A1C1;
-$nord-frost-2: #81A1C1;
-$nord-10: #5E81AC;
-$nord-frost-3: #5E81AC;
-$nord-blue: #5E81AC;
-$nord-11: #BF616A;
-$nord-aurora-0: #BF616A;
-$nord-red: #BF616A;
-$nord-12: #D08770;
-$nord-aurora-1: #D08770;
-$nord-orange: #D08770;
-$nord-13: #EBCB8B;
-$nord-aurora-2: #EBCB8B;
-$nord-yellow: #EBCB8B;
-$nord-14: #A3BE8C;
-$nord-aurora-3: #A3BE8C;
-$nord-green: #A3BE8C;
-$nord-15: #B48EAD;
-$nord-aurora-4: #B48EAD;
-$nord-purple: #B48EAD;
+:root {
+  --nord-0: #2e3440;
+  --nord-polar-night-0: #2e3440;
+  --nord-black: #2e3440;
+  --nord-1: #3b4252;
+  --nord-polar-night-1: #3b4252;
+  --nord-2: #434c5e;
+  --nord-polar-night-2: #434c5e;
+  --nord-3: #4c566a;
+  --nord-polar-night-3: #4c566a;
+  --nord-4: #d8dee9;
+  --nord-snow-storm-0: #d8dee9;
+  --nord-5: #e5e9f0;
+  --nord-snow-storm-1: #e5e9f0;
+  --nord-6: #eceff4;
+  --nord-snow-storm-2: #eceff4;
+  --nord-white: #eceff4;
+  --nord-7: #8fbcbb;
+  --nord-frost-0: #8fbcbb;
+  --nord-8: #88c0d0;
+  --nord-frost-1: #88c0d0;
+  --nord-9: #81a1c1;
+  --nord-frost-2: #81a1c1;
+  --nord-10: #5e81ac;
+  --nord-frost-3: #5e81ac;
+  --nord-blue: #5e81ac;
+  --nord-11: #bf616a;
+  --nord-aurora-0: #bf616a;
+  --nord-red: #bf616a;
+  --nord-12: #d08770;
+  --nord-aurora-1: #d08770;
+  --nord-orange: #d08770;
+  --nord-13: #ebcb8b;
+  --nord-aurora-2: #ebcb8b;
+  --nord-yellow: #ebcb8b;
+  --nord-14: #a3be8c;
+  --nord-aurora-3: #a3be8c;
+  --nord-green: #a3be8c;
+  --nord-15: #b48ead;
+  --nord-aurora-4: #b48ead;
+  --nord-purple: #b48ead;
+}

package/dist/scss/colours/thematic/_tr.scss

@@ -1,27 +1,29 @@
 // Brand colours from RCOM's raptor system
 // https://github.com/tr/rcom-arc_raptor-ui/blob/develop/packages/rcom-raptor-ui_atomic/styles/_colors.scss
-$tr-orange: #fa6400;
-$tr-dark-orange: #dc4300;
-$tr-light-orange: #ffa100;
-$tr-dark-grey: #404040;
-$tr-medium-grey: #666666;
-$tr-light-grey: #afafaf;
-$tr-muted-grey: #d0d0d0;
-$tr-contrast-grey: #949494;
-$tr-hover-background-grey: #f8f8f8;
-$tr-light-muted-grey: #f4f4f4;
-$tr-ultra-light-grey: #fafafa;
-$tr-dark-blue: #005da2;
-$tr-light-blue: #0099c4;
-$tr-muted-blue: #4386B9;
-$tr-lighter-blue: #7FACCE;
-$tr-superlight-blue: #e5eef5;
-$tr-dark-purple: #621f95;
-$tr-light-purple: #6e3ab7;
-$tr-dark-red: #a00000;
-$tr-light-red: #dc0a0a;
-$tr-dark-green: #387c2b;
-$tr-light-green: #77a22d;
-$black: #000;
-$white: #fff;
-$ad-placeholder: #ffb1b1;
+:root {
+  --tr-orange: #fa6400;
+  --tr-dark-orange: #dc4300;
+  --tr-light-orange: #ffa100;
+  --tr-dark-grey: #404040;
+  --tr-medium-grey: #666666;
+  --tr-light-grey: #afafaf;
+  --tr-muted-grey: #d0d0d0;
+  --tr-contrast-grey: #949494;
+  --tr-hover-background-grey: #f8f8f8;
+  --tr-light-muted-grey: #f4f4f4;
+  --tr-ultra-light-grey: #fafafa;
+  --tr-dark-blue: #005da2;
+  --tr-light-blue: #0099c4;
+  --tr-muted-blue: #4386b9;
+  --tr-lighter-blue: #7facce;
+  --tr-superlight-blue: #e5eef5;
+  --tr-dark-purple: #621f95;
+  --tr-light-purple: #6e3ab7;
+  --tr-dark-red: #a00000;
+  --tr-light-red: #dc0a0a;
+  --tr-dark-green: #387c2b;
+  --tr-light-green: #77a22d;
+  --tr-black: #000;
+  --tr-white: #fff;
+  --tr-ad-placeholder: #ffb1b1;
+}

package/dist/scss/fonts/_font-faces.scss

@@ -1,129 +1,257 @@
 /* REUTERS KNOWLEDGE */
 @font-face {
   font-family: 'Knowledge';
-  font-style: normal;
-  font-weight: 100;
-  src:
-    local('Knowledge Ultra Light'),
-    local('KnowledgeUltraLight'),
-    url('//graphics.thomsonreuters.com/fonts/KnowledgeUltraLight.woff') format('woff');
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-RegularItalic.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-RegularItalic.woff')
+      format('woff');
+  font-weight: normal;
+  font-style: italic;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Knowledge';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Black.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Black.woff')
+      format('woff');
+  font-weight: 900;
   font-style: normal;
-  font-weight: 300;
-  src:
-    local('Knowledge Light'),
-    local('KnowledgeLight'),
-    url('//graphics.thomsonreuters.com/fonts/KnowledgeLight.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Knowledge';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Light.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Light.woff')
+      format('woff');
+  font-weight: 300;
   font-style: normal;
-  font-weight: 400;
-  src:
-    local('Knowledge Regular'),
-    local('KnowledgeRegular'),
-    url('//graphics.thomsonreuters.com/fonts/KnowledgeRegular.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Knowledge';
-  font-style: italic;
-  font-weight: 400;
-  src:
-    local('Knowledge Regular Italic'),
-    local('KnowledgeRegularItalic'),
-    url('//graphics.thomsonreuters.com/fonts/KnowledgeRegularItalic.woff') format('woff');
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Regular.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Regular.woff')
+      format('woff');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Knowledge';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-UltraLight.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-UltraLight.woff')
+      format('woff');
+  font-weight: 200;
   font-style: normal;
-  font-weight: 500;
-  src:
-    local('Knowledge Medium'),
-    local('KnowledgeMedium'),
-    url('//graphics.thomsonreuters.com/fonts/KnowledgeMedium.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Knowledge';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Bold.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Bold.woff')
+      format('woff');
+  font-weight: bold;
   font-style: normal;
-  font-weight: 700;
-  src:
-    local('Knowledge Bold'),
-    local('KnowledgeBold'),
-    url('//graphics.thomsonreuters.com/fonts/KnowledgeBold.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Knowledge';
-  font-style: italic;
-  font-weight: 700;
-  src:
-    local('Knowledge Bold Italic'),
-    local('KnowledgeBoldItalic'),
-    url('//graphics.thomsonreuters.com/fonts/KnowledgeBoldItalic.woff') format('woff');
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Medium.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/Knowledge2017-Medium.woff')
+      format('woff');
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
 }
 
 /* SOURCE SANS PRO */
 @font-face {
   font-family: 'Source Sans Pro';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Light.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Light.woff')
+      format('woff');
+  font-weight: 300;
   font-style: normal;
-  font-weight: 400;
-  src:
-    local('Source Sans Pro'),
-    local('SourceSansPro-Regular'),
-    url('//graphics.thomsonreuters.com/fonts/SourceSansPro-Regular.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Source Sans Pro';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Italic.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Italic.woff')
+      format('woff');
+  font-weight: normal;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Source Sans Pro';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Bold.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Bold.woff')
+      format('woff');
+  font-weight: bold;
   font-style: normal;
-  font-weight: 600;
-  src:
-    local('Source Sans Pro Semibold'),
-    local('SourceSansPro-Semibold'),
-    url('//graphics.thomsonreuters.com/fonts/SourceSansPro-Semibold.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Source Sans Pro';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-SemiBold.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-SemiBold.woff')
+      format('woff');
+  font-weight: 600;
   font-style: normal;
-  font-weight: 700;
-  src:
-    local('Source Sans Pro Bold'),
-    local('SourceSansPro-Bold'),
-    url('//graphics.thomsonreuters.com/fonts/SourceSansPro-Bold.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Source Sans Pro';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Regular.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/SourceSansPro-Regular.woff')
+      format('woff');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+/* FREIGHT TEXT */
+@font-face {
+  font-family: 'FreightText';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextBold.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextBold.woff')
+      format('woff');
+  font-weight: bold;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'FreightText';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextBook.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextBook.woff')
+      format('woff');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'FreightText';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextBookItalic.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextBookItalic.woff')
+      format('woff');
+  font-weight: normal;
   font-style: italic;
-  font-weight: 400;
-  src:
-    local('Source Sans Pro Italic'),
-    local('SourceSansPro-It'),
-    url('//graphics.thomsonreuters.com/fonts/SourceSansPro-Italic.woff') format('woff');
+  font-display: swap;
 }
 
 @font-face {
-  font-family: 'Source Sans Pro';
+  font-family: 'FreightText';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextLight.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextLight.woff')
+      format('woff');
+  font-weight: 300;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'FreightText';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextMedium.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/FreightTextMedium.woff')
+      format('woff');
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+/* DROID SANS MONO */
+@font-face {
+  font-family: 'Droid Sans Mono';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/DroidSansMono.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/DroidSansMono.woff')
+      format('woff');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+/* NOTO SANS JAPANESE */
+@font-face {
+  font-family: 'Noto Sans JP';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Bold.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Bold.woff')
+      format('woff');
+  font-weight: bold;
   font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Noto Sans JP';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Light.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Light.woff')
+      format('woff');
   font-weight: 300;
-  src:
-    local('Source Sans Pro Light'),
-    local('SourceSansPro-Light'),
-    url('//graphics.thomsonreuters.com/fonts/SourceSansPro-Light.woff') format('woff');
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Noto Sans JP';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-ExtraLight.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-ExtraLight.woff')
+      format('woff');
+  font-weight: 200;
+  font-style: normal;
+  font-display: swap;
 }
 
-/* FREIGHT BOOK */
 @font-face {
-  font-family: 'freight-book';
+  font-family: 'Noto Sans JP';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Medium.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Medium.woff')
+      format('woff');
+  font-weight: 500;
   font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Noto Sans JP';
+  src: url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Regular.woff2')
+      format('woff2'),
+    url('//graphics.thomsonreuters.com/style-assets/fonts/v1/NotoSansJP-Regular.woff')
+      format('woff');
   font-weight: normal;
-  src: url('//graphics.thomsonreuters.com/fonts/freight-book.woff') format('woff');
+  font-style: normal;
+  font-display: swap;
 }

package/dist/scss/main.scss

@@ -1,16 +1,15 @@
-@import 'fonts/font-faces';
-
-// Variables
-@import 'variables';
-
-// Mixins
-@import 'mixins';
-
-// Bootstrap
-@import 'bootstrap/main';
-
-// Styles
-@import 'fonts/rules';
-@import 'typography/rules';
-@import 'typography/main';
-@import 'spacers/rules';
+/**
+ * Styles for svelte components
+ * Custom grid system
+ * Colour and typography systems using CSS variable from Theme
+ * Utility classes for quick styling
+ * Copyright 2023 Reuters Graphics Style Guide
+ */
+
+// Base style rules
+@use 'reset/main' as reset;
+@use 'fonts/font-faces' as font-faces;
+@use 'colours/main' as colours;
+
+// Token classes
+@use 'token-classes' as *;

package/dist/scss/mixins/_main.scss

@@ -0,0 +1 @@
+@forward 'block';

package/dist/scss/reset/_main.scss

@@ -0,0 +1,12 @@
+@import 'normalize.css';
+@import 'typography';
+
+*,
+*:before,
+*:after {
+  box-sizing: border-box;
+}
+
+body {
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}