daisyui/components/otp/object.js

daisyUI 5 - The Tailwind CSS Component Library

export default {"@layer daisyui.l1.l2.l3":{".otp":{"position":"relative","display":"inline-flex","font-family":"var(--font-mono)","direction":"ltr","clip-path":"inset(-3.5px 3.5px -3.5px -3.5px)","border-radius":"var(--radius-field)","font-size":"1.75rem","gap":"var(--otp-gap)","--input-color":"color-mix(in oklab, var(--color-base-content) 20%, #0000)","--otp-ch":"1ch","--otp-gap":"calc(var(--otp-ch) * 0.5)","--otp-w":"calc(var(--otp-ch) * 2)","--otp-size":"calc(var(--size-field, 0.25rem) * 10)","--stride":"calc(var(--otp-w) + var(--otp-gap))"},"@supports (font: -apple-system-body)":{".otp":{"--otp-ch":"0.618164em"}},".otp > input":{"pointer-events":"none","inset-inline-start":"calc(0.25rem * 0)","z-index":1,"margin":"0px","appearance":"none","border-style":"var(--tw-border-style)","border-width":"0px","background-color":"transparent","padding":"0px","outline-style":"var(--tw-outline-style)","outline-width":"0px","field-sizing":"content","padding-inline-start":"calc(var(--otp-ch) * 0.5 + var(--border))","line-height":1,"letter-spacing":"calc(var(--stride) - var(--otp-ch))","font-variant-numeric":"tabular-nums","&::selection":{"background-color":"transparent","color":"color-mix(in oklab, var(--color-base-content) 20%, #0000)"},"&:valid":{"caret-color":"transparent"}},".otp:has( > span:nth-child(1))":{"width":"calc(var(--stride) * 1)"},".otp:has( > span:nth-child(2))":{"width":"calc(var(--stride) * 2)"},".otp:has( > span:nth-child(3))":{"width":"calc(var(--stride) * 3)"},".otp:has( > span:nth-child(4))":{"width":"calc(var(--stride) * 4)"},".otp:has( > span:nth-child(5))":{"width":"calc(var(--stride) * 5)"},".otp:has( > span:nth-child(6))":{"width":"calc(var(--stride) * 6)"},".otp:has( > span:nth-child(7))":{"width":"calc(var(--stride) * 7)"},".otp:has( > span:nth-child(8))":{"width":"calc(var(--stride) * 8)"},".otp > span":{"position":"absolute","display":"flex","transition-property":"color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to","transition-timing-function":"var(--tw-ease, var(--default-transition-timing-function))","transition-duration":"var(--tw-duration, var(--default-transition-duration))","transition":"border-color 0.2s","inline-size":"var(--otp-w)","block-size":"var(--otp-size)","background-color":"var(--color-base-100)","border":"var(--border) solid var(--input-color)","border-radius":"inherit","outline":"2px solid #0000","outline-offset":"1px","box-shadow":"0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), #0000) inset, 0 -1px oklch(100% 0 0 / calc(var(--depth) * 0.1)) inset","&:nth-child(1)":{"left":"1px","@supports (font: -apple-system-body)":{"left":"2px"},"@supports (-moz-appearance: none)":{"left":"0px"}},"&:nth-child(2)":{"left":"calc(var(--stride) * 1)","transition-delay":"0.02s"},"&:nth-child(3)":{"left":"calc(var(--stride) * 2)","transition-delay":"0.04s"},"&:nth-child(4)":{"left":"calc(var(--stride) * 3)","transition-delay":"0.06s"},"&:nth-child(5)":{"left":"calc(var(--stride) * 4)","transition-delay":"0.08s"},"&:nth-child(6)":{"left":"calc(var(--stride) * 5)","transition-delay":"0.1s"},"&:nth-child(7)":{"left":"calc(var(--stride) * 6)","transition-delay":"0.12s"},"&:nth-child(8)":{"left":"calc(var(--stride) * 7)","transition-delay":"0.14s"}},".otp:has(input:valid:focus) > span":{"outline":"2px solid var(--input-color)","outline-offset":"1px"},".otp:has(input:valid:focus):after":{"opacity":0},".otp:after":{"flex-shrink":0,"content":"\"\"","width":"var(--otp-w)","height":"var(--otp-size)","border-radius":"var(--radius-field)","outline":"2px solid #0000","outline-offset":"1px","z-index":10,"margin-inline-start":"calc(-1 * (var(--otp-gap) + var(--otp-ch) * 0.5 + var(--border)))"},".otp:focus-within":{"--input-color":"var(--color-base-content)","> span":{"box-shadow":"0 1px color-mix(in oklab, var(--input-color) calc(var(--depth) * 10%), #0000)"},"&:after":{"outline-color":"var(--input-color)"}}},".otp-joined":{"--otp-gap":"0rem","clip-path":"inset(-3.5px 0 -3.5px -3.5px)","> span":{"&:first-of-type":{"border-start-end-radius":"0","border-end-end-radius":"0"},"&:not(&:last-of-type)":{"border-inline-end-style":"var(--tw-border-style)","border-inline-end-width":"0px"},"&:not(&:first-of-type, &:last-of-type)":{"border-radius":"0"},"&:last-of-type":{"border-start-start-radius":"0","border-end-start-radius":"0"}},"&:after":{"outline-offset":"calc((-1 * var(--border)) - 3px)","@supports (font: -apple-system-body)":{"--otp-w":"calc(var(--otp-ch) * 2 - 1px)"}},"&:has(input:valid:focus)":{"> span":{"outline-offset":"calc((-1 * var(--border)) - 3px)"}}},"@layer daisyui.l1.l2":{".otp-xs":{"font-size":"1.25rem","--otp-size":"calc(var(--size-field, 0.25rem) * 6)"},".otp-sm":{"font-size":"1.5rem","--otp-size":"calc(var(--size-field, 0.25rem) * 8)"},".otp-md":{"font-size":"1.75rem","--otp-size":"calc(var(--size-field, 0.25rem) * 10)"},".otp-lg":{"font-size":"2rem","--otp-size":"calc(var(--size-field, 0.25rem) * 12)"},".otp-xl":{"font-size":"2.5rem","--otp-size":"calc(var(--size-field, 0.25rem) * 14)"},":is(.otp-neutral), .otp-neutral:focus, .otp-neutral:focus-within":{"--input-color":"var(--color-neutral)"},":is(.otp-primary), .otp-primary:focus, .otp-primary:focus-within":{"--input-color":"var(--color-primary)"},":is(.otp-secondary), .otp-secondary:focus, .otp-secondary:focus-within":{"--input-color":"var(--color-secondary)"},":is(.otp-accent), .otp-accent:focus, .otp-accent:focus-within":{"--input-color":"var(--color-accent)"},":is(.otp-info), .otp-info:focus, .otp-info:focus-within":{"--input-color":"var(--color-info)"},":is(.otp-success), .otp-success:focus, .otp-success:focus-within":{"--input-color":"var(--color-success)"},":is(.otp-warning), .otp-warning:focus, .otp-warning:focus-within":{"--input-color":"var(--color-warning)"},":is(.otp-error), .otp-error:focus, .otp-error:focus-within":{"--input-color":"var(--color-error)"}}};