fix: update full-width variation to once again be added to the parent container as a temp workaround to how theming classes currently get added

Author: sghoweri

packages/components/bolt-nav-priority/nav-priority.scss

@@ -15,7 +15,7 @@ bolt-nav-priority {
   flex-shrink: 4; // shrink faster than other components in tight spots
 
   @include bolt-if-browser-supports-display-contents {
-    @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+    @media screen and (max-width: $bolt-navbar-xsmall-bp) {
       &.is-ready {
         display: contents;
       }
@@ -37,7 +37,7 @@ bolt-nav-priority {
 
 .c-bolt-nav-priority {
   @include bolt-if-browser-supports-display-contents {
-    @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+    @media screen and (max-width: $bolt-navbar-xsmall-bp) {
       &.is-ready {
         display: contents;
       }
@@ -68,7 +68,7 @@ bolt-nav-priority {
 
 .c-bolt-nav-priority__primary {
   @include bolt-if-browser-supports-display-contents {
-    @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+    @media screen and (max-width: $bolt-navbar-xsmall-bp) {
       .is-ready & {
         display: contents;
       }
@@ -93,7 +93,7 @@ bolt-nav-priority {
 
 @include bolt-if-browser-supports-display-contents {
   .c-bolt-nav-priority__show-more {
-    @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+    @media screen and (max-width: $bolt-navbar-xsmall-bp) {
       display: contents;
     }
   }
@@ -161,7 +161,7 @@ bolt-nav-priority {
   }
 
   @include bolt-if-browser-supports-display-contents {
-    @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+    @media screen and (max-width: $bolt-navbar-xsmall-bp) {
       grid-row: 2 / span 1;
       grid-column: 1 / span 6;
       width: auto;
@@ -217,7 +217,7 @@ bolt-nav-priority {
   cursor: pointer;
   position: relative;
 
-  @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+  @media screen and (max-width: $bolt-navbar-xsmall-bp) {
     border-radius: 0;
     border-left-width: 1px;
     border-left-color: bolt-theme(headline, 0.2);
@@ -272,7 +272,7 @@ bolt-nav-priority {
   }
 
   @include bolt-if-browser-supports-display-contents {
-    @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+    @media screen and (max-width: $bolt-navbar-xsmall-bp) {
       .is-ready & {
         grid-row: 1 / span 1;
         grid-column: 5 / span 1;
@@ -287,7 +287,7 @@ bolt-nav-priority {
   position: relative;
   z-index: 10;
 
-  @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+  @media screen and (max-width: $bolt-navbar-xsmall-bp) {
     @include bolt-visuallyhidden;
   }
 }
@@ -300,7 +300,7 @@ bolt-nav-priority {
   line-height: 0;
   font-size: 1em;
 
-  @media screen and (max-width: #{bolt-breakpoint(xsmall)}) {
+  @media screen and (max-width: $bolt-navbar-xsmall-bp) {
     font-size: 24px;
   }
 

packages/components/bolt-navbar/src/navbar.scss

@@ -23,6 +23,11 @@ bolt-navbar {
     }
   }
 
+  // @todo: remove once Navbar refactored to have theming classes added to the `.c-bolt-navbar` inner.
+  &[width*=full] {
+    @include bolt-full-bleed;
+  }
+
   display: block;
   overflow: visible;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);