govuk-frontend
Version:
GOV.UK Frontend contains the code you need to start building a user interface for government platforms and services.
2 lines (1 loc) • 3.06 kB
Source Map (JSON)
{"version":3,"sources":["../../../../src/govuk/components/exit-this-page/_index.scss"],"names":[],"mappings":"AAAA,yBAAyB;;AAEzB;EACE,uBAAuB;;EAEvB;IACE,6CAA6C;IAC7C,wBAAgB;IAAhB,gBAAgB;IAChB,aAAa;IACb,MAAM;IACN,OAAO;IACP,WAAW;;IAEX;MACE,qBAAqB;MACrB,QAAQ;MACR,UAAU;MACV,WAAW;MACX,YAAY;IACd;EACF;;EAEA;IACE,gBAAgB;EAClB;;EAEA;IACE,oCAAoC;IACpC,aAAa;IACb,iBAAiB;IACjB,cAAc;IACd,cAAc,EAAE,mDAAmD;IACnE,kBAAkB;IAClB,oBAAoB;EACtB;;EAEA;IACE,cAAc;EAChB;;EAEA;IACE,sBAAsB;IACtB,qBAAqB;IACrB,sBAAsB;IACtB,uBAAuB;IACvB,iBAAiB;IACjB,iBAAiB;IACjB,mBAAmB;IACnB,kBAAkB;IAClB,0BAA0B;EAC5B;;EAEA;IACE,iCAAiC;EACnC;;EAEA;IACE;MACE,aAAa;IACf;EACF;;EAEA;IACE,eAAe;IACf,aAAa;IACb,MAAM;IACN,QAAQ;IACR,SAAS;IACT,OAAO;IACP,uCAAuC;EACzC;;EAEA,6EAA6E;EAC7E,gFAAgF;EAChF,gBAAgB;EAChB,CAAC;EACD,iFAAiF;EACjF,4EAA4E;EAC5E;IACE,4CAA4C;IAC5C;MACE,wBAAwB;IAC1B;;IAEA;MACE,yBAAyB;IAC3B;EACF;AACF","file":"_index.scss","sourcesContent":["@import \"../button/index\";\n\n@include govuk-exports(\"govuk/component/exit-this-page\") {\n $indicator-size: 0.75em;\n\n .govuk-exit-this-page {\n @include govuk-responsive-margin(8, \"bottom\");\n position: sticky;\n z-index: 1000;\n top: 0;\n left: 0;\n width: 100%;\n\n @include govuk-media-query($from: tablet) {\n display: inline-block;\n right: 0;\n left: auto;\n width: auto;\n float: right;\n }\n }\n\n .govuk-exit-this-page__button {\n margin-bottom: 0;\n }\n\n .govuk-exit-this-page__indicator {\n @include govuk-responsive-padding(2);\n display: none;\n padding-bottom: 0;\n color: inherit;\n line-height: 0; // removes extra negative space below the indicators\n text-align: center;\n pointer-events: none;\n }\n\n .govuk-exit-this-page__indicator--visible {\n display: block;\n }\n\n .govuk-exit-this-page__indicator-light {\n box-sizing: border-box;\n display: inline-block;\n width: $indicator-size;\n height: $indicator-size;\n margin: 0 0.125em;\n border-width: 2px;\n border-style: solid;\n border-radius: 50%;\n border-color: currentcolor;\n }\n\n .govuk-exit-this-page__indicator-light--on {\n border-width: $indicator-size / 2;\n }\n\n @media only print {\n .govuk-exit-this-page {\n display: none;\n }\n }\n\n .govuk-exit-this-page-overlay {\n position: fixed;\n z-index: 9999;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: govuk-colour(\"white\");\n }\n\n // This class is added to the body when the Exit This Page button is activated\n // in addition to the overlay to both block the entire screen and hide everything\n // underneath it.\n //\n // We do this to ensure that users don't risk interacting with the page underneath\n // the overlay between activating the button and navigating to the next page.\n .govuk-exit-this-page-hide-content {\n // stylelint-disable declaration-no-important\n * {\n display: none !important;\n }\n\n .govuk-exit-this-page-overlay {\n display: block !important;\n }\n }\n}\n"]}