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

package/dist/scss/tokens/spacers/_margin.scss

@@ -0,0 +1,109 @@
+$margin-levels: (
+  '0': 0,
+  '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 {
+  .m-#{$level} {
+    margin: $value;
+  }
+  .mt-#{$level} {
+    margin-top: $value;
+  }
+  .mr-#{$level} {
+    margin-right: $value;
+  }
+  .mb-#{$level} {
+    margin-bottom: $value;
+  }
+  .ml-#{$level} {
+    margin-left: $value;
+  }
+  .mx-#{$level} {
+    margin-right: $value;
+    margin-left: $value;
+  }
+  .my-#{$level} {
+    margin-top: $value;
+    margin-bottom: $value;
+  }
+
+  .\!m-#{$level} {
+    margin: $value !important;
+  }
+  .\!mt-#{$level} {
+    margin-top: $value !important;
+  }
+  .\!mr-#{$level} {
+    margin-right: $value !important;
+  }
+  .\!mb-#{$level} {
+    margin-bottom: $value !important;
+  }
+  .\!ml-#{$level} {
+    margin-left: $value !important;
+  }
+  .\!mx-#{$level} {
+    margin-right: $value !important;
+    margin-left: $value !important;
+  }
+  .\!my-#{$level} {
+    margin-top: $value !important;
+    margin-bottom: $value !important;
+  }
+}
+
+.m-auto {
+  margin: auto;
+}
+.mx-auto {
+  margin-right: auto;
+  margin-left: auto;
+}
+.my-auto {
+  margin-top: auto;
+  margin-bottom: auto;
+}
+.\!m-auto {
+  margin: auto !important;
+}
+.\!mx-auto {
+  margin-right: auto !important;
+  margin-left: auto !important;
+}
+.\!my-auto {
+  margin-top: auto !important;
+  margin-bottom: auto !important;
+}

package/dist/scss/tokens/spacers/_padding.scss

@@ -0,0 +1,86 @@
+$padding-levels: (
+  '0': 0,
+  '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 {
+  .p-#{$level} {
+    padding: $value;
+  }
+  .pt-#{$level} {
+    padding-top: $value;
+  }
+  .pr-#{$level} {
+    padding-right: $value;
+  }
+  .pb-#{$level} {
+    padding-bottom: $value;
+  }
+  .pl-#{$level} {
+    padding-left: $value;
+  }
+  .px-#{$level} {
+    padding-right: $value;
+    padding-left: $value;
+  }
+  .py-#{$level} {
+    padding-top: $value;
+    padding-bottom: $value;
+  }
+
+  .\!p-#{$level} {
+    padding: $value !important;
+  }
+  .\!pt-#{$level} {
+    padding-top: $value !important;
+  }
+  .\!pr-#{$level} {
+    padding-right: $value !important;
+  }
+  .\!pb-#{$level} {
+    padding-bottom: $value !important;
+  }
+  .\!pl-#{$level} {
+    padding-left: $value !important;
+  }
+  .\!px-#{$level} {
+    padding-right: $value !important;
+    padding-left: $value !important;
+  }
+  .\!py-#{$level} {
+    padding-top: $value !important;
+    padding-bottom: $value !important;
+  }
+}

package/dist/scss/tokens/spacers/mixins/_fluid-margin.scss

@@ -0,0 +1,85 @@
+$fluid-margin-levels: (
+  '0': 0,
+  '1': clamp(0.31rem, calc(0.31rem + 0vw), 0.31rem),
+  '2': clamp(0.56rem, calc(0.52rem + 0.21vw), 0.69rem),
+  '3': clamp(0.88rem, calc(0.83rem + 0.21vw), 1rem),
+  '4': clamp(1.13rem, calc(1.06rem + 0.31vw), 1.31rem),
+  '5': clamp(1.69rem, calc(1.58rem + 0.52vw), 2rem),
+  '6': clamp(2.25rem, calc(2.13rem + 0.63vw), 2.63rem),
+  '7': clamp(3.38rem, calc(3.19rem + 0.94vw), 3.94rem),
+  '8': clamp(4.5rem, calc(4.25rem + 1.25vw), 5.25rem),
+  '9': clamp(6.75rem, calc(6.38rem + 1.88vw), 7.88rem),
+);
+
+@each $level, $value in $fluid-margin-levels {
+  %fm-#{$level} {
+    margin: $value;
+  }
+  %fmt-#{$level} {
+    margin-top: $value;
+  }
+  %fmr-#{$level} {
+    margin-right: $value;
+  }
+  %fmb-#{$level} {
+    margin-bottom: $value;
+  }
+  %fml-#{$level} {
+    margin-left: $value;
+  }
+  %fmx-#{$level} {
+    margin-right: $value;
+    margin-left: $value;
+  }
+  %fmy-#{$level} {
+    margin-top: $value;
+    margin-bottom: $value;
+  }
+
+  %\!fm-#{$level} {
+    margin: $value !important;
+  }
+  %\!fmt-#{$level} {
+    margin-top: $value !important;
+  }
+  %\!fmr-#{$level} {
+    margin-right: $value !important;
+  }
+  %\!fmb-#{$level} {
+    margin-bottom: $value !important;
+  }
+  %\!fml-#{$level} {
+    margin-left: $value !important;
+  }
+  %\!fmx-#{$level} {
+    margin-right: $value !important;
+    margin-left: $value !important;
+  }
+  %\!fmy-#{$level} {
+    margin-top: $value !important;
+    margin-bottom: $value !important;
+  }
+}
+
+%fm-auto {
+  margin: auto;
+}
+%fmx-auto {
+  margin-right: auto;
+  margin-left: auto;
+}
+%fmy-auto {
+  margin-top: auto;
+  margin-bottom: auto;
+}
+%\!fm-auto {
+  margin: auto !important;
+}
+%\!fmx-auto {
+  margin-right: auto !important;
+  margin-left: auto !important;
+}
+%\!fmy-auto {
+  margin-top: auto !important;
+  margin-bottom: auto !important;
+}

package/dist/scss/tokens/spacers/mixins/_fluid-padding.scss

@@ -0,0 +1,85 @@
+$fluid-padding-levels: (
+  '0': 0,
+  '1': clamp(0.31rem, calc(0.31rem + 0vw), 0.31rem),
+  '2': clamp(0.56rem, calc(0.52rem + 0.21vw), 0.69rem),
+  '3': clamp(0.88rem, calc(0.83rem + 0.21vw), 1rem),
+  '4': clamp(1.13rem, calc(1.06rem + 0.31vw), 1.31rem),
+  '5': clamp(1.69rem, calc(1.58rem + 0.52vw), 2rem),
+  '6': clamp(2.25rem, calc(2.13rem + 0.63vw), 2.63rem),
+  '7': clamp(3.38rem, calc(3.19rem + 0.94vw), 3.94rem),
+  '8': clamp(4.5rem, calc(4.25rem + 1.25vw), 5.25rem),
+  '9': clamp(6.75rem, calc(6.38rem + 1.88vw), 7.88rem),
+);
+
+@each $level, $value in $fluid-padding-levels {
+  %fp-#{$level} {
+    padding: $value;
+  }
+  %fpt-#{$level} {
+    padding-top: $value;
+  }
+  %fpr-#{$level} {
+    padding-right: $value;
+  }
+  %fpb-#{$level} {
+    padding-bottom: $value;
+  }
+  %fpl-#{$level} {
+    padding-left: $value;
+  }
+  %fpx-#{$level} {
+    padding-right: $value;
+    padding-left: $value;
+  }
+  %fpy-#{$level} {
+    padding-top: $value;
+    padding-bottom: $value;
+  }
+
+  %\!fp-#{$level} {
+    padding: $value !important;
+  }
+  %\!fpt-#{$level} {
+    padding-top: $value !important;
+  }
+  %\!fpr-#{$level} {
+    padding-right: $value !important;
+  }
+  %\!fpb-#{$level} {
+    padding-bottom: $value !important;
+  }
+  %\!fpl-#{$level} {
+    padding-left: $value !important;
+  }
+  %\!fpx-#{$level} {
+    padding-right: $value !important;
+    padding-left: $value !important;
+  }
+  %\!fpy-#{$level} {
+    padding-top: $value !important;
+    padding-bottom: $value !important;
+  }
+}
+
+%fp-auto {
+  padding: auto;
+}
+%fpx-auto {
+  padding-right: auto;
+  padding-left: auto;
+}
+%fpy-auto {
+  padding-top: auto;
+  padding-bottom: auto;
+}
+%\!fp-auto {
+  padding: auto !important;
+}
+%\!fpx-auto {
+  padding-right: auto !important;
+  padding-left: auto !important;
+}
+%\!fpy-auto {
+  padding-top: auto !important;
+  padding-bottom: auto !important;
+}

package/dist/scss/tokens/spacers/mixins/_main.scss

@@ -0,0 +1,2 @@
+@forward 'fluid-margin';
+@forward 'fluid-padding';

package/dist/scss/tokens/text/_color.scss

@@ -0,0 +1,20 @@
+@use 'mixins/color' as *;
+
+.text-primary {
+  @include text-primary;
+}
+.text-secondary {
+  @include text-secondary;
+}
+.text-accent {
+  @include text-accent;
+}
+.\!text-primary {
+  @include \!text-primary;
+}
+.\!text-secondary {
+  @include \!text-secondary;
+}
+.\!text-accent {
+  @include \!text-accent;
+}

package/dist/scss/tokens/text/_font-family.scss

@@ -0,0 +1,68 @@
+@use 'mixins/font-family' as *;
+
+.font-serif {
+  @include font-serif;
+}
+.font-sans {
+  @include font-sans;
+}
+.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-source-sans-pro {
+  @include font-source-sans-pro;
+}
+.font-knowledge {
+  @include font-knowledge;
+}
+.font-freight-text {
+  @include font-freight-text;
+}
+.font-noto-sans-jp {
+  @include font-noto-sans-jp;
+}
+.\!font-serif {
+  @include \!font-serif;
+}
+.\!font-sans {
+  @include \!font-sans;
+}
+.\!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-source-sans-pro {
+  @include \!font-source-sans-pro;
+}
+.\!font-knowledge {
+  @include \!font-knowledge;
+}
+.\!font-freight-text {
+  @include \!font-freight-text;
+}
+.\!font-noto-sans-jp {
+  @include \!font-noto-sans-jp;
+}

package/dist/scss/tokens/text/_font-size.scss

@@ -0,0 +1,68 @@
+@use 'mixins/font-size' as *;
+
+.text-xxs {
+  @include text-xxs;
+}
+.text-xs {
+  @include text-xs;
+}
+.text-sm {
+  @include text-sm;
+}
+.text-base {
+  @include text-base;
+}
+.text-lg {
+  @include text-lg;
+}
+.text-xl {
+  @include text-xl;
+}
+.text-2xl {
+  @include text-2xl;
+}
+.text-3xl {
+  @include text-3xl;
+}
+.text-4xl {
+  @include text-4xl;
+}
+.text-5xl {
+  @include text-5xl;
+}
+.text-6xl {
+  @include text-6xl;
+}
+.\!text-xxs {
+  @include \!text-xxs;
+}
+.\!text-xs {
+  @include \!text-xs;
+}
+.\!text-sm {
+  @include \!text-sm;
+}
+.\!text-base {
+  @include \!text-base;
+}
+.\!text-lg {
+  @include \!text-lg;
+}
+.\!text-xl {
+  @include \!text-xl;
+}
+.\!text-2xl {
+  @include \!text-2xl;
+}
+.\!text-3xl {
+  @include \!text-3xl;
+}
+.\!text-4xl {
+  @include \!text-4xl;
+}
+.\!text-5xl {
+  @include \!text-5xl;
+}
+.\!text-6xl {
+  @include \!text-6xl;
+}

package/dist/scss/tokens/text/_font-style.scss

@@ -0,0 +1,12 @@
+.italic {
+  font-style: italic;
+}
+.not-italic {
+  font-style: normal;
+}
+.\!italic {
+  font-style: italic !important;
+}
+.\!not-italic {
+  font-style: normal !important;
+}

package/dist/scss/tokens/text/_font-weight.scss

@@ -0,0 +1,56 @@
+@use 'mixins/font-weight' as *;
+
+.font-thin {
+  @include font-thin;
+}
+.font-extralight {
+  @include font-extralight;
+}
+.font-light {
+  @include font-light;
+}
+.font-normal {
+  @include font-normal;
+}
+.font-medium {
+  @include font-medium;
+}
+.font-semibold {
+  @include font-semibold;
+}
+.font-bold {
+  @include font-bold;
+}
+.font-extrabold {
+  @include font-extrabold;
+}
+.font-black {
+  @include font-black;
+}
+.\!font-thin {
+  @include \!font-thin;
+}
+.\!font-extralight {
+  @include \!font-extralight;
+}
+.\!font-light {
+  @include \!font-light;
+}
+.\!font-normal {
+  @include \!font-normal;
+}
+.\!font-medium {
+  @include \!font-medium;
+}
+.\!font-semibold {
+  @include \!font-semibold;
+}
+.\!font-bold {
+  @include \!font-bold;
+}
+.\!font-extrabold {
+  @include \!font-extrabold;
+}
+.\!font-black {
+  @include \!font-black;
+}

package/dist/scss/tokens/text/_letter-spacing.scss

@@ -0,0 +1,38 @@
+@use 'mixins/letter-spacing' as *;
+
+.tracking-tighter {
+  @include tracking-tighter;
+}
+.tracking-tight {
+  @include tracking-tight;
+}
+.tracking-normal {
+  @include tracking-normal;
+}
+.tracking-wide {
+  @include tracking-wide;
+}
+.tracking-wider {
+  @include tracking-wider;
+}
+.tracking-widest {
+  @include tracking-widest;
+}
+.\!tracking-tighter {
+  @include \!tracking-tighter;
+}
+.\!tracking-tight {
+  @include \!tracking-tight;
+}
+.\!tracking-normal {
+  @include \!tracking-normal;
+}
+.\!tracking-wide {
+  @include \!tracking-wide;
+}
+.\!tracking-wider {
+  @include \!tracking-wider;
+}
+.\!tracking-widest {
+  @include \!tracking-widest;
+}

package/dist/scss/tokens/text/_line-height.scss

@@ -0,0 +1,38 @@
+@use 'mixins/line-height' as *;
+
+.leading-none {
+  @include leading-none;
+}
+.leading-tighter {
+  @include leading-tighter;
+}
+.leading-tight {
+  @include leading-tight;
+}
+.leading-normal {
+  @include leading-normal;
+}
+.leading-loose {
+  @include leading-loose;
+}
+.leading-looser {
+  @include leading-looser;
+}
+.\!leading-none {
+  @include \!leading-none;
+}
+.\!leading-tighter {
+  @include \!leading-tighter;
+}
+.\!leading-tight {
+  @include \!leading-tight;
+}
+.\!leading-normal {
+  @include \!leading-normal;
+}
+.\!leading-loose {
+  @include \!leading-loose;
+}
+.\!leading-looser {
+  @include \!leading-looser;
+}

package/dist/scss/tokens/text/_main.scss

@@ -0,0 +1,14 @@
+@forward 'color';
+@forward 'font-family';
+@forward 'font-size';
+@forward 'font-style';
+@forward 'font-weight';
+@forward 'letter-spacing';
+@forward 'line-height';
+@forward 'text-align';
+@forward 'text-decoration';
+@forward 'text-stroke';
+@forward 'text-transform';
+@forward 'vertical-align';
+@forward 'white-space';
+@forward 'word-break';