Merge pull request #14377 from craftcms/feature/cms-1258-warning-heig…

…ht-alignment-issue Warning height alignment issue
craftcms · Feb 14, 2024 · e8faa36 · e8faa36
2 parents 2657ab4 + 4bbf1f7
commit e8faa36
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 5 deletions.
diff --git a/src/templates/_layouts/components/alerts.twig b/src/templates/_layouts/components/alerts.twig
@@ -22,6 +22,7 @@
             type: 'li',
             style: {
               'display': 'block',
+              'height': 'var(--header-height)'
             },
           } only %}
             {% block content %}

diff --git a/src/web/assets/cp/dist/css/cp.css b/src/web/assets/cp/dist/css/cp.css
diff --git a/src/web/assets/cp/dist/css/cp.css.map b/src/web/assets/cp/dist/css/cp.css.map
diff --git a/src/web/assets/cp/src/css/_cp.scss b/src/web/assets/cp/src/css/_cp.scss
@@ -23,6 +23,7 @@ $badgeColor: var(--gray-800);
   --neg-padding: calc(var(--padding) * -1);
   --sidebar-width: #{$sidebarWidth};
   --global-sidebar-width: #{$sidebarWidth};
+  --header-height: calc(44rem / 16);
 }
 
 html {
@@ -351,7 +352,7 @@ li.crumb .btn.menubtn,
   border-bottom: 1px solid var(--hairline-color);
 
   .flex {
-    height: calc(44rem / 16);
+    height: var(--header-height);
     align-items: center;
   }
 
@@ -372,7 +373,7 @@ li.crumb .btn.menubtn,
   justify-content: center;
   width: 44px;
   min-width: 44px;
-  height: calc(44rem / 16);
+  height: var(--header-height);
   border-right: 1px solid var(--medium-hairline-color);
   line-height: 26px;
   color: currentColor;
@@ -420,7 +421,7 @@ li.crumb .btn.menubtn,
   align-items: stretch;
   flex-wrap: nowrap;
   max-width: 100%;
-  height: calc(44rem / 16);
+  height: var(--header-height);
 
   --arrow-padding: 10;
   --arrow-height: 22;