@primer/react/dist/AnchoredOverlay/AnchoredOverlay-ec9e15fc.css.map

An implementation of GitHub's Primer Design System using React

{"version":3,"sources":["../src/AnchoredOverlay/AnchoredOverlay.module.css.js"],"names":[],"mappings":"AAAA,0DACE,iBACF,CAEA,iDAIE,YAAa,CAHb,iBAAkB,CAElB,8BAAyB,CADzB,4BAOF,CAHE,mDANF,iDAOI,mBAEJ,CADE,CAGF,2CACE,oEAGwB,CACxB,mCAAoC,CAEpC,wBAA0B,CAD1B,WAsDF,CAnDE,oDAIE,QAAS,CAHT,UAAW,CACX,QAAS,CAGT,cAAe,CAFf,SAGF,CAEA,qEAGE,iBAAkB,CADlB,oDAOF,CAJE,sFACE,SAAU,CACV,sEACF,CAGF,kEAEE,kBAAmB,CACnB,iBAAkB,CAFlB,uCAQF,CAJE,mFACE,SAAU,CACV,mBACF,CAGF,mEAWE,sCAAgC,CAVhC,kBAAmB,CASnB,oDAAsD,CAEtD,iFACF,CAEA,oEACE,kBAAmB,CAEnB,qCAA+B,CAD/B,oDAAsD,CAEtD,kFACF,CAGF,uCAGE,QAAS,CAFT,mBAAoB,CACpB,oDAA8C,CAE9C,UACF,CAEA,wCACE,iBAAkB,CAElB,QAAS,CADT,oDAA8C,CAE9C,UACF","file":"AnchoredOverlay-ec9e15fc.css","sourcesContent":[".ResponsiveCloseButtonContainer {\n  position: relative;\n}\n\n.ResponsiveCloseButton {\n  position: absolute;\n  top: var(--base-size-8);\n  right: var(--base-size-8);\n  display: none;\n\n  @media screen and (--viewportRange-narrow) {\n    display: inline-grid;\n  }\n}\n\n.AnchoredOverlay {\n  position-try-fallbacks:\n    flip-block,\n    flip-inline,\n    flip-block flip-inline;\n  position-visibility: anchors-visible;\n  z-index: 100;\n  position: fixed !important;\n\n  &[popover] {\n    inset: auto;\n    margin: 0;\n    padding: 0;\n    border: 0;\n    max-width: none;\n  }\n\n  &[data-side='outside-bottom'] {\n    /* stylelint-disable primer/spacing */\n    top: calc(anchor(bottom) + var(--base-size-4));\n    left: anchor(left);\n\n    &[data-align='left'] {\n      left: auto;\n      right: calc(anchor(right) - var(--anchored-overlay-anchor-offset-left));\n    }\n  }\n\n  &[data-side='outside-top'] {\n    margin-bottom: var(--base-size-4);\n    bottom: anchor(top);\n    left: anchor(left);\n\n    &[data-align='left'] {\n      left: auto;\n      right: anchor(right);\n    }\n  }\n\n  &[data-side='outside-left'] {\n    right: anchor(left);\n    /* Falls back to `anchor(top)` when JS hasn't overridden it. JS sets the\n       override when the overlay's bottom would overflow the viewport so we\n       can lift it up to keep the bottom edge on screen, mirroring the JS\n       anchored-positioning code path.\n\n       This override only applies when CSS cannot find space using the default position -\n       or any of its defined fallbacks.\n    */\n    top: var(--anchored-overlay-top-override, anchor(top));\n    margin-right: var(--base-size-4);\n    position-try-fallbacks: flip-inline, flip-block, flip-start, --outside-left-to-bottom;\n  }\n\n  &[data-side='outside-right'] {\n    left: anchor(right);\n    top: var(--anchored-overlay-top-override, anchor(top));\n    margin-left: var(--base-size-4);\n    position-try-fallbacks: flip-inline, flip-block, flip-start, --outside-right-to-bottom;\n  }\n}\n\n@position-try --outside-left-to-bottom {\n  right: anchor(right);\n  top: calc(anchor(bottom) + var(--base-size-4));\n  margin: 0;\n  width: auto;\n}\n\n@position-try --outside-right-to-bottom {\n  left: anchor(left);\n  top: calc(anchor(bottom) + var(--base-size-4));\n  margin: 0;\n  width: auto;\n}\n"]}