1 $tag-background-color: $background !default
2 $tag-color: $text !default
3 $tag-radius: $radius !default
4 $tag-delete-margin: 1px !default
10 justify-content: flex-start
16 margin-bottom: -0.5rem
21 .tag:not(.is-normal):not(.is-large)
22 font-size: $size-normal
24 .tag:not(.is-normal):not(.is-medium)
25 font-size: $size-medium
27 justify-content: center
32 justify-content: flex-end
43 border-bottom-left-radius: 0
44 border-top-left-radius: 0
46 border-bottom-right-radius: 0
47 border-top-right-radius: 0
51 background-color: $tag-background-color
52 border-radius: $tag-radius
55 font-size: $size-small
57 justify-content: center
64 margin-right: -0.375rem
66 @each $name, $pair in $colors
68 $color-invert: nth($pair, 2)
70 background-color: $color
72 // If a light and dark colors are provided
74 $color-light: nth($pair, 3)
75 $color-dark: nth($pair, 4)
77 background-color: $color-light
81 font-size: $size-small
83 font-size: $size-normal
85 font-size: $size-medium
87 &:first-child:not(:last-child)
89 margin-right: 0.1875em
90 &:last-child:not(:first-child)
92 margin-right: -0.375em
93 &:first-child:last-child
95 margin-right: -0.375em
98 margin-left: $tag-delete-margin
104 background-color: currentColor
110 transform: translateX(-50%) translateY(-50%) rotate(45deg)
111 transform-origin: center center
120 background-color: darken($tag-background-color, 5%)
122 background-color: darken($tag-background-color, 10%)
124 border-radius: $radius-rounded
128 text-decoration: underline