fix: fix color scheme

datahub-project · Jul 30, 2024 · 9ea3af0 · 9ea3af0
1 parent 9f20496
commit 9ea3af0
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/docs-website/src/learn/_components/LearnListPage/index.jsx b/docs-website/src/learn/_components/LearnListPage/index.jsx
@@ -58,8 +58,9 @@ function BlogListPageContent(props) {
             <strong>For: </strong>
             {audiences.map((audience) => (
               <button
-                className={`button button--secondary ${activeFilters.includes(audience) && "button--active"}`}
+                className={clsx(styles.button, "button button--secondary", { [styles.buttonActive]: activeFilters.includes(audience) })}
                 onClick={() => handleFilterToggle(audience)}
+                key={audience}
               >
                 {audience}
               </button>

diff --git a/docs-website/src/learn/_components/LearnListPage/styles.module.scss b/docs-website/src/learn/_components/LearnListPage/styles.module.scss
@@ -4,4 +4,10 @@
   align-items: center;
   gap: 10px;
   flex-wrap: wrap;
-}
+
+  .buttonActive {
+    background-color: var(--ifm-color-primary);
+    border: 1px solid var(--ifm-color-primary);
+    color: #ffffff;
+  }
+}