Simplify selected/unselected tag styling

Author: spaceo

src/stories/Library/tag/Tag.tsx

@@ -26,7 +26,7 @@ export const Tag = ({
       onClick={() => isClickable && setSelected(!selected)}
       className={clsx(
         "tag",
-        hasBackground || selected ? "tag--outlined-selected" : "tag--outlined",
+        (hasBackground || selected) && "tag--fill",
         usesCursor && "cursor-pointer",
         `tag--${size}`
       )}

src/stories/Library/tag/tag.scss

@@ -2,9 +2,14 @@
   display: inline-flex;
   justify-content: center;
   align-items: center;
-  background-color: $c-global-secondary;
+  outline: 1px solid $c-global-tertiary-1;
+  padding: 8px 16px;
   @extend %text-tags;
 
+  &.tag--fill {
+    background-color: $c-global-secondary;
+  }
+
   &.tag--small {
     height: 32px;
     padding: 0 8px;
@@ -14,17 +19,6 @@
     height: 40px;
     padding: 0 16px;
   }
-
-  &.tag--outlined {
-    background-color: transparent;
-    outline: 1px solid $c-global-tertiary-1;
-    padding: 8px 16px;
-    cursor: pointer;
-
-    &-selected {
-      background-color: #eee9e5;
-    }
-  }
 }
 
 .tag-icon {