feat: accessibility - tab-focus visibility - enlarge and harmonise di…

…mensions of header links
intershop · Aug 23, 2024 · 38a9c1a · 38a9c1a
1 parent 063af9b
commit 38a9c1a
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 4 deletions.
diff --git a/src/app/shell/header/header-default/header-default.component.html b/src/app/shell/header/header-default/header-default.component.html
@@ -25,8 +25,9 @@
   </ul>
 
   <div class="header-utility">
-    <a class="search-toggler" [ngClass]="{ 'active-search': showSearch }" *ngIf="isSticky">
+    <a class="search-toggler" [ngClass]="{ 'active-search': showSearch }">
       <fa-icon
+        *ngIf="isSticky"
         class="header-icon"
         [icon]="['fas', 'search']"
         (click)="toggle('search')"

diff --git a/src/styles/components/header/header.scss b/src/styles/components/header/header.scss
@@ -71,6 +71,8 @@ header {
 
   .mid-header {
     .quickorder-link {
+      padding: ($space-default * 0.5) divide($space-default, 3);
+
       .header-icon {
         font-size: $font-size-corporate;
         color: $CORPORATE-PRIMARY;
@@ -140,13 +142,21 @@ header {
     }
 
     a {
+      display: inline-block !important;
+      line-height: 34px;
       color: $text-color-quinary;
     }
 
     .wishlist-count,
     .compare-status {
       position: relative;
     }
+
+    .item-count-container {
+      .badge {
+        top: 2px;
+      }
+    }
   }
 }
 

diff --git a/src/styles/components/header/language-switch.scss b/src/styles/components/header/language-switch.scss
@@ -23,8 +23,8 @@
   &:not(.accordion) {
     .language-switch-button {
       display: block;
-      padding: ($space-default * 0.5) $space-default ($space-default * 0.5) ($space-default * 0.5);
-      margin: 0;
+      padding: ($space-default * 0.5) $space-default 9px ($space-default * 0.5);
+      margin: 2px 0 0;
       color: $text-color-quinary !important;
     }
 

diff --git a/src/styles/pages/checkout/quick-cart.scss b/src/styles/pages/checkout/quick-cart.scss
@@ -29,7 +29,7 @@
   }
 
   > .btn-link {
-    padding: 0 ($space-default * 0.5);
+    padding: $space-default * 0.5;
     white-space: nowrap;
   }