1 line
2.5 KiB
JavaScript
1 line
2.5 KiB
JavaScript
export default {".label":{"display":"inline-flex","align-items":"center","gap":"calc(0.25rem * 1.5)","white-space":"nowrap","color":"color-mix(in oklab, currentColor 60%, transparent)","&:has(input)":{"cursor":"pointer"},"&:is(.input > *, .select > *)":{"display":"flex","height":"calc(100% - 0.5rem)","align-items":"center","padding-inline":"calc(0.25rem * 3)","white-space":"nowrap","font-size":"inherit","&:first-child":{"margin-inline-start":"calc(0.25rem * -3)","margin-inline-end":"calc(0.25rem * 3)","border-inline-end":"var(--border) solid color-mix(in oklab, currentColor 10%, #0000)"},"&:last-child":{"margin-inline-start":"calc(0.25rem * 3)","margin-inline-end":"calc(0.25rem * -3)","border-inline-start":"var(--border) solid color-mix(in oklab, currentColor 10%, #0000)"}}},".floating-label":{"position":"relative","display":"block","input":{"display":"block","&::placeholder":{"transition":"top 0.1s ease-out, translate 0.1s ease-out, scale 0.1s ease-out, opacity 0.1s ease-out"}},"textarea":{"&::placeholder":{"transition":"top 0.1s ease-out, translate 0.1s ease-out, scale 0.1s ease-out, opacity 0.1s ease-out"}},"> span":{"position":"absolute","inset-inline-start":"calc(0.25rem * 3)","z-index":1,"background-color":"var(--color-base-100)","padding-inline":"calc(0.25rem * 1)","opacity":"0%","font-size":"0.875rem","top":"calc(var(--size-field, 0.25rem) * 10 / 2)","line-height":1,"border-radius":"2px","pointer-events":"none","translate":"0 -50%","transition":"top 0.1s ease-out, translate 0.1s ease-out, scale 0.1s ease-out, opacity 0.1s ease-out"},"&:focus-within, &:not(:has(input:placeholder-shown, textarea:placeholder-shown))":{"::placeholder":{"opacity":"0%","top":"0","translate":"-12.5% calc(-50% - 0.125em)","scale":"0.75","pointer-events":"auto"},"> span":{"opacity":"100%","top":"0","translate":"-12.5% calc(-50% - 0.125em)","scale":"0.75","pointer-events":"auto"}},"&:has(:disabled, [disabled])":{"> span":{"opacity":"0%"}},"&:has(.input-xs, .select-xs, .textarea-xs) span":{"font-size":"0.6875rem","top":"calc(var(--size-field, 0.25rem) * 6 / 2)"},"&:has(.input-sm, .select-sm, .textarea-sm) span":{"font-size":"0.75rem","top":"calc(var(--size-field, 0.25rem) * 8 / 2)"},"&:has(.input-md, .select-md, .textarea-md) span":{"font-size":"0.875rem","top":"calc(var(--size-field, 0.25rem) * 10 / 2)"},"&:has(.input-lg, .select-lg, .textarea-lg) span":{"font-size":"1.125rem","top":"calc(var(--size-field, 0.25rem) * 12 / 2)"},"&:has(.input-xl, .select-xl, .textarea-xl) span":{"font-size":"1.375rem","top":"calc(var(--size-field, 0.25rem) * 14 / 2)"}}}; |