picocss/scss/layout/_sectioning.scss.map

{"version":3,"sources":["_sectioning.scss"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF,mBAAmB;AACnB,yEAAyE;AACzE,+EAA+E;AAC/E,sBAAsB;;AAEtB,8CAA8C;AAC9C;EACE,cAAc;AAChB;;AAEA,MAAM;AACN,sBAAsB;;AAEtB,oDAAoD;AACpD;EACE,WAAW;EACX,SAAS,EAAE,GAAG;;EAEd;;;IAGE,WAAW;IACX,kBAAkB;IAClB,iBAAiB;;IAEjB,oBAAoB;IACpB;MACE,sEAAsE;;MAEtE,mBAAmB;MACnB;QACE;UACE;YACE,oCAAoC;YACpC,gBAAgB;YAChB,eAAe;UACjB;QACF;;QAEA;UACE;YACE,oCAAoC;UACtC;QACF;;QAEA;UACE;YACE,oCAAoC;UACtC;QACF;;QAEA;UACE;YACE,oCAAoC;UACtC;QACF;MACF;IACF;;IAEA,oBAAoB;IACpB;MACE,wCAAwC;IAC1C;EACF;AACF","file":"_sectioning.scss","sourcesContent":["/**\n * Sectioning\n * Container and responsive spacings for header, main, footer\n */\n\n// Reboot based on :\n// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css\n// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css\n// ––––––––––––––––––––\n\n// Render the `main` element consistently in IE\nmain {\n  display: block;\n}\n\n// Pico\n// ––––––––––––––––––––\n\n// 1. Remove the margin in all browsers (opinionated)\n#{$semantic-root-element} {\n  width: 100%;\n  margin: 0; // 1\n\n  > header,\n  > main,\n  > footer {\n    width: 100%;\n    margin-right: auto;\n    margin-left: auto;\n\n    // Semantic container\n    @if $enable-semantic-container {\n      padding: var(--block-spacing-vertical) var(--block-spacing-horizontal);\n\n      // Centered viewport\n      @if $enable-viewport {\n        @if map-get($breakpoints, \"sm\") and $enable-viewport {\n          @media (min-width: map-get($breakpoints, \"sm\")) {\n            max-width: map-get($viewports, \"sm\");\n            padding-right: 0;\n            padding-left: 0;\n          }\n        }\n\n        @if map-get($breakpoints, \"md\") and $enable-viewport {\n          @media (min-width: map-get($breakpoints, \"md\")) {\n            max-width: map-get($viewports, \"md\");\n          }\n        }\n\n        @if map-get($breakpoints, \"lg\") and $enable-viewport {\n          @media (min-width: map-get($breakpoints, \"lg\")) {\n            max-width: map-get($viewports, \"lg\");\n          }\n        }\n\n        @if map-get($breakpoints, \"xl\") and $enable-viewport {\n          @media (min-width: map-get($breakpoints, \"xl\")) {\n            max-width: map-get($viewports, \"xl\");\n          }\n        }\n      }\n    }\n\n    // Semantic container\n    @else {\n      padding: var(--block-spacing-vertical) 0;\n    }\n  }\n}\n"]}