@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! ⚡
1 lines • 2.66 kB
Source Map (JSON)
{"version":3,"sources":["webpack://./src/components/ui/alert-dialog.module.css"],"names":[],"mappings":"AAAA;EACE,kBAAkB;EAClB,kBAAkB;EAClB,+CAA+C;EAC/C,WAAW;EACX,2BAA2B;EAC3B,eAAe;EACf,QAAQ;;EAER;IACE,kBAAA;EACF;;EAEA;IACE,UAAU;EACZ;AACF;;AAGA;EAAE,sCAAsC;EACtC,kCAAkC;EAClC,kCAAkC;EAClC,2BAA2B;EAC3B,sBAAsB;EACtB,0BAA0B;EAC1B,qFAAqF;EACrF,WAAW;EACX,+BAA+B;EAC/B,aAAa;EACb,eAAe;EACf,QAAQ;EACR,SAAS;EACT,gCAAgC;EAChC,uCAAuC;AACzC;;AAGA;EAAE,UAAU;EACV,2CAA2C;AAC7C;;AAIA;EADE,kBAAkB;EAClB,sBAAsB;AACxB;;AAMA;EAHE,sBAAsB;EACtB,aAAa;AACf;;AACA;EAEE,8BAA8B;AAChC;;AAGA;EACE;IAAE,gBAAgB;EAClB;;EAGA;IAAE,mBAAmB;IACnB,yBAAyB;EAC3B;AACF;;AAGA;EAAE,4BAA4B;EAC5B,gBAAgB;EAChB,iBAAiB;AACnB;;AAGA;EAAE,iCAAiC;EACjC,4BAA4B;AAC9B;;AAGA;EAAE,6BAA6B;AAC/B;;AAGA;EACE;IAAE,aAAa;EACf;AACF","sourcesContent":[".backdrop {\r\n position: fixed;\r\n inset: 0;\r\n z-index: 50;\r\n min-height: 100dvh;\r\n background-color: rgb(0 0 0 / 0.55);\r\n transition: opacity var(--ac-transition-normal);\r\n touch-action: none;\r\n\r\n @supports (-webkit-touch-callout: none) {\r\n position: absolute;\r\n }\r\n\r\n &[data-starting-style],\r\n &[data-ending-style] {\r\n opacity: 0;\r\n }\r\n}\r\n\r\n.popup {\r\n position: fixed;\r\n top: 50%;\r\n left: 50%;\r\n z-index: 51;\r\n display: grid;\r\n width: min(32rem, calc(100vw - 2rem));\r\n gap: var(--ac-space-4);\r\n padding: var(--ac-space-6);\r\n border: 1px solid var(--ac-border);\r\n border-radius: var(--ac-radius-lg);\r\n background-color: var(--ac-background);\r\n color: var(--ac-foreground);\r\n box-shadow: 0 20px 40px -12px rgb(0 0 0 / 0.25);\r\n transform: translate(-50%, -50%);\r\n transition: opacity var(--ac-transition-normal), transform var(--ac-transition-normal);\r\n}\r\n\r\n.popup[data-starting-style],\r\n.popup[data-ending-style] {\r\n opacity: 0;\r\n transform: translate(-50%, -50%) scale(0.96);\r\n}\r\n\r\n.header {\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--ac-space-2);\r\n text-align: center;\r\n}\r\n\r\n.footer {\r\n display: flex;\r\n flex-direction: column-reverse;\r\n gap: var(--ac-space-2);\r\n}\r\n\r\n@media (min-width: 640px) {\r\n .header {\r\n text-align: left;\r\n }\r\n\r\n .footer {\r\n flex-direction: row;\r\n justify-content: flex-end;\r\n }\r\n}\r\n\r\n.title {\r\n font-size: var(--ac-text-lg);\r\n font-weight: 600;\r\n line-height: 1.25;\r\n}\r\n\r\n.description {\r\n color: var(--ac-muted-foreground);\r\n font-size: var(--ac-text-sm);\r\n}\r\n\r\n.cancel {\r\n margin-top: var(--ac-space-2);\r\n}\r\n\r\n@media (min-width: 640px) {\r\n .cancel {\r\n margin-top: 0;\r\n }\r\n}\r\n"],"sourceRoot":""}