feat: adjust menu sub item spacing

src/components/accordion/accordion.scss

@@ -33,7 +33,6 @@
 }
 
 .accordion-item__toggle {
-
   & {
     background: none;
     border: none;
@@ -66,7 +65,6 @@
 }
 
 .button.accordion__toggle-all {
-
   & {
     display: flex;
     gap: var(--spacing-lg);
@@ -164,7 +162,7 @@
     color: var(--accordion-color-header);
   }
 
-  &:hover{
+  &:hover {
     color: var(--accordion-color-header-hover);
 
     .accordion-item__icon {

src/components/image/image.yml

@@ -30,4 +30,4 @@ responsive_images:
     image__src: 'https://picsum.photos/320/240'
     image__alt: 'A 4 by 3 image'
 image__caption: 'This is a sample caption associated with the figure.'
-image__copyright: 'Photo taken by John Doe'
+image__copyright: 'Photo taken by John Doe'

src/components/navigation/breadcrumbs/breadcrumbs.scss

@@ -20,7 +20,7 @@
 
 @mixin breadcrumb-spacer {
   &:not(:last-child)::after {
-    content: "/";
+    content: '/';
     margin-left: var(--spacing-md);
   }
 }

src/components/navigation/main/_main-link.scss

@@ -80,7 +80,7 @@
   white-space: nowrap;
   width: auto;
   margin: 0;
-  padding: var(--spacing-sm) var(--spacing-lg);
+  padding: var(--spacing-md) var(--spacing-lg);
   display: flex;
   align-content: center;
   overflow: visible;
@@ -110,19 +110,18 @@
 }
 
 .main-nav__item--level-0 {
-  &:hover { 
+  &:hover {
     background-color: var(--main-menu-color-link-bg-hover);
 
     // Make the level-0 link text color change on li hover
     .main-nav__link--level-0.main-nav__link--with-sub {
       color: var(--main-menu-color-link-label-hover);
     }
   }
-} 
+}
 
 .main-nav__link--level-1,
 .main-nav__link--level-2 {
-
   & {
     font-size: var(--font-size-h6);
   }

src/tokens/tokens.scss

@@ -3,43 +3,43 @@
  */
 
 :root {
-  --colors-sb-background: #ffffff;
+  --colors-sb-background: #fff;
   --colors-sb-text-body: #00202e;
   --colors-sb-text-heading: #0080b7;
   --colors-sb-visualization: #009fe4;
   --text-field-border-width: 1px;
   --text-field-radius: 0.625rem;
   --text-field-border: [object Object];
-  --tabs-color-bg-default: #ffffff;
-  --tabs-color-bg-active: #ffffff;
-  --tabs-color-bg-hover: #ffffff;
+  --tabs-color-bg-default: #fff;
+  --tabs-color-bg-active: #fff;
+  --tabs-color-bg-hover: #fff;
   --tabs-color-text-default: #00202e;
   --tabs-color-text-active: #0080b7;
   --tabs-color-text-hover: #005f89;
   --tabs-color-border-bottom: #a9afb1;
   --tab-label: [object Object];
-  --table-color-cell-bg: #ffffff;
+  --table-color-cell-bg: #fff;
   --table-color-cell-bg-stripe: #9ce1ff;
   --table-color-cell-text: #00202e;
   --table-color-cell-icon: #005f89;
   --table-color-header-bg: #005f89;
-  --table-color-header-text: #ffffff;
+  --table-color-header-text: #fff;
   --table-color-header-icon: #9ce1ff;
   --table-color-border: #d4d7d8;
   --status-color-info-bg: #16bdde;
   --status-color-info-label: #272727;
   --status-color-danger-bg: #bd1919;
-  --status-color-danger-label: #ffffff;
+  --status-color-danger-label: #fff;
   --status-color-success-bg: #337b32;
-  --status-color-success-label: #ffffff;
+  --status-color-success-label: #fff;
   --status-color-warning-bg: #f6c40f;
-  --status-color-warning-label: #333333;
+  --status-color-warning-label: #333;
   --status-font-size-header: 1.3125rem;
   --selectdropdown-color-label: #00202e;
   --selectdropdown-color-label-disabled: #a9afb1;
-  --selectdropdown-color-button-fill: #ffffff;
+  --selectdropdown-color-button-fill: #fff;
   --selectdropdown-color-button-fill-hover: #e6f5fc;
-  --selectdropdown-color-button-fill-disabled: #ffffff;
+  --selectdropdown-color-button-fill-disabled: #fff;
   --selectdropdown-color-button-stroke: #7f878b;
   --selectdropdown-color-button-stroke-hover: #545f64;
   --selectdropdown-color-button-stroke-disabled: #a9afb1;
@@ -55,7 +55,7 @@
   --radio-color-button-stroke-disabled: #a9afb1;
   --radio-gap: 0.25rem;
   --pager-color-text-default: #29373d;
-  --pager-color-text-hover: #ffffff;
+  --pager-color-text-hover: #fff;
   --pager-color-text-focus: #0080b7;
   --pager-color-fill-hover: #0080b7;
   --pager-default: [object Object];
@@ -65,11 +65,11 @@
   --pager-padding-y: 0.5rem;
   --pager-padding-y-hover: 0.5rem;
   --pager-padding-y-focus: 0.5rem;
-  --utility-menu-color-bg: #ffffff;
+  --utility-menu-color-bg: #fff;
   --utility-menu-color-link-default: #006089;
   --utility-menu-color-link-hover: #0080b7;
-  --main-menu-color-bg: #ffffff;
-  --main-menu-color-link-bg: #ffffff;
+  --main-menu-color-bg: #fff;
+  --main-menu-color-link-bg: #fff;
   --main-menu-color-link-bg-hover: #9ce1ff;
   --main-menu-color-link-label: #0080b7;
   --main-menu-color-link-label-hover: #006089;
@@ -79,7 +79,7 @@
   --main-menu-color-dropdown-label-hover: #006089;
   --link-color-default: #005f89;
   --link-color-hover: #00202e;
-  --link-color-inverse: #ffffff;
+  --link-color-inverse: #fff;
   --link-color-inverse-hover: #9ce1ff;
   --link-body: [object Object];
   --input-gap: 0.5rem;
@@ -91,16 +91,16 @@
   --input-border-color: #7f878b;
   --input-radius: 0.25rem;
   --input-label-lineheight: 125%;
-  --input-bkg: #ffffff;
+  --input-bkg: #fff;
   --header-search-background: #006089;
-  --header-search-text-icon: #ffffff;
+  --header-search-text-icon: #fff;
   --footer-background-default: #006089;
-  --footer-background-light: #ffffff;
+  --footer-background-light: #fff;
   --footer-heading-default: #9ce1ff;
   --footer-heading-dark: #0080b7;
   --footer-icon-default: #9ce1ff;
   --footer-icon-dark: #0080b7;
-  --fieldset-color-bg: #ffffff;
+  --fieldset-color-bg: #fff;
   --fieldset-color-border: #a9afb1;
   --fieldset-color-label: #00202e;
   --radius-fieldset: 0.25rem;
@@ -115,7 +115,7 @@
   --cta-color-heading-darker: #006089;
   --cta-color-eyebrow: #006089;
   --cta-color-body: #00202e;
-  --cta-color-button: #ffffff;
+  --cta-color-button: #fff;
   --cta-background: #9ce1ff;
   --cta-button-background: #009fe4;
   --cta-button-background-darker: #006089;
@@ -132,10 +132,10 @@
   --card-color-heading: #0080b7;
   --card-color-subheading: #006089;
   --button-color-bkg: #005f89;
-  --button-color-label: #ffffff;
+  --button-color-label: #fff;
   --button-color-bkg-hover: #00405b;
-  --button-color-label-hover: #ffffff;
-  --button-color-label-focus: #ffffff;
+  --button-color-label-hover: #fff;
+  --button-color-label-focus: #fff;
   --button-color-bkg-focus: #00405b;
   --button-padding-x: 1rem;
   --button-padding-x-hover: 1rem;
@@ -161,12 +161,12 @@
   --block-quote-padding-x: 2rem;
   --block-quote-padding-y: 0.5rem;
   --banner-button-text: #00202e;
-  --banner-button-border: #ffffff;
+  --banner-button-border: #fff;
   --banner-button-background: #9ce1ff;
-  --banner-text: #ffffff;
+  --banner-text: #fff;
   --banner-background: #006089;
   --banner-background-opacity: 0.75;
-  --announcement-background-default: #ffffff;
+  --announcement-background-default: #fff;
   --announcement-background-light: #9ce1ff;
   --announcement-background-dark: #006089;
   --announcement-heading-default: #0080b7;
@@ -189,13 +189,13 @@
   --color-text-body: #00202e;
   --color-text-body-lighter: #006089;
   --color-text-heading: #006089;
-  --color-text-white: #ffffff;
+  --color-text-white: #fff;
   --color-warning-default: #d80f0f;
   --color-link: #005f89;
   --color-link-hover: #00202e;
   --color-link-hover-lighter: #00405b;
-  --color-black: #000000;
-  --color-white: #ffffff;
+  --color-black: #000;
+  --color-white: #fff;
   --color-emulsify-blue-100: #e6f5fc;
   --color-emulsify-blue-200: #ccecfa;
   --color-emulsify-blue-300: #99d9f4;