daisyui/components/aura.css

daisyUI 5 - The Tailwind CSS Component Library

/*! 🌼 daisyUI 5.6.3 - MIT License */ @layer utilities{.aura{@layer daisyui.l1.l2.l3{--aura-padding:.125rem;padding:var(--aura-padding);border-radius:calc(var(--aura-padding) + var(--aura-radius,var(--radius-box)));animation:aura var(--tw-duration,6s) linear infinite;background-image:conic-gradient(from var(--aura-angle), transparent 225deg, currentColor);display:inline-block;position:relative;&:has(>.card,>.alert){--aura-radius:var(--radius-box)}&:has(>.btn,>.input,>.select){--aura-radius:var(--radius-field)}&:has(>.checkbox,>.toggle,>.badge){--aura-radius:var(--radius-selector)}&:before,&:after{animation:inherit;background-color:inherit;background-image:inherit;border-radius:inherit;z-index:0;opacity:.7;filter:blur(.25rem);content:"";width:100%;height:100%;display:block;position:absolute;top:50%;left:50%;translate:-50% -50%}&:after{opacity:.3;filter:blur(1rem)}&>*{z-index:1;position:relative}}}.aura-rainbow{@layer daisyui.l1.l2{background:conic-gradient(from var(--aura-angle) in oklch longer hue, transparent 10%, oklch(80% .15 0), oklch(80% .15 360), transparent 90%)}}.aura-holo{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(82% .17 327), oklch(75% .12 274), oklch(82% .11 191), oklch(91% .11 105), oklch(88% .08 68), oklch(82% .17 327) 10%);animation:aura var(--tw-duration,20s) linear infinite}}.aura-dual{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), transparent 0%, transparent 40%, currentColor 50%)}}.aura-silver{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(30% 0 0), oklch(90% 0 0), oklch(60% 0 0), oklch(90% 0 0), oklch(50% 0 0), oklch(30% 0 0) 50%)}}.aura-gold{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(65.98% .1863 72.37), oklch(96.35% .0768 102.94), oklch(71.57% .1691 82.23), oklch(96.02% .0792 103.13), oklch(60.66% .1181 76.17), oklch(65.98% .1863 72.37) 50%)}}.aura-glow{@layer daisyui.l1.l2{background-image:radial-gradient(closest-corner,currentColor 0%,#0000 90%);animation:none;&:before{animation:aura-glow var(--tw-duration,6s) ease-out infinite}&:after{animation:aura-glow-after var(--tw-duration,6s) ease-out infinite}}}.aura-xs{@layer daisyui.l1.l2{--aura-padding:0rem}}.aura-sm{@layer daisyui.l1.l2{--aura-padding:.0625rem}}.aura-md{@layer daisyui.l1.l2{--aura-padding:.125rem}}.aura-lg{@layer daisyui.l1.l2{--aura-padding:.15625rem}}.aura-xl{@layer daisyui.l1.l2{--aura-padding:.25rem}}@keyframes aura{to{--aura-angle:360deg;transform:translateZ(1px)}}@keyframes aura-glow{20%,80%{opacity:.7;filter:blur(.25rem)}50%{opacity:1;filter:blur(.75rem)}}@keyframes aura-glow-after{20%,80%{opacity:.3;filter:blur(1rem)}50%{opacity:.6;filter:blur(1.5rem)}}@media (width>=640px){.sm\:aura{@layer daisyui.l1.l2.l3{--aura-padding:.125rem;padding:var(--aura-padding);border-radius:calc(var(--aura-padding) + var(--aura-radius,var(--radius-box)));animation:aura var(--tw-duration,6s) linear infinite;background-image:conic-gradient(from var(--aura-angle), transparent 225deg, currentColor);display:inline-block;position:relative;&:has(>.card,>.alert){--aura-radius:var(--radius-box)}&:has(>.btn,>.input,>.select){--aura-radius:var(--radius-field)}&:has(>.checkbox,>.toggle,>.badge){--aura-radius:var(--radius-selector)}&:before,&:after{animation:inherit;background-color:inherit;background-image:inherit;border-radius:inherit;z-index:0;opacity:.7;filter:blur(.25rem);content:"";width:100%;height:100%;display:block;position:absolute;top:50%;left:50%;translate:-50% -50%}&:after{opacity:.3;filter:blur(1rem)}&>*{z-index:1;position:relative}}}.sm\:aura-rainbow{@layer daisyui.l1.l2{background:conic-gradient(from var(--aura-angle) in oklch longer hue, transparent 10%, oklch(80% .15 0), oklch(80% .15 360), transparent 90%)}}.sm\:aura-holo{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(82% .17 327), oklch(75% .12 274), oklch(82% .11 191), oklch(91% .11 105), oklch(88% .08 68), oklch(82% .17 327) 10%);animation:aura var(--tw-duration,20s) linear infinite}}.sm\:aura-dual{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), transparent 0%, transparent 40%, currentColor 50%)}}.sm\:aura-silver{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(30% 0 0), oklch(90% 0 0), oklch(60% 0 0), oklch(90% 0 0), oklch(50% 0 0), oklch(30% 0 0) 50%)}}.sm\:aura-gold{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(65.98% .1863 72.37), oklch(96.35% .0768 102.94), oklch(71.57% .1691 82.23), oklch(96.02% .0792 103.13), oklch(60.66% .1181 76.17), oklch(65.98% .1863 72.37) 50%)}}.sm\:aura-glow{@layer daisyui.l1.l2{background-image:radial-gradient(closest-corner,currentColor 0%,#0000 90%);animation:none;&:before{animation:aura-glow var(--tw-duration,6s) ease-out infinite}&:after{animation:aura-glow-after var(--tw-duration,6s) ease-out infinite}}}.sm\:aura-xs{@layer daisyui.l1.l2{--aura-padding:0rem}}.sm\:aura-sm{@layer daisyui.l1.l2{--aura-padding:.0625rem}}.sm\:aura-md{@layer daisyui.l1.l2{--aura-padding:.125rem}}.sm\:aura-lg{@layer daisyui.l1.l2{--aura-padding:.15625rem}}.sm\:aura-xl{@layer daisyui.l1.l2{--aura-padding:.25rem}}}@media (width>=768px){.md\:aura{@layer daisyui.l1.l2.l3{--aura-padding:.125rem;padding:var(--aura-padding);border-radius:calc(var(--aura-padding) + var(--aura-radius,var(--radius-box)));animation:aura var(--tw-duration,6s) linear infinite;background-image:conic-gradient(from var(--aura-angle), transparent 225deg, currentColor);display:inline-block;position:relative;&:has(>.card,>.alert){--aura-radius:var(--radius-box)}&:has(>.btn,>.input,>.select){--aura-radius:var(--radius-field)}&:has(>.checkbox,>.toggle,>.badge){--aura-radius:var(--radius-selector)}&:before,&:after{animation:inherit;background-color:inherit;background-image:inherit;border-radius:inherit;z-index:0;opacity:.7;filter:blur(.25rem);content:"";width:100%;height:100%;display:block;position:absolute;top:50%;left:50%;translate:-50% -50%}&:after{opacity:.3;filter:blur(1rem)}&>*{z-index:1;position:relative}}}.md\:aura-rainbow{@layer daisyui.l1.l2{background:conic-gradient(from var(--aura-angle) in oklch longer hue, transparent 10%, oklch(80% .15 0), oklch(80% .15 360), transparent 90%)}}.md\:aura-holo{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(82% .17 327), oklch(75% .12 274), oklch(82% .11 191), oklch(91% .11 105), oklch(88% .08 68), oklch(82% .17 327) 10%);animation:aura var(--tw-duration,20s) linear infinite}}.md\:aura-dual{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), transparent 0%, transparent 40%, currentColor 50%)}}.md\:aura-silver{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(30% 0 0), oklch(90% 0 0), oklch(60% 0 0), oklch(90% 0 0), oklch(50% 0 0), oklch(30% 0 0) 50%)}}.md\:aura-gold{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(65.98% .1863 72.37), oklch(96.35% .0768 102.94), oklch(71.57% .1691 82.23), oklch(96.02% .0792 103.13), oklch(60.66% .1181 76.17), oklch(65.98% .1863 72.37) 50%)}}.md\:aura-glow{@layer daisyui.l1.l2{background-image:radial-gradient(closest-corner,currentColor 0%,#0000 90%);animation:none;&:before{animation:aura-glow var(--tw-duration,6s) ease-out infinite}&:after{animation:aura-glow-after var(--tw-duration,6s) ease-out infinite}}}.md\:aura-xs{@layer daisyui.l1.l2{--aura-padding:0rem}}.md\:aura-sm{@layer daisyui.l1.l2{--aura-padding:.0625rem}}.md\:aura-md{@layer daisyui.l1.l2{--aura-padding:.125rem}}.md\:aura-lg{@layer daisyui.l1.l2{--aura-padding:.15625rem}}.md\:aura-xl{@layer daisyui.l1.l2{--aura-padding:.25rem}}}@media (width>=1024px){.lg\:aura{@layer daisyui.l1.l2.l3{--aura-padding:.125rem;padding:var(--aura-padding);border-radius:calc(var(--aura-padding) + var(--aura-radius,var(--radius-box)));animation:aura var(--tw-duration,6s) linear infinite;background-image:conic-gradient(from var(--aura-angle), transparent 225deg, currentColor);display:inline-block;position:relative;&:has(>.card,>.alert){--aura-radius:var(--radius-box)}&:has(>.btn,>.input,>.select){--aura-radius:var(--radius-field)}&:has(>.checkbox,>.toggle,>.badge){--aura-radius:var(--radius-selector)}&:before,&:after{animation:inherit;background-color:inherit;background-image:inherit;border-radius:inherit;z-index:0;opacity:.7;filter:blur(.25rem);content:"";width:100%;height:100%;display:block;position:absolute;top:50%;left:50%;translate:-50% -50%}&:after{opacity:.3;filter:blur(1rem)}&>*{z-index:1;position:relative}}}.lg\:aura-rainbow{@layer daisyui.l1.l2{background:conic-gradient(from var(--aura-angle) in oklch longer hue, transparent 10%, oklch(80% .15 0), oklch(80% .15 360), transparent 90%)}}.lg\:aura-holo{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(82% .17 327), oklch(75% .12 274), oklch(82% .11 191), oklch(91% .11 105), oklch(88% .08 68), oklch(82% .17 327) 10%);animation:aura var(--tw-duration,20s) linear infinite}}.lg\:aura-dual{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), transparent 0%, transparent 40%, currentColor 50%)}}.lg\:aura-silver{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(30% 0 0), oklch(90% 0 0), oklch(60% 0 0), oklch(90% 0 0), oklch(50% 0 0), oklch(30% 0 0) 50%)}}.lg\:aura-gold{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(65.98% .1863 72.37), oklch(96.35% .0768 102.94), oklch(71.57% .1691 82.23), oklch(96.02% .0792 103.13), oklch(60.66% .1181 76.17), oklch(65.98% .1863 72.37) 50%)}}.lg\:aura-glow{@layer daisyui.l1.l2{background-image:radial-gradient(closest-corner,currentColor 0%,#0000 90%);animation:none;&:before{animation:aura-glow var(--tw-duration,6s) ease-out infinite}&:after{animation:aura-glow-after var(--tw-duration,6s) ease-out infinite}}}.lg\:aura-xs{@layer daisyui.l1.l2{--aura-padding:0rem}}.lg\:aura-sm{@layer daisyui.l1.l2{--aura-padding:.0625rem}}.lg\:aura-md{@layer daisyui.l1.l2{--aura-padding:.125rem}}.lg\:aura-lg{@layer daisyui.l1.l2{--aura-padding:.15625rem}}.lg\:aura-xl{@layer daisyui.l1.l2{--aura-padding:.25rem}}}@media (width>=1280px){.xl\:aura{@layer daisyui.l1.l2.l3{--aura-padding:.125rem;padding:var(--aura-padding);border-radius:calc(var(--aura-padding) + var(--aura-radius,var(--radius-box)));animation:aura var(--tw-duration,6s) linear infinite;background-image:conic-gradient(from var(--aura-angle), transparent 225deg, currentColor);display:inline-block;position:relative;&:has(>.card,>.alert){--aura-radius:var(--radius-box)}&:has(>.btn,>.input,>.select){--aura-radius:var(--radius-field)}&:has(>.checkbox,>.toggle,>.badge){--aura-radius:var(--radius-selector)}&:before,&:after{animation:inherit;background-color:inherit;background-image:inherit;border-radius:inherit;z-index:0;opacity:.7;filter:blur(.25rem);content:"";width:100%;height:100%;display:block;position:absolute;top:50%;left:50%;translate:-50% -50%}&:after{opacity:.3;filter:blur(1rem)}&>*{z-index:1;position:relative}}}.xl\:aura-rainbow{@layer daisyui.l1.l2{background:conic-gradient(from var(--aura-angle) in oklch longer hue, transparent 10%, oklch(80% .15 0), oklch(80% .15 360), transparent 90%)}}.xl\:aura-holo{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(82% .17 327), oklch(75% .12 274), oklch(82% .11 191), oklch(91% .11 105), oklch(88% .08 68), oklch(82% .17 327) 10%);animation:aura var(--tw-duration,20s) linear infinite}}.xl\:aura-dual{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), transparent 0%, transparent 40%, currentColor 50%)}}.xl\:aura-silver{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(30% 0 0), oklch(90% 0 0), oklch(60% 0 0), oklch(90% 0 0), oklch(50% 0 0), oklch(30% 0 0) 50%)}}.xl\:aura-gold{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(65.98% .1863 72.37), oklch(96.35% .0768 102.94), oklch(71.57% .1691 82.23), oklch(96.02% .0792 103.13), oklch(60.66% .1181 76.17), oklch(65.98% .1863 72.37) 50%)}}.xl\:aura-glow{@layer daisyui.l1.l2{background-image:radial-gradient(closest-corner,currentColor 0%,#0000 90%);animation:none;&:before{animation:aura-glow var(--tw-duration,6s) ease-out infinite}&:after{animation:aura-glow-after var(--tw-duration,6s) ease-out infinite}}}.xl\:aura-xs{@layer daisyui.l1.l2{--aura-padding:0rem}}.xl\:aura-sm{@layer daisyui.l1.l2{--aura-padding:.0625rem}}.xl\:aura-md{@layer daisyui.l1.l2{--aura-padding:.125rem}}.xl\:aura-lg{@layer daisyui.l1.l2{--aura-padding:.15625rem}}.xl\:aura-xl{@layer daisyui.l1.l2{--aura-padding:.25rem}}}@media (width>=1536px){.\32 xl\:aura{@layer daisyui.l1.l2.l3{--aura-padding:.125rem;padding:var(--aura-padding);border-radius:calc(var(--aura-padding) + var(--aura-radius,var(--radius-box)));animation:aura var(--tw-duration,6s) linear infinite;background-image:conic-gradient(from var(--aura-angle), transparent 225deg, currentColor);display:inline-block;position:relative;&:has(>.card,>.alert){--aura-radius:var(--radius-box)}&:has(>.btn,>.input,>.select){--aura-radius:var(--radius-field)}&:has(>.checkbox,>.toggle,>.badge){--aura-radius:var(--radius-selector)}&:before,&:after{animation:inherit;background-color:inherit;background-image:inherit;border-radius:inherit;z-index:0;opacity:.7;filter:blur(.25rem);content:"";width:100%;height:100%;display:block;position:absolute;top:50%;left:50%;translate:-50% -50%}&:after{opacity:.3;filter:blur(1rem)}&>*{z-index:1;position:relative}}}.\32 xl\:aura-rainbow{@layer daisyui.l1.l2{background:conic-gradient(from var(--aura-angle) in oklch longer hue, transparent 10%, oklch(80% .15 0), oklch(80% .15 360), transparent 90%)}}.\32 xl\:aura-holo{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(82% .17 327), oklch(75% .12 274), oklch(82% .11 191), oklch(91% .11 105), oklch(88% .08 68), oklch(82% .17 327) 10%);animation:aura var(--tw-duration,20s) linear infinite}}.\32 xl\:aura-dual{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), transparent 0%, transparent 40%, currentColor 50%)}}.\32 xl\:aura-silver{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(30% 0 0), oklch(90% 0 0), oklch(60% 0 0), oklch(90% 0 0), oklch(50% 0 0), oklch(30% 0 0) 50%)}}.\32 xl\:aura-gold{@layer daisyui.l1.l2{background-image:repeating-conic-gradient(from var(--aura-angle), oklch(65.98% .1863 72.37), oklch(96.35% .0768 102.94), oklch(71.57% .1691 82.23), oklch(96.02% .0792 103.13), oklch(60.66% .1181 76.17), oklch(65.98% .1863 72.37) 50%)}}.\32 xl\:aura-glow{@layer daisyui.l1.l2{background-image:radial-gradient(closest-corner,currentColor 0%,#0000 90%);animation:none;&:before{animation:aura-glow var(--tw-duration,6s) ease-out infinite}&:after{animation:aura-glow-after var(--tw-duration,6s) ease-out infinite}}}.\32 xl\:aura-xs{@layer daisyui.l1.l2{--aura-padding:0rem}}.\32 xl\:aura-sm{@layer daisyui.l1.l2{--aura-padding:.0625rem}}.\32 xl\:aura-md{@layer daisyui.l1.l2{--aura-padding:.125rem}}.\32 xl\:aura-lg{@layer daisyui.l1.l2{--aura-padding:.15625rem}}.\32 xl\:aura-xl{@layer daisyui.l1.l2{--aura-padding:.25rem}}}}