@snyk-mktg/brand-ui 2.5.9-canary.0 → 2.5.9-canary.2

package/dist/scss/base/_color.scss

@@ -45,18 +45,7 @@ $label-colors: (
 
 .txt-ui-hero {
 	max-width: max-content;
-	@include colors.gradient-mode(
-		background-image,
-		'linear',
-		140deg,
-		RGBA(brandui-rgb-labels(ui-headline), 1),
-		RGBA(brandui-rgb-labels(ui-headline), 0.5),
-		RGBA(brandui-rgb-labels(ui-headline-dark), 1),
-		RGBA(brandui-rgb-labels(ui-headline-dark), 0.7)
-	) {
-		background-clip: text;
-		color: transparent;
-	}
+	@include colors.color-mode(color, brandui-color-labels(ui-headline), brandui-color-labels(ui-headline-dark));
 }
 
 .txt-theme-solid {
@@ -132,10 +121,6 @@ $label-colors: (
 	@include theme.theme-gradient(background, linear, 140deg, gradient-secondary);
 }
 
-.spotlight {
-	@include theme.theme-color(background-color, spotlight);
-}
-
 .bg-gradient-midnight-overlay {
 	height: 130%;
 	background: linear-gradient(

package/dist/scss/base/_layout.scss

@@ -5,6 +5,7 @@
 @use '../base/variables/effects' as *;
 @use '../base/mixins/breakpoints' as breaks;
 @use '../base/mixins/glass' as glass;
+@use '../base/mixins/color-mode' as color;
 @use '../base/functions' as *;
 
 $position-spaces: (none, hairline, thin, slim, extra-small, small, medium, large, extra-large, huge);
@@ -93,17 +94,12 @@ $position-spaces: (none, hairline, thin, slim, extra-small, small, medium, large
 	margin-right: auto;
 }
 
-.brandui-container,
-.content-block {
-	&.bg-boxed {
-		padding: map.get($brandui-padding, extra-large);
-		border-width: 0.1875rem;
-		border-style: solid;
-		border-radius: map.get($brandui-radius, large);
-		box-shadow: map.get($brandui-shadow, outline);
-		@include glass.bg-glass;
-		@include glass.border-glass;
-	}
+.bg-boxed {
+	padding: map.get($brandui-padding, extra-large);
+	border-width: 1px;
+	border-radius: map.get($brandui-radius, small);
+	border-style: solid;
+	@include color.color-mode(border-color, RGBA(brandui-rgb-labels(neutral-1), 0.3), RGBA(brandui-rgb-labels(neutral-6), 0.3));
 }
 
 .brandui-backdrop {

package/dist/scss/base/decorations/_markers.scss

@@ -3,6 +3,8 @@
 @use '../../base/mixins/color-mode' as colors;
 @use '../../base/functions' as *;
 
+// TODO, remove once we have confirmed that new brand is real
+
 /**
 * Note >> The markers are all PNGs that use the Cloudinary transformations
 * to add the proper color-mode color and then convert to SVG. This is the
@@ -10,30 +12,30 @@
 * See the Transformation Center in Cloudinary for the custom marker
 * transformations.
 */
-@each $marker-key, $marker-url in $brandui-marker-highlight-styles {
-	.marker-highlight-#{$marker-key} {
-		color: inherit;
-		background-color: transparent;
-		position: relative;
-		display: inline;
-		// Adds a little space around the text relative to the font size
-		padding: 0.1em 0.3em;
-		background-position: 100%;
-		background-size: 100% 100%;
-		background-repeat: no-repeat;
-		@include colors.color-mode(background-image, url('#{$brandui-marker-light}#{$marker-url}'), url('#{$brandui-marker-dark}#{$marker-url}'));
-	}
-}
+// @each $marker-key, $marker-url in $brandui-marker-highlight-styles {
+// 	.marker-highlight-#{$marker-key} {
+// 		color: inherit;
+// 		background-color: transparent;
+// 		position: relative;
+// 		display: inline;
+// 		// Adds a little space around the text relative to the font size
+// 		padding: 0.1em 0.3em;
+// 		background-position: 100%;
+// 		background-size: 100% 100%;
+// 		background-repeat: no-repeat;
+// 		@include colors.color-mode(background-image, url('#{$brandui-marker-light}#{$marker-url}'), url('#{$brandui-marker-dark}#{$marker-url}'));
+// 	}
+// }
 
-@each $marker-key, $marker-url in $brandui-marker-line-styles {
-	.marker-line-#{$marker-key} {
-		max-width: brandui-col-spacing(2);
-		width: 100%;
-		height: 3rem;
-		position: relative;
-		display: block;
-		background-size: 100%;
-		background-repeat: no-repeat;
-		@include colors.color-mode(background-image, url('#{$brandui-marker-light}#{$marker-url}'), url('#{$brandui-marker-dark}#{$marker-url}'));
-	}
-}
+// @each $marker-key, $marker-url in $brandui-marker-line-styles {
+// 	.marker-line-#{$marker-key} {
+// 		max-width: brandui-col-spacing(2);
+// 		width: 100%;
+// 		height: 3rem;
+// 		position: relative;
+// 		display: block;
+// 		background-size: 100%;
+// 		background-repeat: no-repeat;
+// 		@include colors.color-mode(background-image, url('#{$brandui-marker-light}#{$marker-url}'), url('#{$brandui-marker-dark}#{$marker-url}'));
+// 	}
+// }

package/dist/scss/base/mixins/_accessibility.scss

@@ -3,3 +3,9 @@
 		@content;
 	}
 }
+
+@mixin prefers-dark {
+	@media (prefers-color-scheme: dark) {
+		@content;
+	}
+}

package/dist/scss/base/mixins/_color-mode.scss

@@ -1,3 +1,4 @@
+@use './accessibility' as a11y;
 /* Mixins for light/dark modes */
 @mixin color-mode($property, $light-value, $dark-value) {
 	// Default light mode
@@ -11,6 +12,12 @@
 		#{$property}: $dark-value;
 		@content;
 	}
+
+	// Uncomment this when we are ready to offer dark mode toggle support
+	// @include a11y.prefers-dark {
+	// 	#{$property}: $dark-value;
+	// 	@content;
+	// }
 }
 
 // Because mixins can sometime be invalid when chaining to pseudo-classes, we need to manually do this

package/dist/scss/base/variables/_colors.scss

@@ -31,14 +31,15 @@ $evoui-colors: (
 /* Color variables */
 $brandui-colors: (
 	'dark-purple': #441c99,
-	'purple': #9043c6,
+	'purple': #8d1ff4,
 	'lavender': #c481f3,
 	'black': #000,
 	'space': #01011e,
 	'midnight': #030328,
 	'ocean': #181846,
+	'dark-grey': #202020,
 	'dawn': #383f76,
-	'steel': #555463,
+	'steel': #c0bce5,
 	'smoke': #6d6d9c,
 	'snow': #f6f7fb,
 	'white': #fff,
@@ -73,49 +74,53 @@ $brandui-colors: map.merge($brandui-colors, $custom-theme);
 
 // 2.0 Standardized color labels for theming
 $brandui-color-labels: (
-	'default': map.get($brandui-colors, 'white'),
-	'default-dark': map.get($brandui-colors, 'midnight'),
-	'ui-headline': map.get($brandui-colors, 'midnight'),
-	'ui-headline-dark': map.get($brandui-colors, 'white'),
-	'ui-body': map.get($brandui-colors, 'dawn'),
+	'default': map.get($brandui-colors, 'snow'),
+	'default-dark': map.get($brandui-colors, 'black'),
+	'ui-headline': map.get($brandui-colors, 'black'),
+	'ui-headline-dark': map.get($brandui-colors, 'snow'),
+	'ui-body': map.get($brandui-colors, 'black'),
 	'ui-body-dark': map.get($brandui-colors, 'snow'),
-	'ui-fill': map.get($brandui-colors, 'white'),
-	'ui-fill-dark': map.get($brandui-colors, 'midnight'),
-	'ui-stroke': map.get($brandui-colors, 'smoke'),
-	'ui-stroke-dark': map.get($brandui-colors, 'dawn'),
-	'ui-text': map.get($brandui-colors, 'dawn'),
+	'ui-fill': map.get($brandui-colors, 'steel'),
+	'ui-fill-dark': map.get($brandui-colors, 'dark-grey'),
+	'ui-stroke': map.get($brandui-colors, 'snow'),
+	'ui-stroke-dark': map.get($brandui-colors, 'black'),
+	'ui-text': map.get($brandui-colors, 'black'),
 	'ui-text-dark': map.get($brandui-colors, 'snow'),
-	'action': map.get($brandui-colors, 'electric-blue'),
-	'action-dark': map.get($brandui-colors, 'periwinkle'),
-	'action-outline': map.get($brandui-colors, 'sky'),
-	'action-contrast': map.get($brandui-colors, 'white'),
-	'action-contrast-dark': map.get($brandui-colors, 'midnight'),
-	'action-secondary': map.get($brandui-colors, 'deep-sea'),
-	'action-secondary-dark': map.get($brandui-colors, 'electric-blue-dark'),
-	'action-secondary-contrast': map.get($brandui-colors, 'white'),
-	'action-secondary-contrast-dark': map.get($brandui-colors, 'midnight'),
+	'action': map.get($brandui-colors, 'black'),
+	'action-dark': map.get($brandui-colors, 'snow'),
+	'action-outline': map.get($brandui-colors, 'snow'),
+	'action-contrast': map.get($brandui-colors, 'snow'),
+	'action-contrast-dark': map.get($brandui-colors, 'black'),
+	'action-secondary': map.get($brandui-colors, 'snow'),
+	'action-secondary-dark': map.get($brandui-colors, 'black'),
+	'action-secondary-contrast': map.get($brandui-colors, 'black'),
+	'action-secondary-contrast-dark': map.get($brandui-colors, 'snow'),
+	'action-tertiary': map.get($brandui-colors, 'purple'),
+	'action-tertiary-dark': map.get($brandui-colors, 'lavender'),
+	'action-tertiary-contrast': map.get($brandui-colors, 'black'),
+	'action-tertiary-contrast-dark': map.get($brandui-colors, 'black'),
 	'info': map.get($brandui-colors, 'dark-purple'),
 	'info-dark': map.get($brandui-colors, 'lavender'),
-	'info-contrast': map.get($brandui-colors, 'white'),
+	'info-contrast': map.get($brandui-colors, 'snow'),
 	'info-contrast-dark': map.get($brandui-colors, 'midnight'),
 	'success': map.get($brandui-colors, 'dark-teal'),
 	'success-dark': map.get($brandui-colors, 'vibe'),
-	'success-contrast': map.get($brandui-colors, 'white'),
+	'success-contrast': map.get($brandui-colors, 'snow'),
 	'success-contrast-dark': map.get($brandui-colors, 'midnight'),
 	'warning': map.get($brandui-colors, 'autumn'),
 	'warning-dark': map.get($brandui-colors, 'tiger'),
-	'warning-contrast': map.get($brandui-colors, 'white'),
+	'warning-contrast': map.get($brandui-colors, 'snow'),
 	'warning-contrast-dark': map.get($brandui-colors, 'midnight'),
 	'fail': map.get($brandui-colors, 'rose'),
 	'fail-dark': map.get($brandui-colors, 'salmon'),
-	'fail-contrast': map.get($brandui-colors, 'white'),
+	'fail-contrast': map.get($brandui-colors, 'snow'),
 	'fail-contrast-dark': map.get($brandui-colors, 'midnight'),
-	'neutral-1': map.get($brandui-colors, 'midnight'),
-	'neutral-2': map.get($brandui-colors, 'ocean'),
-	'neutral-3': map.get($brandui-colors, 'dawn'),
+	'neutral-1': map.get($brandui-colors, 'black'),
+	'neutral-2': map.get($brandui-colors, 'black'),
+	'neutral-3': map.get($brandui-colors, 'black'),
 	'neutral-4': map.get($brandui-colors, 'smoke'),
 	'neutral-5': map.get($brandui-colors, 'snow'),
-	'neutral-6': map.get($brandui-colors, 'white'),
+	'neutral-6': map.get($brandui-colors, 'snow'),
 ) !default;
 
 $brandui-tag-colors: (

package/dist/scss/base/variables/_themes.scss

@@ -14,35 +14,35 @@
 $brandui-default-themes: (
 	default: (
 		light: (
-			text-solid: map.get($brandui-colors, 'dark-purple'),
+			text-solid: map.get($brandui-colors, 'black'),
 			// deprecate
 			solid: map.get($brandui-colors, 'dark-purple'),
 			solid-primary: map.get($brandui-colors, 'purple'),
 			solid-secondary: map.get($brandui-colors, 'dark-purple'),
 			solid-tertiary: map.get($brandui-colors, 'dark-purple'),
-			contrast: map.get($brandui-colors, 'white'),
+			contrast: map.get($brandui-colors, 'snow'),
 			base: map.get($brandui-base-colors, 'dark-purple'),
 			spotlight: map.get($brandui-base-colors, 'dark-purple'),
 			highlight: map.get($brandui-colors, 'bubblegum'),
 			text-gradient: (
-				start: map.get($brandui-colors, 'electric-blue'),
-				end: map.get($brandui-colors, 'midnight'),
+				start: map.get($brandui-colors, 'black'),
+				end: map.get($brandui-colors, 'black'),
 			),
 			gradient-primary: (
 				start: map.get($brandui-colors, 'hot-pink'),
 				end: map.get($brandui-colors, 'hot-pink'),
 			),
 			gradient-secondary: (
-				start: map.get($brandui-colors, 'electric-blue'),
-				end: map.get($brandui-colors, 'electric-blue'),
+				start: map.get($brandui-colors, 'black'),
+				end: map.get($brandui-colors, 'black'),
 			),
 			gradient-tertiary: (
-				start: map.get($brandui-colors, 'electric-blue'),
-				end: map.get($brandui-colors, 'electric-blue'),
+				start: map.get($brandui-colors, 'black'),
+				end: map.get($brandui-colors, 'black'),
 			),
 		),
 		dark: (
-			text-solid: map.get($brandui-colors, 'periwinkle'),
+			text-solid: map.get($brandui-colors, 'snow'),
 			// deprecate
 			solid: map.get($brandui-colors, 'sky'),
 			solid-primary: map.get($brandui-colors, 'bubblegum'),
@@ -53,20 +53,20 @@ $brandui-default-themes: (
 			spotlight: map.get($brandui-colors, 'dark-purple'),
 			highlight: map.get($brandui-colors, 'hot-pink'),
 			text-gradient: (
-				start: map.get($brandui-colors, 'periwinkle'),
-				end: map.get($brandui-colors, 'white'),
+				start: map.get($brandui-colors, 'snow'),
+				end: map.get($brandui-colors, 'snow'),
 			),
 			gradient-primary: (
-				start: map.get($brandui-colors, 'hot-pink'),
-				end: map.get($brandui-colors, 'dark-purple'),
+				start: map.get($brandui-colors, 'snow'),
+				end: map.get($brandui-colors, 'snow'),
 			),
 			gradient-secondary: (
-				start: map.get($brandui-colors, 'electric-blue'),
-				end: map.get($brandui-colors, 'periwinkle'),
+				start: map.get($brandui-colors, 'snow'),
+				end: map.get($brandui-colors, 'snow'),
 			),
 			gradient-tertiary: (
-				start: map.get($brandui-colors, 'purple'),
-				end: map.get($brandui-colors, 'bubblegum'),
+				start: map.get($brandui-colors, 'snow'),
+				end: map.get($brandui-colors, 'snow'),
 			),
 		),
 	),

package/dist/scss/base/variables/_typography.scss

@@ -7,11 +7,11 @@
 
 /* Typography variables */
 $brandui-font-size: (
-	hero-title-large: 5.625rem,
-	hero-title-small: 3.125rem,
-	page-title-large: 4.375rem,
-	page-title: 3rem,
-	section-title: 3rem,
+	hero-title-large: 3.625rem,
+	hero-title-small: 2.125rem,
+	page-title-large: 2.375rem,
+	page-title: 2rem,
+	section-title: 2rem,
 	headline-large: 2.5rem,
 	headline-small: 2rem,
 	subhead: 1.5rem,
@@ -29,11 +29,11 @@ $brandui-font-size: (
 ) !default;
 
 $brandui-line-height: (
-	hero-title-large: 6.25rem,
-	hero-title-small: 3.75rem,
-	page-title-large: 5rem,
-	page-title: 4rem,
-	section-title: 4rem,
+	hero-title-large: 4rem,
+	hero-title-small: 2.125rem,
+	page-title-large: 2.75rem,
+	page-title: 2.5rem,
+	section-title: 2.5rem,
 	headline-large: 3rem,
 	headline-small: 2.5rem,
 	subhead: 2.25rem,
@@ -56,54 +56,51 @@ $brandui-font-family: (
 	space-grotesk: 'Space Grotesk',
 	roboto: 'Roboto',
 	roboto-mono: 'Roboto Mono',
+	geist: 'Geist',
+	geist-mono: 'Geist Mono',
 ) !default;
 
 $text-elements: (
 	'hero-title-large': (
-		'weight': 900,
-		'family': map.get($brandui-font-family, big-shoulders),
+		'weight': 700,
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
-		'text-transform': uppercase,
 	),
 	'hero-title-small': (
-		'weight': 900,
-		'family': map.get($brandui-font-family, big-shoulders),
+		'weight': 700,
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
-		'text-transform': uppercase,
 	),
 	'page-title-large': (
-		'weight': 900,
+		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, big-shoulders),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		// 'text-transform': none,
-		'text-transform': uppercase,
 	),
 	'page-title': (
-		'weight': 900,
+		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, big-shoulders),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		// 'text-transform': none,
-		'text-transform': uppercase,
 	),
 	'section-title': (
-		'weight': 900,
+		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, big-shoulders),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		// 'text-transform': none,
-		'text-transform': uppercase,
 	),
 	'headline-large': (
 		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		'text-transform': none,
@@ -111,7 +108,7 @@ $text-elements: (
 	'headline-small': (
 		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		'text-transform': none,
@@ -120,7 +117,7 @@ $text-elements: (
 		// 'weight': 600,
 		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		'text-transform': none,
@@ -129,7 +126,7 @@ $text-elements: (
 		// 'weight': 600,
 		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		'text-transform': none,
@@ -138,7 +135,7 @@ $text-elements: (
 		// 'weight': 600,
 		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist-mono),
 		'type': sans-serif,
 		'letter-spacing': 0.12em,
 		'text-transform': uppercase,
@@ -147,7 +144,7 @@ $text-elements: (
 		// 'weight': 600,
 		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist-mono),
 		'type': sans-serif,
 		'letter-spacing': 0.12em,
 		'text-transform': uppercase,
@@ -155,7 +152,7 @@ $text-elements: (
 	'body-lead': (
 		'weight': 500,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': 0.01em,
 		'text-transform': none,
@@ -163,49 +160,49 @@ $text-elements: (
 	'body-lead-bold': (
 		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
-		'family': map.get($brandui-font-family, space-grotesk),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': 0.01em,
 		'text-transform': none,
 	),
 	'body': (
 		'weight': 400,
-		'family': map.get($brandui-font-family, roboto),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': 0,
 		'text-transform': none,
 	),
 	'body-bold': (
 		'weight': 600,
-		'family': map.get($brandui-font-family, roboto),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': 0.005em,
 		'text-transform': none,
 	),
 	'body-long': (
 		'weight': 400,
-		'family': map.get($brandui-font-family, roboto),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': 0.01em,
 		'text-transform': none,
 	),
 	'body-small': (
 		'weight': 400,
-		'family': map.get($brandui-font-family, roboto),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': 0,
 		'text-transform': none,
 	),
 	'body-small-medium': (
 		'weight': 500,
-		'family': map.get($brandui-font-family, roboto),
+		'family': map.get($brandui-font-family, geist),
 		'type': sans-serif,
 		'letter-spacing': 0,
 		'text-transform': none,
 	),
 	'code': (
 		'weight': 400,
-		'family': map.get($brandui-font-family, roboto-mono),
+		'family': map.get($brandui-font-family, geist-mono),
 		'type': monospace,
 		'letter-spacing': 0,
 		'text-transform': none,
@@ -215,45 +212,40 @@ $text-elements: (
 $text-elements-responsive: (
 	'hero-title-large': (
 		'target': 'hero-title-small',
-		'weight': 900,
+		'weight': 700,
 		'family': map.get($brandui-font-family, big-shoulders),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
-		'text-transform': uppercase,
 	),
 	'hero-title-small': (
 		'target': 'hero-title-small',
-		'weight': 900,
+		'weight': 700,
 		'family': map.get($brandui-font-family, big-shoulders),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
-		'text-transform': uppercase,
 	),
 	'page-title-large': (
 		'target': 'hero-title-small',
-		'weight': 900,
+		'weight': 700,
 		// 'family': map.get($brandui-font-family, poppins),
 		'family': map.get($brandui-font-family, big-shoulders),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
 		// 'text-transform': none,
-		'text-transform': uppercase,
 	),
 	'page-title': (
 		'target': 'hero-title-small',
-		'weight': 900,
+		'weight': 700,
 		'family': map.get($brandui-font-family, big-shoulders),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
-		'text-transform': uppercase,
 	),
 	'section-title': (
 		'target': 'hero-title-small',
-		'weight': 900,
+		'weight': 700,
 		'family': map.get($brandui-font-family, big-shoulders),
 		'type': sans-serif,
 		'letter-spacing': -0.01em,
-		'text-transform': uppercase,
 	),
 	'headline-large': (
 		'target': 'headline-small',

package/dist/scss/base.scss

@@ -11,8 +11,10 @@
 @use '../scss/base/spacing' as *;
 @use '../scss/base/sizing' as *;
 @use '../scss/base/decorations/decorations' as *;
-@use '../scss/base/decorations/backgrounds' as *;
-@use '../scss/base/decorations/glows' as *;
+
+// Note, we want to keep these files around as they are in use for Evo and labs. However, we are probably done with them on the main theme
+// @use '../scss/base/decorations/backgrounds' as *;
+// @use '../scss/base/decorations/glows' as *;
 @use '../scss/base/decorations/flourishes' as *;
 @use '../scss/base/decorations/markers' as *;
 @use '../scss/base/decorations/separators' as *;

package/dist/scss/components/atoms/_badge.scss

@@ -2,7 +2,7 @@
 @use '../../base/mixins/page-theme' as theme;
 
 .badge {
-	@extend .marker-highlight-short-2;
+	// @extend .marker-highlight-short-2;
 	width: max-content;
 	height: max-content;
 	padding: 0.125rem 0.25rem 0.125rem 0.4rem;