feat: Change style for taxonomy tags count

open-craft · Apr 8, 2024 · c926b37 · c926b37
1 parent f5b952a
commit c926b37
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 8 deletions.
diff --git a/src/content-tags-drawer/ContentTagsCollapsible.jsx b/src/content-tags-drawer/ContentTagsCollapsible.jsx
@@ -9,7 +9,9 @@ import {
   Collapsible,
   Button,
   Spinner,
+  Chip,
 } from '@openedx/paragon';
+import { Tag } from '@openedx/paragon/icons';
 import classNames from 'classnames';
 import { SelectableBox } from '@edx/frontend-lib-content-components';
 import { useIntl } from '@edx/frontend-platform/i18n';
@@ -445,16 +447,14 @@ const ContentTagsCollapsible = ({
           )}
         </div>
       </Collapsible>
-      <div className="d-flex">
-        <Badge
-          variant="light"
-          pill
-          className={classNames('align-self-start', 'mt-3', {
-            invisible: contentTagsCount === 0,
-          })}
+      <div className="d-flex align-items-start pt-2.5 taxonomy-tags-count-chip">
+        <Chip
+          iconBefore={Tag}
+          iconBeforeAlt="icon-before"
+          disabled={contentTagsCount === 0}
         >
           {contentTagsCount}
-        </Badge>
+        </Chip>
       </div>
     </div>
   );

diff --git a/src/content-tags-drawer/ContentTagsCollapsible.scss b/src/content-tags-drawer/ContentTagsCollapsible.scss
@@ -52,3 +52,7 @@
     color: white !important;
   }
 }
+
+.taxonomy-tags-count-chip > .pgn__chip {
+  background: none;
+}