From 0ebe0b4b5b067e4628e1deef267dcfb4e34e3cb4 Mon Sep 17 00:00:00 2001
From: Alona Zherdetska <alionazhv@gmail.com>
Date: Wed, 18 Dec 2024 16:56:40 +0100
Subject: [PATCH 1/4] fix(styles): added focus styles for nested post-avatar,
 added color change on hover for nested avatar component in HCM

---
 packages/styles/src/components/avatar.scss | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/packages/styles/src/components/avatar.scss b/packages/styles/src/components/avatar.scss
index 63adea6c1c..d12873dbb9 100644
--- a/packages/styles/src/components/avatar.scss
+++ b/packages/styles/src/components/avatar.scss
@@ -1,5 +1,6 @@
 @use '../tokens/components';
 @use '../functions/tokens';
+@use './../mixins/utilities';
 
 tokens.$default-map: components.$post-avatar;
 
@@ -14,14 +15,26 @@ button {
     text-decoration: none;
   }
 
+  post-avatar {
+    @include utilities.high-contrast-mode() {
+      border-color: CanvasText !important;
+    }
+  }
+
   &:hover {
     post-avatar {
       --post-avatar-bg: #{tokens.get('avatar-hover-bg')};
       --post-avatar-fg: #{tokens.get('avatar-hover-fg')};
 
+      @include utilities.high-contrast-mode() {
+        border-color: Highlight !important;
+      }
+
       &::after {
         background-color: tokens.get('avatar-image-hover-opacity');
       }
     }
   }
+
+  @include utilities.focus-style;
 }

From b44a8892db077773416b03e44e5d75bbc2a9bd0c Mon Sep 17 00:00:00 2001
From: Alona Zherdetska <alionazhv@gmail.com>
Date: Wed, 18 Dec 2024 16:59:09 +0100
Subject: [PATCH 2/4] chore(changeset): added a changeset

---
 .changeset/sweet-cherries-drop.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/sweet-cherries-drop.md

diff --git a/.changeset/sweet-cherries-drop.md b/.changeset/sweet-cherries-drop.md
new file mode 100644
index 0000000000..67d1f2088c
--- /dev/null
+++ b/.changeset/sweet-cherries-drop.md
@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-styles': patch
+---
+
+Fixed high contrast mode hover and focus styles for `post-avatar` component in anchor and button contexts.

From 5794857bcedfd6825978b936eee65e62f8e5f722 Mon Sep 17 00:00:00 2001
From: Alona Zherdetska <alionazhv@gmail.com>
Date: Wed, 18 Dec 2024 17:19:23 +0100
Subject: [PATCH 3/4] chore(styles): removed redundant important

---
 packages/styles/src/components/avatar.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/styles/src/components/avatar.scss b/packages/styles/src/components/avatar.scss
index d12873dbb9..4789e199e6 100644
--- a/packages/styles/src/components/avatar.scss
+++ b/packages/styles/src/components/avatar.scss
@@ -17,7 +17,7 @@ button {
 
   post-avatar {
     @include utilities.high-contrast-mode() {
-      border-color: CanvasText !important;
+      border-color: CanvasText;
     }
   }
 

From b800c53b66ab22d6699e8d62d731d442f001fbfd Mon Sep 17 00:00:00 2001
From: Alona Zherdetska <alionazhv@gmail.com>
Date: Fri, 3 Jan 2025 10:29:34 +0100
Subject: [PATCH 4/4] chore(styles): added border on hover for avatar nested
 inside an anchor tag or a buton

---
 packages/styles/src/components/avatar.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/styles/src/components/avatar.scss b/packages/styles/src/components/avatar.scss
index 4789e199e6..9a214b388f 100644
--- a/packages/styles/src/components/avatar.scss
+++ b/packages/styles/src/components/avatar.scss
@@ -25,6 +25,7 @@ button {
     post-avatar {
       --post-avatar-bg: #{tokens.get('avatar-hover-bg')};
       --post-avatar-fg: #{tokens.get('avatar-hover-fg')};
+      border-color: tokens.get('avatar-hover-bg');
 
       @include utilities.high-contrast-mode() {
         border-color: Highlight !important;