vw-calc/docs/index.d55a8aec.css.map

Sass function to scale pixel-based value(s) proportionally and accessible.

{"mappings":"A,+GEKA,2FAOE,oCAKF,mHAQA,+FAOA,2EAIE,kCAKF,0GAOE,6BAIA,oCAIA,wGASF,0HAQA,wQAYE,iCAZF,yCAgBE,+BAIA,wCAGE,gDAIA,6EAOF,yOAaF,kFAOA,iBAGE,0DAIA,0GAKA","sources":["index.d55a8aec.css","Tsa25W","public/styles/index.scss"],"sourcesContent":["@import \"https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap\";\nhtml, body {\n  color: #09090b;\n  margin: 0;\n  padding: 0;\n  font-family: JetBrains Mono, monospace, sans-serif;\n}\n\nhtml *, body * {\n  box-sizing: border-box;\n}\n\n.container {\n  width: 100%;\n  margin: 0 auto;\n  padding: 0 max(1.5rem, .619718rem + 3.75587vw);\n  position: relative;\n  overflow: hidden;\n}\n\n.title {\n  letter-spacing: -.375rem;\n  margin: 0;\n  padding: 0;\n  font-size: max(3.5rem, 3.14789rem + 1.50235vw);\n}\n\n.description {\n  font-size: max(.875rem, .786972rem + .375587vw);\n  font-weight: 300;\n}\n\n.description code {\n  font-weight: 700;\n}\n\n.guide {\n  text-align: center;\n  border-bottom: .0625rem solid #09090b40;\n  width: 100%;\n  margin: 0 auto;\n  font-size: .75rem;\n}\n\n.guide--wide {\n  max-width: 90rem;\n}\n\n.guide--narrow {\n  max-width: 23.4375rem;\n}\n\n.guide span {\n  background-color: #fff;\n  padding: 0 1rem;\n  display: inline-block;\n  position: relative;\n  translate: 0 50%;\n}\n\n.grid {\n  grid-template-columns: 1fr;\n  place-content: start;\n  place-items: start;\n  gap: 0 max(1rem, .647887rem + 1.50235vw);\n  display: grid;\n}\n\n.input-output {\n  grid-gap: max(1rem, .119718rem + 3.75587vw);\n  color: #000000bf;\n  border-bottom: .0625rem solid #09090b40;\n  grid-template-columns: 1fr 1fr;\n  place-content: start;\n  place-items: center;\n  width: 100%;\n  padding: 2rem 0;\n  font-size: max(.75rem, .705986rem + .187793vw);\n  display: grid;\n}\n\n@media screen and (width <= 48rem) {\n  .input-output {\n    grid-template-columns: 1fr;\n  }\n}\n\n.input-output .info {\n  width: 100%;\n}\n\n.input-output .block {\n  margin-bottom: 1rem;\n}\n\n.input-output .block:last-child {\n  margin-bottom: 0;\n}\n\n.input-output .block > span {\n  margin-bottom: .25rem;\n  font-weight: 700;\n  display: block;\n}\n\n.input-output code {\n  color: #fff;\n  background: #09090b80;\n  border-radius: .5rem;\n  width: fit-content;\n  padding: 1rem;\n  font-size: max(.75rem, .705986rem + .187793vw);\n  line-height: max(1.125rem, 1.08099rem + .187793vw);\n  display: block;\n}\n\n.output {\n  color: #fff;\n  background-color: #008000cc;\n  border-radius: .25rem;\n  padding: .25rem;\n}\n\n.demo {\n  color: #00e;\n}\n\n.demo--heading {\n  font-size: max(1rem, .647887rem + 1.50235vw);\n}\n\n.demo--paragraph {\n  font-size: max(.75rem, .617958rem + .56338vw);\n  line-height: max(1rem, .911972rem + .375587vw);\n}\n\n.demo--box {\n  background-color: #00e;\n  border-radius: max(.75rem, .485915rem + 1.12676vw);\n  width: max(6.25rem, 4.0493rem + 9.38967vw);\n  height: max(6.25rem, 4.0493rem + 9.38967vw);\n}\n/*# sourceMappingURL=index.d55a8aec.css.map */\n",null,"@use \"./src/utils\" as u;\n@use './src/vw-calc' as vw;\n\n@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap');\n\nhtml,\nbody {\n  margin: 0;\n  padding: 0;\n  color: #09090b;\n  font-family: \"JetBrains Mono\", monospace, sans-serif;\n\n  * {\n    box-sizing: border-box;\n  }\n}\n\n.container {\n  position: relative;\n  width: 100%;\n  margin: 0 auto;\n  padding: 0 vw.vw-calc(24 64);\n  overflow: hidden;\n}\n\n.title {\n  margin: 0;\n  padding: 0;\n  letter-spacing: u.rem-calc(-6);\n  font-size: vw.vw-calc(56 72);\n}\n\n.description {\n  font-size: vw.vw-calc(14 18);\n  font-weight: 300;\n\n  code {\n    font-weight: 700;\n  }\n}\n\n.guide {\n  width: 100%;\n  margin: 0 auto;\n  font-size: u.rem-calc(12);\n  text-align: center;\n  border-bottom: u.rem-calc(1) solid rgba(9, 9, 11, .25);\n\n  &--wide {\n    max-width: u.rem-calc(1440);\n  }\n\n  &--narrow {\n    max-width: u.rem-calc(375);\n  }\n\n  span {\n    display: inline-block;\n    position: relative;\n    translate: 0 50%;\n    padding: 0 1rem;\n    background-color: white;\n  }\n}\n\n.grid {\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 0 vw.vw-calc(16 32);\n  place-content: start;\n  place-items: start;\n}\n\n.input-output {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  grid-gap: vw.vw-calc(16 56);\n  place-items: center;\n  place-content: start;\n  width: 100%;\n  padding: u.rem-calc(32) 0;\n  font-size: vw.vw-calc(12 14);\n  color: rgba(0, 0, 0, .75);\n  border-bottom: u.rem-calc(1) solid rgba(9, 9, 11, .25);\n\n  @media screen and (max-width: u.rem-calc(768)) {\n    grid-template-columns: 1fr;\n  }\n\n  .info {\n    width: 100%;\n  }\n  \n  .block {\n    margin-bottom: u.rem-calc(16);\n\n    &:last-child {\n      margin-bottom: 0;\n    }\n\n    > span {\n      display: block;\n      font-weight: 700;\n      margin-bottom: u.rem-calc(4);\n    }\n  }\n  \n  code {\n    display: block;\n    width: fit-content;\n    padding: u.rem-calc(16);\n    font-size: vw.vw-calc(12 14);\n    line-height: vw.vw-calc(18 20);\n    color: white;\n    border-radius: u.rem-calc(8);\n    background: rgba(9, 9, 11, .5);\n  }\n}\n\n\n.output {\n  padding: .25rem;\n  color: white;\n  border-radius: .25rem;\n  background-color: rgba(0, 128, 0, .8);\n}\n\n.demo {\n  color: #00e;\n\n  &--heading {\n    font-size: vw.vw-calc(16 32);\n  }\n  \n  &--paragraph {\n    font-size: vw.vw-calc(12 18);\n    line-height: vw.vw-calc(16 20);\n  }\n  \n  &--box {\n    width: vw.vw-calc(100 200);\n    height: vw.vw-calc(100 200);\n    border-radius: vw.vw-calc(12 24);\n    background-color: #00e;\n  }\n}\n"],"names":[],"version":3,"file":"index.d55a8aec.css.map"}