@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 • 3.55 kB
Source Map (JSON)
{"version":3,"sources":["webpack://./src/components/ui/navigation-menu.module.css"],"names":[],"mappings":"AAAA;EACE,uBAAuB;EACvB,aAAa;EACb,kBAAkB;AACpB;;AAEA;EACE,SAAS;EACT,UAAU;EACV,gBAAgB;EAChB,aAAa;AACf;;AAIA;EADE,mBAAmB;EACnB,sBAAsB;AACxB;;AADA;EAIE,sCAAsC;EACtC,kCAAkC;EAClC,2BAA2B;EAC3B,eAAe;EACf,4BAA4B;EAC5B,kCAAkC;EAClC,4BAA4B;EAC5B,sFAAsF;EACtF,YAAY;EACZ,aAAa;EACb,uBAAuB;EACvB,gBAAgB;EAChB,oBAAoB;AACtB;;AACA;EAEE,kCAAkC;EAClC,kCAAkC;AACpC;;AAGA;EAAE,eAAe;EACf,iDAAiD;EACjD,cAAc;AAChB;;AAGA;EAAE,yBAAyB;AAC3B;;AAGA;EAAE,WAAW;AACb;;AAGA;EAAE,kCAAkC;EAClC,cAAc;EACd,aAAa;EACb,mBAAmB;EACnB,qBAAqB;EACrB,oBAAoB;AACtB;;AAGA;EAAE,iCAAiC;EACjC,mBAAmB;AACrB;;AAGA;EAAE,8BAA8B;EAC9B,uBAAuB;EACvB,WAAW;EACX,aAAa;EACb,kBAAkB;EAClB,SAAS;EACT,OAAO;AACT;;AAGA;EAAE,WAAW;AACb;;AAGA;EAAE,mCAAmC;EACnC,kCAAkC;EAClC,kCAAkC;EAClC,gBAAgB;EAChB,uCAAuC;AACzC;;AAGA;EAAE,oCAAoC;EACpC,gFAAgF;EAChF,2DAA2D;AAC7D;;AAGA;EAAE,uBAAuB;EACvB,WAAW;EACX,aAAa;EACb,aAAa;AACf;;AAGA;EAAE,kCAAkC;EAClC,2CAA2C;EAC3C,cAAc;EACd,eAAe;EACf,4CAA4C;AAC9C","sourcesContent":[".root {\r\n position: relative;\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.list {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--ac-space-1);\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\n.trigger {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: var(--ac-space-1);\r\n min-height: var(--ac-size-default);\r\n padding: 0 var(--ac-space-3);\r\n border: none;\r\n border-radius: var(--ac-radius-md);\r\n background-color: var(--ac-background);\r\n color: var(--ac-foreground);\r\n font-size: var(--ac-text-sm);\r\n font-weight: 500;\r\n outline: none;\r\n cursor: pointer;\r\n transition: background-color var(--ac-transition-fast), color var(--ac-transition-fast);\r\n}\r\n\r\n.trigger:hover,\r\n.trigger[data-open],\r\n.trigger:focus-visible {\r\n background-color: var(--ac-accent);\r\n color: var(--ac-accent-foreground);\r\n}\r\n\r\n.triggerIcon {\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n transition: transform var(--ac-transition-normal);\r\n}\r\n\r\n.trigger[data-open] .triggerIcon {\r\n transform: rotate(180deg);\r\n}\r\n\r\n.content {\r\n width: 100%;\r\n}\r\n\r\n.link {\r\n display: inline-flex;\r\n align-items: center;\r\n border-radius: var(--ac-radius-sm);\r\n color: inherit;\r\n outline: none;\r\n text-decoration: none;\r\n}\r\n\r\n.link:focus-visible {\r\n outline: 2px solid var(--ac-ring);\r\n outline-offset: 2px;\r\n}\r\n\r\n.viewportWrapper {\r\n position: absolute;\r\n top: 100%;\r\n left: 0;\r\n display: flex;\r\n justify-content: center;\r\n width: 100%;\r\n padding-top: var(--ac-space-2);\r\n}\r\n\r\n.positioner {\r\n z-index: 40;\r\n}\r\n\r\n.popup {\r\n overflow: hidden;\r\n border: 1px solid var(--ac-border);\r\n border-radius: var(--ac-radius-md);\r\n background-color: var(--ac-popover);\r\n box-shadow: 0 16px 40px -16px rgb(0 0 0 / 0.25);\r\n}\r\n\r\n.viewport {\r\n width: min(100vw - 2rem, var(--ac-nav-content-width, 20rem));\r\n height: var(--ac-nav-content-height);\r\n transition: width var(--ac-transition-normal), height var(--ac-transition-normal);\r\n}\r\n\r\n.indicator {\r\n display: flex;\r\n justify-content: center;\r\n width: 100%;\r\n height: 0.5rem;\r\n}\r\n\r\n.indicatorInner {\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n border-top-left-radius: var(--ac-radius-xs);\r\n background-color: var(--ac-border);\r\n transform: translateY(0.125rem) rotate(45deg);\r\n}\r\n"],"sourceRoot":""}