nexmoe.css/nexmoe.min.css.map

Use only HTML to write modern websites with smooth animations and beautiful interfaces.

{"version":3,"sources":["src/variables.pcss","src/global.pcss","src/layout.pcss","src/typography.pcss","src/other.pcss","src/form.pcss","src/nav.pcss","src/table.pcss"],"names":[],"mappings":"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","file":"nexmoe.min.css","sourcesContent":["/* Variables */\n\n:root {\n\t--active-brightness: 0.8;\n\t--hover-brightness: 1.2;\n\t--border-radius: 6px;\n\t--color-primary: rgb(23, 23, 23);\n\t--color-link: #df5d64;\n\t--color-text: rgb(23, 23, 23);\n\t--color-bg: #fff;\n\t--color-hover: rgba(23, 23, 23, 0.15);\n\t--nexmoe-gap: 1rem;\n\t--icon-checkbox: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E\");\n\t--icon-summary: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(23, 23, 23)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E\");\n}\n\n@media (prefers-color-scheme: dark) {\n\t:root {\n\t\t--color-primary: #fff;\n\t\t--color-text: #f7f7f7;\n\t\t--color-bg: #111;\n\t\t--color-hover: rgba(230, 230, 230, 0.15);\n\t\t--icon-checkbox: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E\");\n\t\t--icon-summary: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23f7f7f7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E\");\n\t}\n}","* {\n\tbox-sizing: border-box;\n}\n","/* Layout */\n\nbody {\n\tmargin: 0;\n\tbackground-color: var(--color-bg);\n\tcolor: var(--color-text);\n\tline-height: 1.5;\n\tpadding: 0 3rem;\n}\n\n@media (max-width: 768px) {\n\tbody {\n\t\tpadding: 0 1rem;\n\t}\n}\n\nheader {\n\ttext-align: center;\n\tline-height: 1.7;\n}\n\nheader h2 {\n\tborder-bottom: none;\n}\n\nfooter {\n\tpadding: 2rem 0;\n}\n\n@media (max-width: 768px) {\n\tfooter {\n\t\tpadding: 2rem 1rem;\n\t}\n}\n\nmain {\n\tmax-width: 960px;\n\tmargin: 50px auto;\n\tpadding: 0 1rem;\n}\n\nsection {\n\tmargin: 4rem 0;\n}\n\narticle {\n\tborder-radius: var(--border-radius);\n\toverflow: hidden;\n\tborder: 2px solid var(--color-text);\n\tbox-shadow: 0 4px 7px 1px rgba(0, 0, 0, 0.25);\n}\n\narticle > *:first-child {\n\tmargin-top: 0;\n}\n\narticle > *:last-child {\n\tmargin-bottom: 0;\n}","/* Typography */\n\na {\n\tcolor: var(--color-link);\n\ttext-decoration: none;\n}\n\na:hover {\n\ttext-decoration: underline;\n\tfilter: brightness(var(--hover-brightness));\n}\n\na:active {\n\tfilter: brightness(var(--active-brightness));\n}\n\nh1 {\n\tfont-size: 2.7rem;\n}\n\nh2 {\n\tfont-size: 2rem;\n}\n\nh3 {\n\tfont-size: 1.5rem;\n}\n\nh4 {\n\tfont-size: 1.17rem;\n}\n\nh5 {\n\tfont-size: 1rem;\n}\n\nh6 {\n\tfont-size: 0.83rem;\n}\n\nmark {\n\tpadding: 0 0.25rem;\n}\n\nimg {\n\tborder-radius: var(--border-radius);\n\tbox-shadow: 0 0 0 1px #eee;\n}\n\np {\n\tmargin: 1rem 0;\n}\n\nkbd {\n\tcolor: var(--color-text);\n\tborder: 1px solid var(--color-text);\n\tborder-bottom: 3px solid var(--color-text);\n\tborder-radius: 5px;\n\tpadding: 0.3rem 0.55rem;\n}\n\nhr {\n\tborder: none;\n\tborder-top: 2px solid #ccc;\n\tmargin: 1rem 0;\n}\n\nblockquote {\n\tborder-left: 6px solid;\n\tpadding: 1px 2rem;\n}\n\ncode {\n\tpadding: 0.2em 0.4em;\n\tmargin: 0;\n\tfont-size: 85%;\n\tbackground-color: rgba(175, 184, 193, 0.2);\n\tborder-radius: 6px;\n}","/* Other */\n\ndetails summary::marker {\n\tcontent: none;\n}\ndetails summary::after {\n\tdisplay: block;\n\twidth: 1rem;\n\theight: 1rem;\n\tmargin-top: 0.25rem;\n\tfloat: right;\n\ttransform: rotate(-90deg);\n\tbackground-image: var(--icon-summary);\n\tbackground-position: right center;\n\tbackground-size: 1rem auto;\n\tbackground-repeat: no-repeat;\n\tcontent: \"\";\n\ttransition: transform 0.2s ease-in-out;\n}\n\ndetails[open] summary::after {\n\ttransform: rotate(0deg);\n}\n\ndetails summary {\n\tpadding: 1rem;\n}\n\ndetails + div {\n\tmax-height: 0;\n\toverflow: hidden;\n\tpadding: 0 1rem;\n\topacity: 0;\n\ttransition: max-height 0.2s ease-in-out;\n}\n\ndetails[open] + div {\n\tmax-height: 1000px;\n\topacity: 1;\n\tborder-top: 2px solid var(--color-text);\n}\n\ninput[type=\"radio\"],\ninput[type=\"checkbox\"],\nlabel,\ndetails {\n\tcursor: pointer;\n}\n\nlabel > input:not([type=\"checkbox\"]):not([type=\"radio\"]),\nlabel > select {\n\tdisplay: block;\n\tmargin-top: 0.3em;\n}\n\ndialog {\n\tbox-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);\n\tborder: none;\n\tborder-radius: var(--border-radius);\n\tpadding: calc(var(--nexmoe-gap) * 1.5);\n\tbackground-color: var(--color-bg);\n\tcolor: var(--color-text);\n\tanimation-name: dialogScaleIn;\n\tanimation-duration: 0.2s;\n}\n\n@keyframes dialogScaleIn {\n\tfrom {\n\t\ttransform: scale(0.5, 0.5);\n\t}\n\n\tto {\n\t\ttransform: scale(1, 1);\n\t}\n}\n\ndialog menu {\n\tdisplay: flex;\n\tgap: var(--nexmoe-gap);\n\tjustify-content: flex-end;\n\tmargin-bottom: 0;\n}\n\ndialog fieldset {\n\tborder: 0;\n\tmargin: unset;\n\tpadding: unset;\n}\n\ndialog fieldset legend {\n\tfont-size: 1.5rem;\n\tmargin-bottom: var(--nexmoe-gap);\n}","/* Form */\n\nbutton:active,\ninput:active {\n\ttransform: translateY(2px);\n\ttransition: transform 0.1s;\n}\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n\tappearance: none;\n\twidth: 1.25rem;\n\theight: 1.25rem;\n\tmargin-top: 0;\n\tmargin-right: 0.3rem;\n\tmargin-left: 0;\n\tvertical-align: middle;\n\tpadding: 0;\n}\n\ninput[type=\"checkbox\"]:checked,\ninput[type=\"radio\"]:checked {\n\tbackground-image: var(--icon-checkbox);\n\tbackground-position: center;\n\tbackground-size: 0.75em auto;\n\tbackground-repeat: no-repeat;\n\tbackground-color: var(--color-primary);\n}\n\ninput[type=\"radio\"] {\n\tborder-radius: 50%;\n}\n\nbutton,\ninput[type=\"button\"],\ninput[type=\"submit\"],\ninput[type=\"reset\"] {\n\tcursor: pointer;\n\tbackground-color: var(--color-primary);\n\tcolor: var(--color-bg);\n}\n\nbutton,\ninput,\nselect {\n\ttransition: all 0.1s ease-in-out;\n}\n\nbutton:hover,\ninput:hover,\nselect:hover,\ntextarea:hover {\n\tbox-shadow: 0 0 0 2px var(--color-hover);\n}\n\nbutton,\ninput,\nselect,\ntextarea {\n\tfont-size: 1.2rem;\n\tborder: 2px solid var(--color-primary);\n\tborder-radius: var(--border-radius);\n\tpadding: 0.6rem 1rem;\n}\n\nbutton[text] {\n\tbackground-color: transparent;\n\tcolor: var(--color-primary);\n\tborder-color: transparent;\n}\n\ninput[type=\"color\"] {\n\tpadding: 1px 4px;\n}","/* Nav */\n\nnav {\n\talign-items: center;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\tmargin: 1rem 0;\n\tfont-size: 1.2rem;\n}\n\n@media (max-width: 768px) {\n\tnav {\n\t\tmargin: 1rem;\n\t\tflex-wrap: wrap;\n\t\tflex-direction: column;\n\t}\n\tnav ul {\n\t\ttext-align: center;\n\t}\n}\n\nnav > a {\n\tfont-size: 1.5rem;\n}\n\nnav a {\n\tcolor: var(--color-text);\n\tdisplay: block;\n}\n\nnav ul {\n\tlist-style: none;\n\tpadding: 0;\n\tmargin: -0.2rem;\n}\n\nnav ul li {\n\tdisplay: inline-block;\n\tposition: relative;\n\tmargin: 0.2rem;\n}\n\nnav ul li a {\n\tmin-width: 2rem;\n\tpadding: 0.5rem 1rem;\n\tborder-radius: 30px;\n\ttransition: background-color 0.1s ease-in-out;\n}\n\nnav ul li a:hover {\n\tcolor: var(--color-primary);\n\tbackground-color: var(--color-hover);\n\ttext-decoration: none;\n\tfilter: unset;\n}\n\nnav ul li a[checked],\nnav ul li a:active {\n\ttransition: none;\n\tbackground-color: var(--color-primary);\n\tcolor: var(--color-bg);\n}\n\n/* Nav Dropdown */\n\nnav ul li ul {\n\tbackground: var(--color-bg);\n\tborder-radius: var(--border-radius);\n\tbox-shadow: 0 1px 5px rgba(100, 100, 100, 0.15);\n\theight: auto;\n\tpadding: 1rem 0.8rem;\n\tposition: absolute;\n\ttop: 3.5rem;\n\twhite-space: nowrap;\n\twidth: auto;\n\tmin-width: 100%;\n\ttransform: translateY(-8px);\n\tz-index: -1;\n\topacity: 0;\n\ttransition: all 0.2s ease-in-out;\n}\n\nnav ul li:hover ul {\n\tz-index: 1;\n\topacity: 1;\n\ttransform: translateY(0);\n}\n\nnav ul li ul::before {\n\tcontent: \"\";\n\tposition: absolute;\n\tleft: 0;\n\tright: 0;\n\ttop: -0.5rem;\n\theight: 0.5rem;\n}\n\nnav ul li ul li {\n\tdisplay: block;\n}\n\nnav ul li ul li a {\n\tborder-radius: var(--border-radius);\n}\n","/* Table */\n\ntable {\n\tfont-size: 1.2rem;\n\tborder-collapse: collapse;\n}\n\nth,\ntd {\n\tpadding: 0.6em 1.2em;\n\ttext-align: left;\n}\n\nth {\n\tbackground-color: var(--color-primary);\n\tcolor: var(--color-bg);\n}\n\ntr:nth-child(even) {\n\tbackground-color: #f2f2f2;\n}\n\ntr:hover {\n\tbackground-color: #f5f5f5;\n}\n"]}