Merge branch 'main' into 4202-components-fixing-switch-on-mobile

swisspost · Dec 19, 2024 · f6ec0a3 · f6ec0a3
2 parents d6f38f1 + 7508c15
commit f6ec0a3
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 1 deletion.
diff --git a/.changeset/fresh-schools-peel.md b/.changeset/fresh-schools-peel.md
@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-styles': patch
+---
+
+Added styles for text links and icon-buttons for Composible Footer in HCM.
diff --git a/.changeset/wicked-scissors-buy.md b/.changeset/wicked-scissors-buy.md
@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-components': patch
+---
+
+Removed focus from collapsible when in collapsed state.
diff --git a/packages/components/src/components/post-collapsible/post-collapsible.tsx b/packages/components/src/components/post-collapsible/post-collapsible.tsx
@@ -96,7 +96,7 @@ export class PostCollapsible {
 
   render() {
     return (
-      <Host data-version={version}>
+      <Host data-version={version} tabindex={this.collapsed ? -1 : undefined}>
         <slot />
       </Host>
     );

diff --git a/packages/styles/src/components/globals/post-footer.scss b/packages/styles/src/components/globals/post-footer.scss
@@ -1,6 +1,7 @@
 @use '../../variables/color';
 @use '../../mixins/media';
 @use '../../mixins/list';
+@use '../../mixins/utilities';
 
 post-footer {
   // mobile
@@ -37,6 +38,24 @@ post-footer {
     &:not(.btn-icon, .app-store-badge) {
       display: block;
       text-decoration: none;
+
+      &:hover {
+        @include utilities.high-contrast-mode() {
+          text-decoration: underline;
+        }
+      }
+    }
+
+    &.btn-icon {
+      @include utilities.high-contrast-mode() {
+        color: CanvasText !important;
+      }
+
+      &:hover {
+        @include utilities.high-contrast-mode() {
+          color: LinkText !important;
+        }
+      }
     }
   }