From 0f998acb486c3a020a406f0d891f0ad037c14316 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Mon, 15 Jun 2026 10:13:00 +0200
Subject: [PATCH] Use star icon for small sandwich button

---
 assets/icons/bookmark-filled.svg              |  3 ---
 assets/icons/bookmark-outline.svg             |  3 ---
 assets/icons/star-filled.svg                  |  3 +++
 patterns/company-card.html                    | 10 ++------
 styles/10-components-interactive-elements.css |  9 ++++++++
 styles/23-patterns-object-group-card.css      | 23 -------------------
 6 files changed, 14 insertions(+), 37 deletions(-)
 delete mode 100644 assets/icons/bookmark-filled.svg
 delete mode 100644 assets/icons/bookmark-outline.svg
 create mode 100644 assets/icons/star-filled.svg

diff --git a/assets/icons/bookmark-filled.svg b/assets/icons/bookmark-filled.svg
deleted file mode 100644
index 1962461..0000000
--- a/assets/icons/bookmark-filled.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="img" aria-hidden="true">
-  <path d="M7 3h10a1 1 0 0 1 1 1v17l-6-3.75L6 21V4a1 1 0 0 1 1-1Z" fill="currentColor"/>
-</svg>
diff --git a/assets/icons/bookmark-outline.svg b/assets/icons/bookmark-outline.svg
deleted file mode 100644
index 50e0759..0000000
--- a/assets/icons/bookmark-outline.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="img" aria-hidden="true">
-  <path d="M7 3h10a1 1 0 0 1 1 1v17l-6-3.75L6 21V4a1 1 0 0 1 1-1Z" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/>
-</svg>
diff --git a/assets/icons/star-filled.svg b/assets/icons/star-filled.svg
new file mode 100644
index 0000000..d596afc
--- /dev/null
+++ b/assets/icons/star-filled.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="img" aria-hidden="true">
+  <path d="m12 2.8 2.89 5.85 6.46.94-4.68 4.56 1.1 6.44L12 17.53 6.23 20.59l1.1-6.44L2.65 9.59l6.46-.94L12 2.8Z" fill="currentColor"/>
+</svg>
diff --git a/patterns/company-card.html b/patterns/company-card.html
index 3758a66..5558aaa 100644
--- a/patterns/company-card.html
+++ b/patterns/company-card.html
@@ -16,10 +16,7 @@
     <div class="sg-object-card-grid">
       <article class="sg-card sg-object-card" data-pattern="company-card" aria-label="Company Card">
         <header class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-object-card__header" data-pattern-part="company-card-header">
-          <div class="sg-company-card__header-title">
-            <div class="sg-strong">Netflix, Inc.</div>
-            <span class="sg-company-card__bookmark-icon" aria-hidden="true"></span>
-          </div>
+          <div class="sg-strong">Netflix, Inc.</div>
           <div class="sg-sandwich-menu-wrap" data-open="false" data-align="right" data-component="sandwich-menu" data-component-size="small">
             <button class="sg-interaction-element sg-sandwich-button sg-sandwich-button--small" type="button" aria-expanded="false" aria-label="Menü öffnen" data-component-part="sandwich-trigger">
               <span class="sg-sandwich-button__icon" aria-hidden="true">
@@ -29,10 +26,7 @@
               </span>
             </button>
             <div class="sg-sandwich-menu-panel" aria-label="Ausgeklapptes Menü" data-component-part="sandwich-panel">
-              <a class="sg-sandwich-menu-link sg-company-card__bookmark-menu-link" href="#">
-                <span class="sg-company-card__bookmark-icon" aria-hidden="true"></span>
-                <span>Merken</span>
-              </a>
+              <a class="sg-sandwich-menu-link" href="#">Menüpunkt</a>
               <a class="sg-sandwich-menu-link" href="#">Menüpunkt</a>
               <a class="sg-sandwich-menu-link" href="#">Menüpunkt</a>
             </div>
diff --git a/styles/10-components-interactive-elements.css b/styles/10-components-interactive-elements.css
index fa8360e..9e98c12 100644
--- a/styles/10-components-interactive-elements.css
+++ b/styles/10-components-interactive-elements.css
@@ -1028,7 +1028,16 @@
     }
 
     .sg-sandwich-menu-wrap[data-component-size="small"] .sg-sandwich-button__icon {
+      display: block;
       width: calc(var(--sandwich-line-width) - 3px);
+      height: calc(var(--sandwich-line-width) - 3px);
+      background-color: var(--color-black);
+      -webkit-mask: url("../assets/icons/star-filled.svg") no-repeat center / contain;
+      mask: url("../assets/icons/star-filled.svg") no-repeat center / contain;
+    }
+
+    .sg-sandwich-menu-wrap[data-component-size="small"] .sg-sandwich-button__line {
+      display: none;
     }
 
     .sg-sandwich-menu-wrap {
diff --git a/styles/23-patterns-object-group-card.css b/styles/23-patterns-object-group-card.css
index f99ef9a..5fbb9b3 100644
--- a/styles/23-patterns-object-group-card.css
+++ b/styles/23-patterns-object-group-card.css
@@ -35,29 +35,6 @@
   color: var(--text-company-card-data-negative);
 }
 
-.sg-company-card__header-title {
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-small);
-  min-width: 0;
-}
-
-.sg-company-card__bookmark-icon {
-  display: inline-block;
-  inline-size: 1em;
-  block-size: 1em;
-  flex: 0 0 auto;
-  background-color: currentColor;
-  -webkit-mask: url("../assets/icons/bookmark-filled.svg") no-repeat center / contain;
-  mask: url("../assets/icons/bookmark-filled.svg") no-repeat center / contain;
-}
-
-.sg-company-card__bookmark-menu-link {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--spacing-small);
-}
-
 .sg-company-card__analysis-title {
   margin: 0;
 }