Skip to content

Commit

Permalink
fix(BaseListbox): update listbox styles for loading and label float
Browse files Browse the repository at this point in the history
  • Loading branch information
@driss-chelouati
driss-chelouati committed Dec 19, 2023
1 parent 8ffc758 commit 917b0bd
Showing 1 changed file with 22 additions and 22 deletions.
44 changes: 22 additions & 22 deletions src/plugins/components/listbox/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -186,7 +186,7 @@ export default plugin.withOptions(
{},
},
//Listbox:placeload
[`.${prefix}listbox-placeload`]: {
[`.${prefix}listbox-placeload.${prefix}loading-placeload`]: {
[`@apply absolute start-0 top-0 flex w-full items-center px-4`]: {},

[`.${prefix}placeload`]: {
Expand Down Expand Up @@ -473,7 +473,7 @@ export default plugin.withOptions(
//Listbox:loading
[`&.${prefix}listbox-loading`]: {
[`.${prefix}listbox-button`]: {
[`@apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent`]:
[`@apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent pointer-events-none`]:
{},
},
[`.${prefix}listbox-button ~ .${prefix}label-float`]: {
Expand Down Expand Up @@ -548,17 +548,17 @@ export default plugin.withOptions(
[`&.${prefix}listbox-label-float:not(.${prefix}has-icon).${prefix}listbox-sm`]:
{
[`.${prefix}label-float`]: {
[`@apply start-3 ms-0 mt-0`]: {},
[`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.sm.font.size} text-transparent`]:
{},
},
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]:
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]:
{
[`@apply !-ms-3 !-mt-7 !text-${config.label.float.font.color} !text-${config.icon.disabled.label.float.sm.font.size}`]:
[`@apply !-ms-3 !-mt-7 !text-${config.label.float.font.color}`]:
{},
},
[`.${prefix}listbox-button:not(:focus-visible) ~ .${prefix}label-float, .${prefix}listbox-button:not(:focus) ~ .${prefix}label-float`]:
{
[`@apply ms-0 mt-0 !text-transparent`]: {},
},
[`.${prefix}listbox-button ~ .${prefix}label-float`]: {
[`@apply ms-0 mt-0`]: {},
},
},
//With:icon && Size:sm && Label:float
[`&.${prefix}listbox-label-float.${prefix}has-icon.${prefix}listbox-sm`]:
Expand All @@ -567,7 +567,7 @@ export default plugin.withOptions(
[`@apply start-8 -ms-8 -mt-7 text-${config.icon.disabled.label.float.sm.font.size} text-transparent`]:
{},
},
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]:
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]:
{
[`@apply !-ms-8 !-mt-7 !text-${config.label.float.font.color}`]:
{},
Expand All @@ -580,12 +580,12 @@ export default plugin.withOptions(
[`&.${prefix}listbox-label-float:not(.${prefix}has-icon).${prefix}listbox-md`]:
{
[`.${prefix}label-float`]: {
[`@apply start-3 -ms-3 -mt-8 text-${config.icon.disabled.label.float.md.font.size.base} text-transparent`]:
[`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.md.font.size.base} text-transparent`]:
{},
},
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]:
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]:
{
[`@apply !-ms-3 !-mt-8 !text-${config.icon.disabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]:
[`@apply !-ms-3 !-mt-7 !text-${config.icon.disabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]:
{},
},
[`.${prefix}listbox-button ~ .${prefix}label-float`]: {
Expand All @@ -597,12 +597,12 @@ export default plugin.withOptions(
[`&.${prefix}listbox-label-float.${prefix}has-icon.${prefix}listbox-md`]:
{
[`.${prefix}label-float`]: {
[`@apply start-10 -ms-10 -mt-8 text-${config.icon.enabled.label.float.md.font.size.base} text-transparent`]:
[`@apply start-10 -ms-10 -mt-7 text-${config.icon.enabled.label.float.md.font.size.base} text-transparent`]:
{},
},
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]:
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]:
{
[`@apply !-ms-10 !-mt-8 !text-${config.icon.enabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]:
[`@apply !-ms-10 !-mt-7 !text-${config.icon.enabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]:
{},
},
[`.${prefix}listbox-button ~ .${prefix}label-float`]: {
Expand All @@ -614,12 +614,12 @@ export default plugin.withOptions(
[`&.${prefix}listbox-label-float:not(.${prefix}has-icon).${prefix}listbox-lg`]:
{
[`.${prefix}label-float`]: {
[`@apply start-3 -ms-3 -mt-8 text-${config.icon.disabled.label.float.lg.font.size.base} text-transparent`]:
[`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.lg.font.size.base} text-transparent`]:
{},
},
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]:
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]:
{
[`@apply !-ms-3 !-mt-9 !text-${config.icon.disabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]:
[`@apply !-ms-3 !-mt-7 !text-${config.icon.disabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]:
{},
},
[`.${prefix}listbox-button ~ .${prefix}label-float`]: {
Expand All @@ -631,12 +631,12 @@ export default plugin.withOptions(
[`&.${prefix}listbox-label-float.${prefix}has-icon.${prefix}listbox-lg`]:
{
[`.${prefix}label-float`]: {
[`@apply start-11 -ms-10 -mt-8 text-${config.icon.enabled.label.float.lg.font.size.base} text-transparent`]:
[`@apply start-11 -ms-10 -mt-7 text-${config.icon.enabled.label.float.lg.font.size.base} text-transparent`]:
{},
},
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]:
[`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]:
{
[`@apply !-ms-10 !-mt-9 !text-${config.icon.enabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]:
[`@apply !-ms-10 !-mt-7 !text-${config.icon.enabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]:
{},
},
[`.${prefix}listbox-button ~ .${prefix}label-float`]: {
Expand Down

0 comments on commit 917b0bd

Please sign in to comment.