@arolariu/components
Version:
🎨 70+ beautiful, accessible React components built on Base UI. TypeScript-first, CSS Modules styling, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡
136 lines (112 loc) • 2.65 kB
CSS
.backdrop-VkyRGX {
transition: opacity var(--ac-transition-normal);
z-index: 50;
background-color: #0000008c;
position: fixed;
inset: 0;
@supports (-webkit-touch-callout: none) {
position: absolute;
}
}
.backdrop-VkyRGX[data-ending-style], .backdrop-VkyRGX[data-starting-style] {
opacity: 0;
}
.popup-JBJXE4 {
background-color: var(--ac-background);
color: var(--ac-foreground);
gap: var(--ac-space-4);
padding: var(--ac-space-6);
transition: transform var(--ac-transition-normal),opacity var(--ac-transition-normal);
z-index: 51;
flex-direction: column;
display: flex;
position: fixed;
box-shadow: 0 20px 40px -12px #00000059;
}
.popup-JBJXE4[data-ending-style], .popup-JBJXE4[data-starting-style] {
opacity: 0;
}
.top-ukwtm_ {
border-bottom: 1px solid var(--ac-border);
inset: 0 0 auto;
}
.top-ukwtm_[data-ending-style], .top-ukwtm_[data-starting-style] {
transform: translateY(-1rem);
}
.bottom-RJwkPL {
border-top: 1px solid var(--ac-border);
inset: auto 0 0;
}
.bottom-RJwkPL[data-ending-style], .bottom-RJwkPL[data-starting-style] {
transform: translateY(1rem);
}
.left-MvaGwC {
border-right: 1px solid var(--ac-border);
width: min(24rem, 85vw);
inset: 0 auto 0 0;
}
.left-MvaGwC[data-ending-style], .left-MvaGwC[data-starting-style] {
transform: translateX(-1rem);
}
.right-sVFzjE {
border-left: 1px solid var(--ac-border);
width: min(24rem, 85vw);
inset: 0 0 0 auto;
}
.right-sVFzjE[data-ending-style], .right-sVFzjE[data-starting-style] {
transform: translateX(1rem);
}
.close-I3VVge {
border-radius: var(--ac-radius-sm);
color: var(--ac-muted-foreground);
cursor: pointer;
height: 1.75rem;
right: var(--ac-space-3);
top: var(--ac-space-3);
background: none;
border: none;
outline: none;
justify-content: center;
align-items: center;
width: 1.75rem;
display: inline-flex;
position: absolute;
}
.close-I3VVge:focus-visible {
outline: 2px solid var(--ac-ring);
outline-offset: 2px;
}
.closeIcon-FodnBj {
width: 1rem;
height: 1rem;
}
.header-jaGMz3 {
text-align: center;
flex-direction: column;
}
.footer-N1eq9e, .header-jaGMz3 {
gap: var(--ac-space-2);
display: flex;
}
.footer-N1eq9e {
flex-direction: column-reverse;
margin-top: auto;
}
@media (width >= 640px) {
.header-jaGMz3 {
text-align: left;
}
.footer-N1eq9e {
flex-direction: row;
justify-content: flex-end;
}
}
.title-KpmBJL {
font-size: var(--ac-text-lg);
font-weight: 600;
}
.description-fHnPmM {
color: var(--ac-muted-foreground);
font-size: var(--ac-text-sm);
}
/*# sourceMappingURL=sheet_module.css.map */