UNPKG

sassdoc-theme-herman

Version:
1 lines 7.79 kB
{"version":3,"file":"iframe_styles.min.css","mappings":"AAEA,MACE,gBAGF,KACE,kBAGF,wDAME,sCAGF,qCAEE,6IACE,CAcJ,mBACE,gIACE,CAEF,oBAGF,oBACE,eAGF,iBACE,mBACA,gBAGF,wBACE,WAGF,oBACE,qCACA,yCACA,4CAGF,oCAEE,oCACA,qBACA,mBAEA,0EACE,8DCnEJ,2BACE,6BAEA,aACA,eACA,uBAEA,wBAPF,2BAQI,aAEA,WADA,oBAEA,wDAIA,mBAIJ,uBACE,oBACA,aACA,cACA,sBACA,gBACA,aAEA,wBARF,uBASI,UAIJ,0BACE,mBACA,aACA,eACA,8BAGF,yBACE,cACA,mBAEA,8BACE,cAIJ,sBACE,cACA,iBACA,qBCnDF,4BACE,eACA,gBAGF,8BACE,0BACA,4BACA,6BAGF,kBACE,6EAKA,kDACE,qBAAsB,CACtB,yBAA0B,CAI9B,0BACE,wBAAyB,CACzB,uBAAwB,CACxB,6BAGF,uBACE,gDACA,sQAiCA,2BACA,2BACA,0CACE,CAGF,sBACA,cACA,iBAGF,0BACE,0BACA,4BAA6B,CAE7B,gDACA,mBC1EF,6BACE,SAGF,4BACE,aACA,eACA,cAEA,wBALF,4BAMI,aAEA,WADA,oBAEA,wDAIA,UAIJ,4BACE,oBACA,aACA,cACA,sBACA,gBACA,aAEA,wBARF,4BASI,UAOJ,2BACE,yBACA,cACA,iBACA,kBAGF,4DAEE,QACA,kBAGF,gCACE,uOAEA,0BACA,SAMF,mDAEE,cACA,eAGF,0BACE,kCAGF,gCACE,qBAGF,0BACE,yBACA,sBACA,iDACA,cACA,gBACA,mBACA","sources":["webpack:///../../scss/iframes/_base.scss","webpack:///../../scss/iframes/_font.scss","webpack:///../../scss/iframes/_size.scss","webpack:///../../scss/iframes/_color.scss"],"sourcesContent":["@use 'pkg:accoutrement' as tools;\n\n:root {\n line-height: tools.ratio('line-height');\n}\n\nbody {\n overflow-x: hidden;\n}\n\n[data-herman-label],\n[data-herman-th],\n[data-herman-code] {\n // These items are purposely sized without root-based\n // units in order to make them appear similar in size\n // no matter what the default root size is in a project.\n font-size: clamp(14px, calc(60% + 0.8vw), 18px);\n}\n\n[data-herman-label],\n[data-herman-th] {\n font-family:\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Oxygen,\n Ubuntu,\n Cantarell,\n 'Fira Sans',\n 'Droid Sans',\n 'Helvetica Neue',\n sans-serif;\n}\n\n[data-herman-code] {\n font-family:\n Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono',\n 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Courier New', monospace;\n font-weight: inherit;\n}\n\n[data-herman-table] {\n max-width: 100%;\n}\n\n[data-herman-th] {\n padding-bottom: 1em;\n text-align: left;\n}\n\n[data-herman-th='spacer'] {\n width: 100%;\n}\n\n[data-herman-label] {\n background: var(--herman-label-color);\n margin: var(--herman-label-margin, 0.5em 0);\n padding: var(--herman-label-padding, 0.25em 0);\n}\n\n[data-herman-th],\n[data-herman-cell] {\n background: var(--herman-cell-color);\n padding: 0.25rem 0.5rem;\n white-space: nowrap;\n\n &[data-herman-label] {\n background: var(--herman-label-color, var(--herman-cell-color));\n }\n}\n","@use 'pkg:accoutrement' as tools;\n\n[data-herman-preview='font'] {\n --herman-label-color: #{tools.color('slight')};\n\n display: flex;\n flex-wrap: wrap;\n margin: tools.size('gutter') tools.negative('shim') 0;\n\n @supports (display: grid) {\n display: grid;\n grid-auto-rows: auto;\n gap: tools.size('gutter');\n grid-template-columns: repeat(\n auto-fit,\n minmax(tools.size('font-preview'), 1fr)\n );\n margin: tools.size('gutter') 0 0;\n }\n}\n\n[data-herman-fontface] {\n align-items: stretch;\n display: flex;\n flex: 1 0 tools.size('font-preview');\n flex-direction: column;\n font-size: tools.size('code');\n margin: tools.size('shim');\n\n @supports (display: grid) {\n margin: 0;\n }\n}\n\n[data-herman-font='sample'] {\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n justify-content: space-between;\n}\n\n[data-herman-font='lorem'] {\n flex: 1 1 auto;\n padding-left: tools.size('shim');\n\n span {\n display: block;\n }\n}\n\n[data-herman-font='aa'] {\n flex: 0 1 auto;\n font-size: tools.size('specimen-aa');\n padding-left: tools.size('quarter-shim');\n}\n","@use 'pkg:accoutrement' as tools;\n\n[data-herman-size='overflow'] {\n max-width: 100%;\n overflow-x: auto;\n}\n\n[data-herman-size~='highlight'] {\n --herman-size-bar: #{tools.color('action')};\n --herman-cell-color: #{tools.color('callout')};\n --herman-label-color: #{tools.color('callout')};\n}\n\n[data-herman-viz] {\n margin: var(--herman-viz-before, 0.25rem) auto\n var(--herman-viz-after, 0.25rem) 0;\n}\n\n[data-herman-size~='viz-row'] {\n [data-herman-viz='bar'] {\n --herman-viz-before: 0;\n --herman-viz-after: 0.5rem;\n }\n}\n\n[data-herman-table~='text'] {\n --herman-viz-before: 1rem;\n --herman-viz-after: 1rem;\n --herman-label-color: #{tools.color('callout')};\n}\n\n[data-herman-viz~='bar'] {\n background-color: var(--herman-size-bar, #{tools.color('border')});\n background-image: var(\n --herman-size-bar-image,\n linear-gradient(\n to left,\n tools.color('underline') 1px,\n transparent 1px,\n transparent\n ),\n linear-gradient(\n to left,\n tools.color(\n 'border-light',\n (\n 'rgba': 0.5,\n )\n )\n 1px,\n transparent 1px,\n transparent\n ),\n linear-gradient(\n to left,\n tools.color(\n 'border-light',\n (\n 'rgba': 0.25,\n )\n )\n 1px,\n transparent 1px,\n transparent\n )\n );\n background-position: 0 100%;\n background-repeat: repeat-x;\n background-size:\n 100px 75%,\n 10px 50%,\n 5px 25%;\n border-radius: tools.size('quarter-shim');\n display: block;\n min-height: 1.5em;\n}\n\n[data-herman-viz~='border'] {\n --herman-size-bar: #{tools.color('slight')};\n --herman-size-bar-image: none;\n\n border-color: var(--herman-border-color, #{tools.color('border')});\n border-style: solid;\n}\n","// Preview Layouts\n// ===============\n\n@use 'pkg:accoutrement' as tools;\n\n// Color Preview\n// -------------\n\n[data-herman-preview='colors'] {\n margin: 0;\n}\n\n[data-herman-color-palette] {\n display: flex;\n flex-wrap: wrap;\n margin: tools.negative('shim');\n\n @supports (display: grid) {\n display: grid;\n grid-auto-rows: auto;\n gap: tools.size('gutter');\n grid-template-columns: repeat(\n auto-fit,\n minmax(tools.size('color-preview'), 1fr)\n );\n margin: 0;\n }\n}\n\n[data-herman-color-preview] {\n align-items: stretch;\n display: flex;\n flex: 1 0 tools.size('color-preview');\n flex-direction: column;\n font-size: tools.size('code');\n margin: tools.size('shim');\n\n @supports (display: grid) {\n margin: 0;\n }\n}\n\n// Color Swatch\n// ------------\n\n[data-herman-color-swatch] {\n border: 1px solid tools.color('border');\n height: tools.size('color-swatch');\n min-width: tools.size('color-swatch');\n position: relative;\n}\n\n[data-herman-transparency-grid],\n[data-herman-color-overlay] {\n inset: 0;\n position: absolute;\n}\n\n[data-herman-transparency-grid] {\n background: url('data:image/svg+xml;utf8,<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 20 20\"><rect width=\"10\" height=\"10\"/><rect x=\"10\" y=\"10\" width=\"10\" height=\"10\"/></svg>')\n center repeat scroll;\n background-size: 0.5em 0.5em;\n left: 50%;\n}\n\n// Color Info\n// ----------\n\n[data-herman-color-name],\n[data-herman-color-value] {\n display: block;\n padding: tools.size('half-shim');\n}\n\n[data-herman-label='color'] {\n --herman-label-margin: #{tools.size('half-shim')} 0 0;\n}\n\n[data-herman-color-name-option] {\n display: inline-block;\n}\n\n[data-herman-color-value] {\n background-color: tools.color('slight');\n border-radius: tools.size('quarter-shim');\n box-shadow: 0 0 tools.size('quarter-shim') tools.color('code-shadow') inset;\n color: tools.color('text-light');\n font-weight: normal;\n margin-top: tools.size('quarter-shim');\n white-space: nowrap;\n}\n"],"names":[],"ignoreList":[],"sourceRoot":""}