Update Font Sizes with header with Menu button and Language switcher

__snapshots__/components/header/_macro.spec.js.snap

@@ -90,7 +90,7 @@ exports[`FOR: Macro: Header Snapshot: search heading matches snapshot when no se
 
 
 
-                                <div class="ons-header__links ons-grid__col ons-header__menu-link">
+                                <div class="ons-header__links ons-grid__col ons-header__menu-links">
 
 
 
@@ -347,7 +347,7 @@ exports[`FOR: Macro: Header Snapshot: search heading matches snapshot when searc
 
 
 
-                                <div class="ons-header__links ons-grid__col ons-header__menu-link">
+                                <div class="ons-header__links ons-grid__col ons-header__menu-links">
 
 
 
@@ -618,7 +618,7 @@ exports[`FOR: Macro: Header Snapshot: search heading matches snapshot when searc
 
 
 
-                                <div class="ons-header__links ons-grid__col ons-header__menu-link">
+                                <div class="ons-header__links ons-grid__col ons-header__menu-links">
 
 
 

__snapshots__/layout/_template.spec.js.snap

@@ -186,7 +186,7 @@ exports[`base page template matches the basic variant header snapshot 1`] = `
 
 
 
-    <button type="button" class="ons-btn ons-u-fs-s--b ons-js-toggle-nav-menu ons-u-db-no-js_disabled button-nav disabled ons-btn--menu" aria-label="Toggle menu" aria-controls="menu-links" aria-expanded="false" aria-disabled="true">
+    <button type="button" class="ons-btn ons-u-fs-r--b ons-js-toggle-nav-menu ons-u-db-no-js_disabled button-nav disabled ons-btn--menu" aria-label="Toggle menu" aria-controls="menu-links" aria-expanded="false" aria-disabled="true">
     <span class="ons-btn__inner"><svg class="ons-icon ons-u-mr-2xs" viewBox="0 0 8 13" xmlns="http://www.w3.org/2000/svg" focusable="false" fill="currentColor" role="img" aria-hidden="true">
             <path d="M5.74,14.28l-.57-.56a.5.5,0,0,1,0-.71h0l5-5-5-5a.5.5,0,0,1,0-.71h0l.57-.56a.5.5,0,0,1,.71,0h0l5.93,5.93a.5.5,0,0,1,0,.7L6.45,14.28a.5.5,0,0,1-.71,0Z" transform="translate(-5.02 -1.59)"></path>
         </svg><span class="ons-btn__text">Menu</span></span>
@@ -199,7 +199,7 @@ exports[`base page template matches the basic variant header snapshot 1`] = `
 
 
 
-                                <div class="ons-header__links ons-grid__col ons-header__menu-link">
+                                <div class="ons-header__links ons-grid__col ons-header__menu-links">
 
 
 

src/components/button/_button.scss

@@ -631,6 +631,7 @@ $button-shadow-size: 3px;
 
     &--menu {
         border-bottom: 4px solid rgb(0 0 0 / 0%);
+        height: 72px;
         .ons-icon {
             transform: rotate(90deg);
         }
@@ -644,12 +645,7 @@ $button-shadow-size: 3px;
             padding: 0;
             .ons-icon {
                 fill: var(--ons-color-text-link);
-                height: 1rem;
                 margin-top: 0;
-                width: 1rem;
-            }
-            .ons-btn__text {
-                height: 24px;
             }
         }
     }
@@ -723,7 +719,8 @@ $button-shadow-size: 3px;
     &--close {
         align-items: center;
         display: flex;
-        padding: 1.25rem 1rem 1rem;
+        height: 72px;
+        padding: 0 1.5rem;
     }
 
     &--search-icon &,

src/components/header/_header.scss

@@ -246,6 +246,20 @@
         }
     }
 
+    &--basic {
+        .ons-header__links--language-section {
+            padding: 0 1.5rem !important;
+        }
+
+        .ons-header__language {
+            margin-bottom: 4px !important;
+        }
+
+        .ons-language-links__item {
+            margin: 0 !important;
+        }
+    }
+
     &--basic & {
         &__grid-top {
             padding: 0;

src/components/header/_macro.njk

@@ -110,7 +110,7 @@
                                     {{
                                         onsButton({
                                             "text": params.menuLinks.toggleMenuButton.text | default("Menu"),
-                                            "classes": "ons-u-fs-s--b ons-js-toggle-nav-menu ons-u-db-no-js_disabled button-nav disabled",
+                                            "classes": "ons-u-fs-r--b ons-js-toggle-nav-menu ons-u-db-no-js_disabled button-nav disabled",
                                             "type": "button",
                                             "variants": "menu",
                                             "iconType": "chevron",
@@ -127,7 +127,7 @@
                             {% endif %}
 
                             {% if params.search or params.searchLinks %}
-                                <div class="ons-header__links ons-grid__col ons-header__menu-link">
+                                <div class="ons-header__links ons-grid__col ons-header__menu-links">
                                     {{
                                         onsButton({
                                             "classes": "ons-u-fs-s--b ons-js-toggle-header-search ons-u-db-no-js_disabled ons-btn--search-icon disabled",
@@ -146,8 +146,8 @@
                             {% endif %}
                         </div>
                         {% if params.language %}
-                            <div class="ons-header__links ons-grid__col ons-col-auto ons-u-d-no@2xs@s">
-                                <div class="ons-header__language">
+                            <div class="ons-header__links ons-grid__col ons-col-auto ons-header__links--language-section ons-u-d-no@2xs@m">
+                                <div class="ons-header__language ons-u-fs-r--b">
                                     {% from "components/language-selector/_macro.njk" import onsLanguageSelector %}
                                     {{ onsLanguageSelector(params.language) }}
                                 </div>
@@ -282,7 +282,7 @@
                 aria-label="{{ params.menuLinks.ariaLabel | default("Menu navigation") }}"
             >
                 {% if params.language %}
-                    <div class="ons-container ons-u-d-no@s ons-u-d-no@2xl">
+                    <div class="ons-container ons-u-d-no@m ons-u-d-no@2xl">
                         <div class="ons-header-nav-menu__language ons-u-fs-s--b">
                             {% from "components/language-selector/_macro.njk" import onsLanguageSelector %}
                             {{ onsLanguageSelector(params.language) }}