frutjam/dist/components/popover.css

A utility-first CSS UI Library for Tailwind CSS

/*! frutjam v2.2.1 (c) 2026 Nezanuha | Released under the MIT License | https://frutjam.com */
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */.popover-content{border:none;inset:unset;margin:0;color:inherit;border-radius:var(--radius-popover);padding:.6rem;visibility:var(--popover-hover--visibility,hidden);opacity:var(--popover-hover--opacity,0);z-index:100;width:-moz-max-content;width:max-content;max-width:min(20rem,90vw);position-anchor:var(--popover--anchor-name);position-area:var(--popover--position-area,block-end span-inline-end);margin-block-start:var(--popover-placement--mt,0);margin-block-end:var(--popover-placement--mb,0);margin-inline-start:var(--popover-placement--ms,0);margin-inline-end:var(--popover-placement--me,0);position:fixed;position-try-fallbacks:var(--popover--position-try,none);background-color:var(--color-popover);outline-style:solid;outline-width:1px;outline-color:var(--color-popover-border);transition-property:opacity,visibility,transform;transition-behavior:allow-discrete;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-delay:var(--popover-hover--transition-delay,revert);&:hover{--popover-hover--visibility:visible;--popover-hover--opacity:1}&[popover]:popover-open{visibility:visible;opacity:1;@starting-style{visibility:hidden;opacity:0}}}.popover{--radius-popover:calc(var(--border-radius)*2);--color-popover:var(--color-base);--color-popover-border:var(--color-base-soft);--popover--anchor-name:--popover-anchor;--popover--position-try:flip-block,flip-inline,flip-block flip-inline;position:relative;display:inline-block;anchor-scope:all}.popover-bottom-center{--popover--position-area:end center;--popover--position-try:none;--popover-placement--mt:0.5rem;--popover-placement--mb:0}.popover-bottom-end{--popover--position-area:block-end span-inline-end;--popover--position-try:none;--popover-placement--mt:0.5rem;--popover-placement--mb:0}.popover-bottom-start{--popover--position-area:block-end span-inline-start;--popover--position-try:none;--popover-placement--mt:0.5rem;--popover-placement--mb:0}.popover-end-bottom{--popover--position-area:span-end end;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--ms:0.5rem}.popover-end-center{--popover--position-area:center end;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--ms:0.5rem}.popover-end-top{--popover--position-area:span-start end;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--ms:0.5rem}.popover-hover{--popover-hover--transition-delay:0.2s;&:hover{--popover-hover--opacity:1;--popover-hover--visibility:visible;--popover-hover--transition-delay:0}}.popover-start-bottom{--popover--position-area:span-end start;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--me:0.5rem}.popover-start-center{--popover--position-area:center start;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--me:0.5rem}.popover-start-top{--popover--position-area:span-start start;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--me:0.5rem}.popover-top-center{--popover--position-area:start center;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--mb:0.5rem}.popover-top-end{--popover--position-area:block-start span-inline-end;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--mb:0.5rem}.popover-top-start{--popover--position-area:block-start span-inline-start;--popover--position-try:none;--popover-placement--mt:0;--popover-placement--mb:0.5rem}.popover-toggle{anchor-name:var(--popover--anchor-name)}