Skip to content

Commit

Permalink
fix(Tag): add borders to tag variants
Browse files Browse the repository at this point in the history
  • Loading branch information
@driss-chelouati
driss-chelouati committed Feb 20, 2024
1 parent c1291fd commit 98aec85
Show file tree
Hide file tree
Showing 2 changed files with 140 additions and 0 deletions.
60 changes: 60 additions & 0 deletions src/plugins/components/tag/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,6 +100,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.muted.background.light} dark:bg-${config.variant.solid.muted.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.muted.border.light} dark:border-${config.variant.solid.muted.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.muted.shadow.size}`]: {},
Expand All @@ -118,6 +121,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.mutedContrast.background.light} dark:bg-${config.variant.solid.mutedContrast.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.mutedContrast.border.light} dark:border-${config.variant.solid.mutedContrast.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.mutedContrast.shadow.size}`]:
Expand All @@ -137,6 +143,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.light.background.light} dark:bg-${config.variant.solid.light.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.light.border.light} dark:border-${config.variant.solid.light.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.light.shadow.size}`]: {},
Expand All @@ -155,6 +164,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.dark.background.light} dark:bg-${config.variant.solid.dark.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.dark.border.light} dark:border-${config.variant.solid.dark.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.dark.shadow.size}`]: {},
Expand All @@ -173,6 +185,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.black.background.light} dark:bg-${config.variant.solid.black.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.black.border.light} dark:border-${config.variant.solid.black.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.black.shadow.size}`]: {},
Expand All @@ -191,6 +206,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.primary.background.light} dark:bg-${config.variant.solid.primary.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.primary.border.light} dark:border-${config.variant.solid.primary.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.primary.shadow.size} shadow-${config.variant.solid.primary.shadow.light} shadow-${config.variant.solid.primary.shadow.dark}`]:
Expand All @@ -210,6 +228,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.info.background.light} dark:bg-${config.variant.solid.info.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.info.border.light} dark:border-${config.variant.solid.info.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.info.shadow.size} shadow-${config.variant.solid.info.shadow.light} shadow-${config.variant.solid.info.shadow.dark}`]:
Expand All @@ -229,6 +250,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.success.background.light} dark:bg-${config.variant.solid.success.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.success.border.light} dark:border-${config.variant.solid.success.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.success.shadow.size} shadow-${config.variant.solid.success.shadow.light} shadow-${config.variant.solid.success.shadow.dark}`]:
Expand All @@ -248,6 +272,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.warning.background.light} dark:bg-${config.variant.solid.warning.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.warning.border.light} dark:border-${config.variant.solid.warning.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.warning.shadow.size} shadow-${config.variant.solid.warning.shadow.light} shadow-${config.variant.solid.warning.shadow.dark}`]:
Expand All @@ -267,6 +294,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.solid.danger.background.light} dark:bg-${config.variant.solid.danger.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.solid.danger.border.light} dark:border-${config.variant.solid.danger.border.dark}`]:
{},
//Shadow:static
'&.nui-tag-shadow': {
[`@apply shadow-${config.variant.solid.danger.shadow.size} shadow-${config.variant.solid.danger.shadow.light} shadow-${config.variant.solid.danger.shadow.dark}`]:
Expand All @@ -289,6 +319,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.default.background.light} dark:bg-${config.variant.pastel.default.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.default.border.light} dark:border-${config.variant.pastel.default.border.dark}`]:
{},
},
//Color:muted
'&.nui-tag-muted, &.nui-tag-muted-contrast': {
Expand All @@ -298,6 +331,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.muted.background.light} dark:bg-${config.variant.pastel.muted.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.muted.border.light} dark:border-${config.variant.pastel.muted.border.dark}`]:
{},
},
//Color:light
'&.nui-tag-light': {
Expand All @@ -307,6 +343,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.light.background.light} dark:bg-${config.variant.pastel.light.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.light.border.light} dark:border-${config.variant.pastel.light.border.dark}`]:
{},
},
//Color:dark
'&.nui-tag-dark': {
Expand All @@ -316,6 +355,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.dark.background.light} dark:bg-${config.variant.pastel.dark.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.dark.border.light} dark:border-${config.variant.pastel.dark.border.dark}`]:
{},
},
//Color:black
'&.nui-tag-black': {
Expand All @@ -325,6 +367,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.black.background.light} dark:bg-${config.variant.pastel.black.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.black.border.light} dark:border-${config.variant.pastel.black.border.dark}`]:
{},
},
//Color:primary
'&.nui-tag-primary': {
Expand All @@ -334,6 +379,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.primary.background.light} dark:bg-${config.variant.pastel.primary.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.primary.border.light} dark:border-${config.variant.pastel.primary.border.dark}`]:
{},
},
//Color:info
'&.nui-tag-info': {
Expand All @@ -343,6 +391,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.info.background.light} dark:bg-${config.variant.pastel.info.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.info.border.light} dark:border-${config.variant.pastel.info.border.dark}`]:
{},
},
//Color:success
'&.nui-tag-success': {
Expand All @@ -352,6 +403,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.success.background.light} dark:bg-${config.variant.pastel.success.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.success.border.light} dark:border-${config.variant.pastel.success.border.dark}`]:
{},
},
//Color:warning
'&.nui-tag-warning': {
Expand All @@ -361,6 +415,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.warning.background.light} dark:bg-${config.variant.pastel.warning.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.warning.border.light} dark:border-${config.variant.pastel.warning.border.dark}`]:
{},
},
//Color:danger
'&.nui-tag-danger': {
Expand All @@ -370,6 +427,9 @@ export default plugin(({ addComponents, theme }) => {
//Background
[`@apply bg-${config.variant.pastel.danger.background.light} dark:bg-${config.variant.pastel.danger.background.dark}`]:
{},
//Border
[`@apply border border-${config.variant.pastel.danger.border.light} dark:border-${config.variant.pastel.danger.border.dark}`]:
{},
},
},
//Variant:outline
Expand Down
Loading

0 comments on commit 98aec85

Please sign in to comment.