changed button styles in ratios

This commit is contained in:
Mamalizz
2025-03-13 01:32:55 +03:30
parent 1832ec131a
commit 045468f041
+16 -16
View File
@@ -1,21 +1,21 @@
@utility btn-xl { @utility btn-xl {
@apply typo-label-lg py-4 px-6 gap-3; @apply typo-label-lg py-4 px-5 lg:px-6 gap-3;
svg { svg {
@apply size-[20px] @apply size-[20px];
} }
} }
@utility btn-lg { @utility btn-lg {
@apply typo-label-md py-3 px-4 gap-2.5; @apply typo-label-md py-3 px-3 lg:px-4 gap-2.5;
svg { svg {
@apply size-[20px] @apply size-[20px];
} }
} }
@utility btn-md { @utility btn-md {
@apply typo-label-sm py-[10px] px-[14px] gap-2; @apply typo-label-sm py-[6px] lg:py-[10px] px-[10px] lg:px-[14px] gap-2;
svg { svg {
@apply size-[16px] @apply size-[16px];
} }
} }
@@ -23,14 +23,14 @@
@apply text-white bg-black border-[1.5px] border-transparent; @apply text-white bg-black border-[1.5px] border-transparent;
@apply btn-lg; @apply btn-lg;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-white; @apply stroke-white;
} }
&:hover { &:hover {
@apply bg-white border-black text-black; @apply bg-white border-black text-black;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-black; @apply stroke-black;
} }
} }
@@ -38,7 +38,7 @@
&:disabled { &:disabled {
@apply bg-slate-100 text-slate-400; @apply bg-slate-100 text-slate-400;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-slate-400; @apply stroke-slate-400;
} }
} }
@@ -48,7 +48,7 @@
@apply text-black bg-slate-100; @apply text-black bg-slate-100;
@apply btn-lg; @apply btn-lg;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-black; @apply stroke-black;
} }
@@ -59,7 +59,7 @@
&:disabled { &:disabled {
@apply bg-slate-100 text-slate-400; @apply bg-slate-100 text-slate-400;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-slate-400; @apply stroke-slate-400;
} }
} }
@@ -69,7 +69,7 @@
@apply text-black border-[1.5px] border-slate-200; @apply text-black border-[1.5px] border-slate-200;
@apply btn-lg; @apply btn-lg;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-black; @apply stroke-black;
} }
@@ -80,7 +80,7 @@
&:disabled { &:disabled {
@apply text-slate-300; @apply text-slate-300;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-slate-300; @apply stroke-slate-300;
} }
} }
@@ -90,14 +90,14 @@
@apply text-black bg-white; @apply text-black bg-white;
@apply btn-lg; @apply btn-lg;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-black; @apply stroke-black;
} }
&:hover { &:hover {
@apply text-slate-500; @apply text-slate-500;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-slate-500; @apply stroke-slate-500;
} }
} }
@@ -105,7 +105,7 @@
&:disabled { &:disabled {
@apply text-slate-400; @apply text-slate-400;
svg[class~=iconify] path { svg[class~="iconify"] path {
@apply stroke-slate-400; @apply stroke-slate-400;
} }
} }