1 line
23 KiB
Plaintext
1 line
23 KiB
Plaintext
{"version":3,"sources":["../style.css"],"names":[],"mappings":"AAAA,kEAAkE,CAoDlE,WACE,mBAAoB,CACpB,uCAAgD,CAChD,yCACF,CACA,WACE,kBAAmB,CACnB,mCAA4C,CAC5C,qCACF,CAGA,WACE,sBAAuB,CACvB,uCAAgD,CAChD,yCACF,CACA,WACE,oBAAqB,CACrB,2CAAoD,CACpD,6CACF,CACA,oBAEE,qBAAgC,CADhC,UAEF,CAEA,0BACE,8JAA0P,CAC1P,qBAAgC,CAEhC,+BAAiC,CADjC,uBAAwB,CAGxB,0BAAuC,CADvC,UAEF,CAEA,0BAGE,qBAAgC,CAEhC,qBAAkB,CAAlB,iBAAkB,CAHlB,sBAAuB,CADvB,UAKF,CAEA,gNAIE,aACF,CAEA,0CAGE,+wBAAqD,CAFrD,2BAA4B,CAC5B,cAEF,CACA,iDAGE,60BAA4D,CAF5D,2BAA4B,CAC5B,cAEF,CACA,wCAEE,gyBAAuD,CADvD,cAEF,CACA,+CAGE,41BAA8D,CAF9D,2BAA4B,CAC5B,cAEF,CAEA,4CAGE,y4BAAuD,CAFvD,2BAA4B,CAC5B,cAEF,CACA,mDAGE,o7BAA8D,CAF9D,2BAA4B,CAC5B,cAEF,CACA,0CAEE,s3BAAwD,CADxD,cAEF,CACA,iDAGE,w4BAA+D,CAF/D,2BAA4B,CAC5B,cAEF,CAEA,KACE,iHAA6J,CAE7J,2BAA4B,CAD5B,yBAEF,CAEA,EACE,UAAuB,CACvB,yBACF,CAEA,GACE,2BACF,CAQA,YAGE,aACF,CAEA,eAJE,mBAOF,CAHA,GAEE,aACF,CAGA,iBACE,aAAc,CAEd,eAAgB,CADhB,cAEF,CAGA,iBAIE,qBAAgC,CAHhC,gBAAiB,CAEjB,kBAA6B,CAD7B,YAGF,CAEA,yBAGE,eAA0B,CAD1B,YAAa,CADb,UAGF,CAEA,gCACE,YACF,CAEA,iBAGE,cAAe,CAFf,WAAY,CAGZ,sBAAwB,CAFxB,0BAGF,CAEA,cAKE,yBAAuB,CAAvB,kBAAuB,CAAvB,sBACF,CACA,cAEE,gBAAiB,CACjB,WACF,CAGA,WAGE,kBAAmB,CAInB,kDAAkE,CAElE,2BAA4B,CAD5B,4CAA6C,CAN7C,YAAa,CADb,SAAU,CAGV,aAAc,CACd,cAAgB,CAChB,mBAIF,CACA,kBAOE,eAA0B,CAC1B,cAAe,CACf,sBAAuB,CANvB,gBAAiB,CACjB,eAAiB,CACjB,eAAgB,CAHhB,aAAc,CADd,cAAgB,CAKhB,iBAIF,CAEA,oBAGE,kBAAmB,CAKnB,2BAA4B,CAD5B,4CAA6C,CAL7C,YAAa,CADb,SAAU,CAGV,aAAc,CACd,cAAgB,CAChB,mBAGF,CACA,2BASE,aAAsB,CAFtB,cAAe,CACf,sBAAuB,CALvB,gBAAiB,CACjB,eAAiB,CACjB,eAAgB,CAHhB,aAAc,CADd,cAAgB,CAKhB,iBAIF,CAEA,kBAOE,qBAAgC,CADhC,qBAAkC,CAElC,cAAe,CANf,aAAc,CAEd,WAAY,CACZ,cAAgB,CAJhB,iBAAkB,CAQlB,mBAAqB,CANrB,UAOF,CACA,uBAEE,0BAA2B,CAE3B,0BAA8B,CAH9B,2BAIF,CACA,6DAME,QAAS,CALT,UAAW,CAGX,MAAO,CAGP,SAAU,CALV,iBAAkB,CAGlB,OAAQ,CAFR,KAKF,CACA,+BACE,wIAAgT,CAEhT,2BAA4B,CAD5B,+CAEF,CACA,8BACE,wIAAgT,CAEhT,2BAA4B,CAD5B,mGAAuG,CAEvG,kCACF,CACA,2EACE,SACF,CACA,yBACE,0FAAgK,CAGhK,qBAAgC,CADhC,2BAA4B,CAD5B,+BAGF,CACA,gCACE,eACF,CACA,yBACE,iBACF,CAEA,QAKE,qBAAgC,CAChC,sBAAoC,CALpC,qBAAsB,CAMtB,4CAAkD,CALlD,WAAY,CACZ,eAAgB,CAChB,eAIF,CACA,aAIE,cAAe,CAFf,WAAY,CAGZ,sBAAwB,CAJxB,iBAAkB,CAElB,iBAIF,CACA,gCAEE,qBAAgC,CADhC,UAEF,CACA,sCACE,8JAA0P,CAC1P,qBAAgC,CAEhC,+BAAiC,CADjC,uBAAwB,CAGxB,0BAAuC,CADvC,UAEF,CACA,sCAGE,qBAAgC,CAEhC,qBAAkB,CAAlB,iBAAkB,CAHlB,sBAAuB,CADvB,UAKF,CAEA,WAOE,oBAAsB,CAAtB,2BAEF,CAEA,wBATE,YAAa,CADb,SAAU,CAEV,kBAAmB,CAKnB,cAAe,CAJf,6BAiBF,CAVA,aAOE,uBAAsB,CAAtB,oBAAsB,CAEtB,eAAgB,CAJhB,mBAKF,CAIA,kBAKE,eAA0B,CAG1B,uCAAiD,CAFjD,kBAAmB,CACnB,kBAAmB,CAEnB,UAAuB,CAKvB,cAAe,CADf,sBAAuB,CADvB,cAAe,CAXf,eAAgB,CAChB,cAAe,CACf,cAAe,CAOf,iBAAkB,CAClB,oBAIF,CAEA,YACE,eAA4B,CAC5B,iBAAiB,CACjB,UAAqB,CACrB,sBACF,CAEA,cAIE,eAA0B,CAG1B,uCAAiD,CAFjD,kBAAmB,CACnB,kBAAmB,CAEnB,aAAsB,CAItB,sBAAuB,CADvB,cAAe,CAVf,eAAgB,CAChB,cAAe,CAOf,iBAAkB,CAClB,oBAGF,CAEA,aACE,+CAAyD,CACzD,iBACF,CAEA,oBACE,kBACF,CAGA,MACE,uBAAoC,CACpC,sBAAuB,CACvB,cAAe,CACf,gBACF,CAEA,YACE,YACF,CAEA,+BAcE,eAA4B,CAC5B,UACF,CAhBA,gCAcE,eAA4B,CAC5B,UACF,CAhBA,mCAcE,eAA4B,CAC5B,UACF,CAhBA,iCAcE,eAA4B,CAC5B,UACF,CAhBA,+BAcE,eAA4B,CAC5B,UACF,CAhBA,+BAcE,eAA4B,CAC5B,UACF,CAhBA,mCAcE,eAA4B,CAC5B,UACF,CAhBA,yCAcE,eAA4B,CAC5B,UACF,CAhBA,gCAcE,eAA4B,CAC5B,UACF,CAhBA,+BAcE,eAA4B,CAC5B,UACF,CAhBA,iCAcE,eAA4B,CAC5B,UACF,CAhBA,8BAcE,eAA4B,CAC5B,UACF,CAhBA,gCAcE,eAA4B,CAC5B,UACF,CAhBA,eAcE,eAA4B,CAC5B,UACF,CAEA,+BACE,+RAAiD,CAEjD,WAAY,CADZ,UAEF,CAEA,kCACE,uBAAoC,CAEpC,WAAY,CADZ,UAEF,CAEA,uCAEE,eAAgB,CAChB,uBAAwB,CACxB,oBAAqB,CAErB,YAAa,CAGb,WAAY,CAJZ,QAAS,CAGT,SAAU,CADV,cAGF,CAEA,mDAEE,gBAAiB,CACjB,gBACF,CAEA,wBAEE,gBAAqC,CADrC,iBAEF,CAEA,+BASE,6RAA+C,CAR/C,UAAW,CAIX,oBAAqB,CAErB,WAA0B,CAH1B,UAAmD,CAInD,gBAAwC,CANxC,iBAAkB,CAClB,KAAM,CAGN,UAIF,CAEA,kFAEE,6TACF,CAEA,sCAQE,+KAA4C,CAP5C,UAAW,CACX,aAAc,CAEd,UAA8B,CAE9B,UAA2B,CAC3B,iBAAkB,CAFlB,OAAyB,CAFzB,SAMF,CAEA,2BAEE,gBAAwC,CADxC,iBAEF,CAEA,kCAOE,oBAAmC,CACnC,oBAA+B,CAP/B,UAAW,CAGX,oBAAqB,CAErB,WAA6B,CAH7B,UAAsD,CAMtD,gBAAwC,CAPxC,iBAAkB,CAGlB,UAKF,CAEA,gDAEE,sBACF,CAHA,wCAEE,sBACF,CAEA,yCAUE,oaAA4C,CAC5C,2BAA4B,CAV5B,UAAW,CACX,aAAc,CAEd,WAA8B,CAG9B,UAEC,CAJD,iBAAkB,CAClB,OAAyB,CAHzB,UASF,CAGA,4CACE,oBACF,CAEA,mDACE,oDACF,CAEA,WAEE,kBAAmB,CADnB,YAAa,CAEb,sBAAuB,CACvB,aACF,CAEA,sCACE,cACF,CAEA,eACE,eACF,CAEA,OACE,8RAAwC,CAGxC,2BAA4B,CAC5B,WAAY,CACZ,oBAAqB,CAJrB,WAAY,CAKZ,gBAAiB,CAJjB,UAKF,CAGA,KACE,4CAAkD,CAClD,cACF,CAGA,OASE,eAAgB,CAChB,uBAAwB,CACxB,oBAAqB,CALrB,4SAAsD,CACtD,qCAAsC,CACtC,2BAA4B,CAP5B,kBAAmB,CAanB,mCAAkD,CAChD,gCAA+C,CAC1C,8BAA2C,CAXlD,cAAe,CAHf,WAAY,CAWZ,iBAAkB,CADlB,iBAAkB,CATlB,WAcF,CAGA,gBAhBE,sBAuBF,CAPA,SAIE,cAAe,CAEf,aAAc,CAHd,eAAgB,CAFhB,QAAS,CACT,SAKF,CACA,kBAEE,eAA0B,CAD1B,YAEF,CACA,mCAEE,gBAAiB,CADjB,iBAEF,CACA,yCACE,eAA4B,CAC5B,UAAqB,CACrB,YACF,CAJA,gDACE,eAA4B,CAC5B,UAAqB,CACrB,YACF,CAJA,yCACE,eAA4B,CAC5B,UAAqB,CACrB,YACF,CACA,0DAEE,kBAAmB,CADnB,aAAc,CAEd,oBACF,CACA,cAGE,eAA0B,CAE1B,gBAAiB,CACjB,kBAA6B,CAF7B,aAAc,CAFd,eAAgB,CADhB,iBAMF,CACA,qBAME,wDAAwE,CALxE,UAAW,CAGX,SAAU,CAFV,mBAAoB,CACpB,iBAAkB,CAElB,SAEF,CACA,+BACE,YAAa,CAEb,MAAO,CADP,iBAAkB,CAElB,QAAS,CACT,UACF,CACA,0HACE,SAAU,CAKV,qBAAsB,CAFtB,aAAc,CADd,gBAAiB,CADjB,iBAAkB,CAGlB,UAGF,CACA,wRACE,eAA4B,CAC5B,UACF,CACA,oBACE,iBACF,CACA,mFACE,aACF,CACA,kCAKE,4BAAyC,CAJzC,UAAW,CAEX,aAAc,CACd,SAAU,CAFV,mBAIF,CAGA,eACE,kBACF","file":"system.css","sourcesContent":["/*! system.css v0.1.11 - https://github.com/sakofchit/system.css */\n/**\n * system.css\n * Copyright (c) 2022 Sakun Acharige <sakun.co>\n */\n\n:root {\n --box-shadow: 2px 2px;\n\n /* Spacing */\n --element-spacing: 8px;\n --grouped-element-spacing: 6px;\n --radio-width: 12px;\n --checkbox-width: 13px;\n --radio-label-spacing: 6px;\n\n /* Some detailed computations for radio buttons and checkboxes (from 98.css) */\n --radio-total-width-precalc: var(--radio-width) + var(--radio-label-spacing);\n --radio-total-width: calc(var(--radio-total-width-precalc));\n --radio-left: calc(-1 * var(--radio-total-width-precalc));\n --radio-dot-width: 6px;\n --radio-dot-top: calc(var(--radio-width) / 2 - var(--radio-dot-width) / 2);\n --radio-dot-left: calc(\n -1 * (var(--radio-total-width-precalc)) + var(--radio-width) / 2 - var(\n --radio-dot-width\n ) / 2\n );\n\n --checkbox-total-width-precalc: var(--checkbox-width) +\n var(--radio-label-spacing);\n --checkbox-total-width: calc(var(--checkbox-total-width-precalc));\n --checkbox-left: calc(-1 * var(--checkbox-total-width-precalc));\n --checkmark-width: 12px;\n --checkmark-top: 2px;\n --checkmark-left: 2px;\n\n /* ---- ⚫️ Colors ⚪️ ---- */\n /* Base Tokens */\n --sys-color-white: #FFFFFF;\n --sys-color-black: #000000;\n --sys-color-grey: #A5A5A5;\n --sys-color-darkgrey: #B6B7B8;\n\n /* Theme Tokens */\n --primary: var(--sys-color-white);\n --secondary: var(--sys-color-black);\n --tertiary: var(--sys-color-grey);\n\n /* Component Tokens */\n --disabled: var(--sys-color-darkgrey);\n}\n\n@font-face {\n font-family: Chicago;\n src: url(\"fonts/ChicagoFLF.woff\") format(\"woff\");\n src: url(\"fonts/ChicagoFLF.woff2\") format(\"woff2\");\n}\n@font-face {\n font-family: Monaco;\n src: url(\"fonts/monaco.woff\") format(\"woff\");\n src: url(\"fonts/monaco.woff2\") format(\"woff2\");\n}\n\n/* Fonts below are recreations by Giles Booth */\n@font-face {\n font-family: Chicago_12;\n src: url(\"fonts/ChiKareGo2.woff\") format(\"woff\");\n src: url(\"fonts/ChiKareGo2.woff2\") format(\"woff2\");\n}\n@font-face {\n font-family: Geneva_9;\n src: url(\"fonts/FindersKeepers.woff\") format(\"woff\");\n src: url(\"fonts/FindersKeepers.woff2\") format(\"woff2\");\n}\n::-webkit-scrollbar {\n width: 22px;\n background-color: var(--primary);\n}\n\n::-webkit-scrollbar-track {\n background: linear-gradient(45deg, var(--secondary) 25%, transparent 25%, transparent 75%, var(--secondary) 75%, var(--secondary)), linear-gradient(45deg, var(--secondary) 25%, transparent 25%, transparent 75%, var(--secondary) 75%, var(--secondary));\n background-color: var(--primary);\n background-size: 4px 4px;\n background-position: 0 0, 2px 2px;\n width: 10px;\n border-left: 3px solid var(--secondary);\n}\n\n::-webkit-scrollbar-thumb {\n width: 20px;\n box-sizing: content-box;\n background-color: var(--primary);\n border: 2px solid var(--secondary);\n border-right: none;\n}\n\n::-webkit-scrollbar-button:horizontal:start:decrement,\n::-webkit-scrollbar-button:horizontal:end:increment,\n::-webkit-scrollbar-button:vertical:start:decrement,\n::-webkit-scrollbar-button:vertical:end:increment {\n display: block;\n}\n\n::-webkit-scrollbar-button:vertical:start {\n background-repeat: no-repeat;\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-up.svg\");\n}\n::-webkit-scrollbar-button:vertical:start:active {\n background-repeat: no-repeat;\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-up-active.svg\");\n}\n::-webkit-scrollbar-button:vertical:end {\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-down.svg\");\n}\n::-webkit-scrollbar-button:vertical:end:active {\n background-repeat: no-repeat;\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-down-active.svg\");\n}\n\n::-webkit-scrollbar-button:horizontal:start {\n background-repeat: no-repeat;\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-left.svg\");\n}\n::-webkit-scrollbar-button:horizontal:start:active {\n background-repeat: no-repeat;\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-left-active.svg\");\n}\n::-webkit-scrollbar-button:horizontal:end {\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-right.svg\");\n}\n::-webkit-scrollbar-button:horizontal:end:active {\n background-repeat: no-repeat;\n height: 23.38px;\n background-image: svg-load(\"./icon/scrollbar-right-active.svg\");\n}\n\nbody {\n background: linear-gradient(90deg, var(--primary) 21px, transparent 1%) center, linear-gradient(var(--primary) 21px, transparent 1%) center, var(--secondary);\n background-size: 22px 22px;\n background-attachment: fixed;\n}\n\na {\n color: var(--secondary);\n text-decoration: underline;\n}\n\nhr {\n border-top: 0.15em solid var(--secondary);\n}\n\n/*.container {\n width: 50%;\n margin: 0 auto;\n display: block;\n}\n*/\nh1,\n.heading {\n font-family: Chicago;\n font-size: 1em;\n}\n\nh2 {\n font-family: Chicago;\n font-size: 2em;\n}\n\n/* buttons */\n.standard-button {\n display: block;\n min-width: 59px;\n min-height: 20px;\n}\n\n/* dialogs & modals */\n.standard-dialog {\n border: 2px solid;\n padding: 10px;\n box-shadow: var(--box-shadow);\n background-color: var(--primary);\n}\n\n.modal-dialog, .alert-box {\n width: auto;\n padding: 13px;\n background: var(--primary);\n}\n\n.modal-contents, .alert-contents {\n padding: 10px;\n}\n\n.modeless-dialog {\n height: 100%;\n padding: 1.5rem 0.5rem 0.5rem 0.5rem;\n font-size: 18px;\n letter-spacing: -0.025em;\n}\n\n.inner-border {\n border-color: var(--secondary);\n border-top: 3.5px solid;\n border-bottom: 3.5px solid;\n border-left: 5px solid;\n border-right: 5px solid;\n}\n.outer-border {\n border-color: var(--secondary);\n border: 2px solid;\n padding: 3px;\n}\n\n/* title bar */\n.title-bar {\n flex: none;\n display: flex;\n align-items: center;\n height: 1.5rem;\n margin: 0.1rem 0;\n padding: 0.2rem 0.1rem;\n background: linear-gradient(var(--secondary) 50%, transparent 50%);\n background-size: 6.6666666667% 13.3333333333%;\n background-clip: content-box;\n}\n.title-bar .title {\n padding: 0 0.5em;\n margin: 0 auto;\n font-size: 1.5rem;\n font-weight: bold;\n line-height: 1.1;\n text-align: center;\n background: var(--primary);\n cursor: default;\n font-family: Chicago_12;\n}\n\n.inactive-title-bar {\n flex: none;\n display: flex;\n align-items: center;\n height: 1.5rem;\n margin: 0.1rem 0;\n padding: 0.2rem 0.1rem;\n background-size: 6.6666666667% 13.3333333333%;\n background-clip: content-box;\n}\n.inactive-title-bar .title {\n padding: 0 0.5em;\n margin: 0 auto;\n font-size: 1.5rem;\n font-weight: bold;\n line-height: 1.1;\n text-align: center;\n cursor: default;\n font-family: Chicago_12;\n color: var(--tertiary);\n}\n\n.title-bar button {\n position: relative;\n display: block;\n width: 40px;\n height: 40px;\n margin: 0 0.2rem;\n border: 4px solid var(--secondary);\n background-color: var(--primary);\n cursor: pointer;\n transform: scale(0.5);\n}\n.title-bar button span {\n position: absolute !important;\n clip: rect(1px 1px 1px 1px);\n /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n}\n.title-bar button.close::before, .title-bar button.close::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n opacity: 0;\n}\n.title-bar button.close::before {\n background: linear-gradient(var(--secondary) 0%, var(--secondary) 100%) left center, linear-gradient(var(--secondary) 0%, var(--secondary) 100%) right center, linear-gradient(var(--secondary) 0%, var(--secondary) 100%) center top, linear-gradient(var(--secondary) 0%, var(--secondary) 100%) center bottom;\n background-size: 30% 4px, 30% 4px, 4px 30%, 4px 30%;\n background-repeat: no-repeat;\n}\n.title-bar button.close::after {\n background: linear-gradient(var(--secondary) 0%, var(--secondary) 100%) left center, linear-gradient(var(--secondary) 0%, var(--secondary) 100%) right center, linear-gradient(var(--secondary) 0%, var(--secondary) 100%) center top, linear-gradient(var(--secondary) 0%, var(--secondary) 100%) center bottom;\n background-size: 22.5% 3.6363636364px, 22.5% 3.6363636364px, 3.6363636364px 22.5%, 3.6363636364px 22.5%;\n background-repeat: no-repeat;\n transform: rotate(45deg) scale(1.1);\n}\n.title-bar button.close:active::before, .title-bar button.close:active::after {\n opacity: 1;\n}\n.title-bar button.resize {\n background: linear-gradient(var(--secondary) 0%, var(--secondary) 100%) left 58%, linear-gradient(to bottom, var(--secondary) 0%, var(--secondary) 100%) 58% top;\n background-size: 60% 4px, 4px 60%;\n background-repeat: no-repeat;\n background-color: var(--primary);\n}\n.title-bar button.resize:active {\n background: var(--primary);\n}\n.title-bar button.hidden {\n visibility: hidden;\n}\n\n.window {\n flex-direction: column;\n margin: 1rem;\n min-width: 320px;\n overflow: hidden;\n background-color: var(--primary);\n border: 0.1em solid var(--secondary);\n font-family: \"Inconsolata\", Menlo, Chicago, Geneva;\n}\n.window-pane {\n overflow-y: scroll;\n height: 100%;\n padding: 1rem 2rem;\n font-size: 18px;\n letter-spacing: -0.025em;\n /*margin-bottom: 1rem;*/\n}\n.window-pane::-webkit-scrollbar {\n width: 22px;\n background-color: var(--primary);\n}\n.window-pane::-webkit-scrollbar-track {\n background: linear-gradient(45deg, var(--secondary) 25%, transparent 25%, transparent 75%, var(--secondary) 75%, var(--secondary)), linear-gradient(45deg, var(--secondary) 25%, transparent 25%, transparent 75%, var(--secondary) 75%, var(--secondary));\n background-color: var(--primary);\n background-size: 4px 4px;\n background-position: 0 0, 2px 2px;\n width: 10px;\n border-left: 4px solid var(--secondary);\n}\n.window-pane::-webkit-scrollbar-thumb {\n width: 20px;\n box-sizing: content-box;\n background-color: var(--primary);\n border: 2px solid var(--secondary);\n border-right: none;\n}\n\n.separator {\n flex: none;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n /*padding: 0.4rem 0.8rem;*/\n border-top: 0.1rem solid var(--secondary);\n border-width: 0.1rem 0;\n font-size: 1rem;\n}\n\n.details-bar {\n flex: none;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n padding: 0.4rem 0.8rem;\n border: 0.1rem solid var(--secondary);\n border-width: 0.1rem 0;\n font-size: 1rem;\n font-weight: 100;\n}\n\n\n/* buttons */\n.btn, .btn-default {\n min-height: 20px;\n min-width: 59px;\n padding: 0 20px;\n text-align:center;\n background: var(--primary);\n border-style: solid;\n border-width: 5.5px;\n border-image: url(\"./icon/button.svg\") 30 stretch;\n color: var(--secondary);\n text-align: center;\n text-decoration: none;\n font-size: 18px;\n font-family: Chicago_12;\n cursor: pointer;\n}\n\n.btn:active {\n background: var(--secondary);\n border-radius:6px;\n color: var(--primary);\n font-family: Chicago_12;\n}\n\n.btn:disabled {\n min-height: 20px;\n min-width: 59px;\n text-align:center;\n background: var(--primary);\n border-style: solid;\n border-width: 5.5px;\n border-image: url(\"./icon/button.svg\") 30 stretch;\n color: var(--disabled);\n text-align: center;\n text-decoration: none;\n font-size: 18px;\n font-family: Chicago_12;\n}\n\n.btn-default {\n border-image: url(\"./icon/button-default.svg\") 60 stretch;\n border-width: 0.5em;\n}\n\n.btn-default:active {\n border-radius: 12px;\n}\n\n/* text input */\ninput {\n border: 1.5px solid var(--secondary);\n font-family: Chicago_12;\n font-size: 18px;\n padding-left: 5px;\n}\n\ninput:focus {\n outline:none;\n}\n\ninput[type=\"text\"]:focus-visible,\ninput[type=\"email\"]:focus-visible,\ninput[type=\"password\"]:focus-visible,\ninput[type=\"number\"]:focus-visible,\ninput[type=\"date\"]:focus-visible,\ninput[type=\"time\"]:focus-visible,\ninput[type=\"datetime\"]:focus-visible,\ninput[type=\"datetime-local\"]:focus-visible,\ninput[type=\"month\"]:focus-visible,\ninput[type=\"week\"]:focus-visible,\ninput[type=\"search\"]:focus-visible,\ninput[type=\"tel\"]:focus-visible,\ninput[type=\"color\"]:focus-visible,\ntextarea:focus {\n background: var(--secondary);\n color: var(--primary);\n}\n\ninput[type=\"radio\"] + label::before {\n border-image: svg-load(\"./icon/radio-border.svg\");\n width: 20px;\n height: 20px;\n}\n\ninput[type=\"checkbox\"] + label::before {\n border: 1.5px solid var(--secondary);\n width: 20px;\n height: 20px;\n}\n\ninput[type=\"radio\"],\ninput[type=\"checkbox\"] {\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n margin: 0;\n background: 0;\n position: fixed;\n opacity: 0;\n border: none;\n}\n\ninput[type=\"radio\"] + label,\ninput[type=\"checkbox\"] + label {\n line-height: 13px;\n padding-left: 5px;\n}\n\ninput[type=\"radio\"] + label {\n position: relative;\n margin-left: var(--radio-total-width);\n}\n\ninput[type=\"radio\"] + label::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: calc(-1 * (var(--radio-total-width-precalc)));\n display: inline-block;\n width: var(--radio-width);\n height: var(--radio-width);\n margin-right: var(--radio-label-spacing);\n background: svg-load(\"./icon/radio-border.svg\");\n}\n\ninput[type=\"radio\"]:focus-visible + label::before,\ninput[type=\"radio\"]:hover + label::before {\n background-image: svg-load(\"./icon/radio-border-focused.svg\");\n}\n\ninput[type=\"radio\"]:checked + label::after {\n content: \"\";\n display: block;\n width: var(--radio-dot-width);\n height: var(--radio-dot-width);\n top: var(--radio-dot-top);\n left: var(--radio-dot-left);\n position: absolute;\n background: svg-load(\"./icon/radio-dot.svg\");\n}\n\ninput[type=\"checkbox\"] + label {\n position: relative;\n margin-left: var(--checkbox-total-width);\n}\n\ninput[type=\"checkbox\"] + label::before {\n content: \"\";\n position: absolute;\n left: calc(-1 * (var(--checkbox-total-width-precalc)));\n display: inline-block;\n width: var(--checkbox-width);\n height: var(--checkbox-width);\n background: var(--button-highlight);\n box-shadow: var(--border-field);\n margin-right: var(--radio-label-spacing);\n}\n\ninput[type=\"checkbox\"]:focus-visible + label::before,\ninput[type=\"checkbox\"]:hover + label::before {\n outline: 1px solid var(--secondary);\n}\n\ninput[type=\"checkbox\"]:checked + label::after {\n content: \"\";\n display: block;\n width: var(--checkmark-width);\n height: var(--checkmark-width);\n position: absolute;\n top: var(--checkmark-top);\n left: calc(\n -1 * (var(--checkbox-total-width-precalc)) + var(--checkmark-left)\n );\n background: svg-load(\"./icon/checkmark.svg\");\n background-repeat: no-repeat;\n}\n\n\ninput[type=\"checkbox\"][disabled] + label::before {\n background: var(--surface);\n}\n\ninput[type=\"checkbox\"][disabled]:checked + label::after {\n background: svg-load(\"./icon/checkmark-disabled.svg\");\n}\n\n.field-row {\n display: flex;\n align-items: center;\n font-family: Chicago_12;\n font-size: 1em;\n}\n\n[class^=\"field-row\"] + [class^=\"field-row\"] {\n margin-top: var(--grouped-element-spacing);\n}\n\n.field-row > * + * {\n margin-left: var(--grouped-element-spacing);\n}\n\n.apple {\n background: svg-load(\"./icon/apple.svg\");\n height: 22px;\n width: 18px;\n background-repeat: no-repeat;\n border: none;\n display: inline-block;\n margin-right: 2px;\n}\n\n/* Form */\nform {\n font-family: \"Inconsolata\", Menlo, Chicago, Geneva;\n font-size:14px;\n}\n\n/* select menu */\nselect {\n border: 1.5px solid;\n height: auto;\n width: 10rem;\n font-family: Chicago_12;\n font-size: 18px;\n background-image: svg-load(\"./icon/select-button.svg\");\n background-position: top 2px right 2px;\n background-repeat: no-repeat;\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n position: relative;\n padding-left: 20px;\n -webkit-box-shadow: 2px 8px 0 0px var(--secondary);\n\t -moz-box-shadow: 2px 8px 0 0px var(--secondary);\n\t box-shadow: 2px 2px 0 -1px var(--secondary);\n}\n\n/* menu-bar */\nul[role] {\n margin: 0;\n padding: 0;\n list-style: none;\n cursor: pointer;\n font-family: Chicago_12;\n font-size: 1em;\n}\nul[role=\"menu-bar\"] {\n display: flex;\n background: var(--primary);\n}\nul[role=\"menu-bar\"] > [role=\"menu-item\"] {\n position: relative;\n padding: 6px 10px;\n}\nul[role=\"menu-bar\"] > [role=\"menu-item\"]:focus, ul[role=\"menu-bar\"] > [role=\"menu-item\"]:focus-within, ul[role=\"menu-bar\"] > [role=\"menu-item\"]:hover {\n background: var(--secondary);\n color: var(--primary);\n outline: none;\n}\nul[role=\"menu-bar\"] > [role=\"menu-item\"][aria-haspopup=\"false\"] * {\n color: inherit;\n background: inherit;\n text-decoration: none;\n}\nul[role=\"menu\"] {\n position: relative;\n min-width: 200px;\n background: var(--primary);\n color: initial;\n border: 1px solid;\n box-shadow: var(--box-shadow);\n}\nul[role=\"menu\"]::before {\n content: \"\";\n pointer-events: none;\n position: absolute;\n left: 28px;\n width: 2px;\n box-shadow: inset 1px 0 rgba(0, 0, 0, 0.15), inset -1px 0 var(--primary);\n}\n[role=\"menu-item\"] ul[role=\"menu\"] {\n display: none;\n position: absolute;\n left: 0;\n top: 100%;\n z-index: 99;\n}\nul[role=\"menu\"] > [role=\"menu-item\"] > a, ul[role=\"menu\"] > [role=\"menu-item\"] > button, ul[role=\"menu\"] > [role=\"menu-item\"][aria-haspopup=\"true\"] {\n all: unset;\n position: relative;\n padding: 5px 20px;\n display: block;\n width: 100%;\n box-sizing: border-box;\n\n}\nul[role=\"menu\"] > [role=\"menu-item\"] > a:hover, ul[role=\"menu\"] > [role=\"menu-item\"] > button:hover, ul[role=\"menu\"] > [role=\"menu-item\"][aria-haspopup=\"true\"]:hover, ul[role=\"menu\"] > [role=\"menu-item\"] > a:focus, ul[role=\"menu\"] > [role=\"menu-item\"] > button:focus, ul[role=\"menu\"] > [role=\"menu-item\"][aria-haspopup=\"true\"]:focus {\n background: var(--secondary);\n color: var(--primary);\n}\nul [role=\"menu-item\"] {\n position: relative;\n}\nul [role=\"menu-item\"]:focus > [role=\"menu\"], ul [role=\"menu-item\"]:focus-within > [role=\"menu\"] {\n display: block;\n}\nul [role=\"menu-item\"].divider::after {\n content: \"\";\n pointer-events: none;\n display: block;\n padding: 0;\n border-top: 1.5px dotted var(--secondary);\n}\n\n/* styles specific to demo page */\n.menu-items > li {\n margin-bottom: 1rem;\n}\n"]} |