1 line
3.6 KiB
CSS
1 line
3.6 KiB
CSS
@font-face{font-family:Satoshi;src:url(//cdn.fontshare.com/wf/NWBQYJIM7GCZ5XWD7D26ARB3VDY55ZRT/K63EV2KZIGKLE7RANQ2U42S6SVHU5RJ7/X6XYTKIVDUW7GZTZPZNN4EUM5KH54KHF.woff2) format("woff2"),url(//cdn.fontshare.com/wf/NWBQYJIM7GCZ5XWD7D26ARB3VDY55ZRT/K63EV2KZIGKLE7RANQ2U42S6SVHU5RJ7/X6XYTKIVDUW7GZTZPZNN4EUM5KH54KHF.woff) format("woff"),url(//cdn.fontshare.com/wf/NWBQYJIM7GCZ5XWD7D26ARB3VDY55ZRT/K63EV2KZIGKLE7RANQ2U42S6SVHU5RJ7/X6XYTKIVDUW7GZTZPZNN4EUM5KH54KHF.ttf) format("truetype");font-weight:300 900;font-display:swap;font-style:normal}@font-face{font-family:Satoshi;src:url(//cdn.fontshare.com/wf/3JZIFUW7KLFSPLVCIUI2DLGNIER6IFCX/MMP4RUF5LYGUAZS3DCJC3GJ6F6SAGKSN/E3NEPGEAHYCHR37DSBXHV33XCYYRE2CY.woff2) format("woff2"),url(//cdn.fontshare.com/wf/3JZIFUW7KLFSPLVCIUI2DLGNIER6IFCX/MMP4RUF5LYGUAZS3DCJC3GJ6F6SAGKSN/E3NEPGEAHYCHR37DSBXHV33XCYYRE2CY.woff) format("woff"),url(//cdn.fontshare.com/wf/3JZIFUW7KLFSPLVCIUI2DLGNIER6IFCX/MMP4RUF5LYGUAZS3DCJC3GJ6F6SAGKSN/E3NEPGEAHYCHR37DSBXHV33XCYYRE2CY.ttf) format("truetype");font-weight:300 900;font-display:swap;font-style:italic}:root{--primary: #89b4fa;--text: #cdd6f4;--surface-2: #585b70;--surface-1: #45475a;--surface-0: #313244;--base: #1e1e2e;--mantle: #181825;--crust: #11111b;--app-radius: 25%}.material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 200,"opsz" 24}body,html{background-color:var(--crust);width:100vw;height:100vh;display:flex;flex-direction:column;margin:0;overflow:hidden}*::-webkit-scrollbar{display:none}*{box-sizing:border-box;-ms-overflow-style:none;scrollbar-width:none;font-family:Satoshi,sans-serif;font-weight:600;color:var(--text)}toolbar{width:100%;display:flex;gap:10px;background:var(--mantle);margin:0;padding:10px;border-radius:20px 20px 0 0;border:1px solid var(--surface-0);box-shadow:1px 3px 10px #0003,0 0 10px #0003;user-select:none;position:relvative;z-index:1001}toolbar>div{display:flex;align-self:center}toolbar>div.outlined{padding:10px;background:var(--base);border-radius:10px;border:1px solid var(--surface-0);box-shadow:1px 3px 10px #0000001a,0 0 10px #0000001a;align-items:center;justify-content:center}toolbar>div[data-toolbar-id=start]{cursor:pointer}toolbar>div[data-toolbar-id=start] *{transition:color .1s ease-in-out}toolbar>div[data-toolbar-id=start] *:hover{color:var(--primary)}toolbar>div[data-toolbar-id=controls]{gap:5px}toolbar>div[data-toolbar-id=controls] *{font-size:24px}toolbar>div[data-toolbar-id=plugins]{width:24px;cursor:pointer;padding:10px 0}toolbar>div app{display:flex;align-items:center;cursor:pointer}toolbar>div app img{aspect-ratio:1 / 1;height:35px;border-radius:var(--app-radius)}window-area{position:relative;width:calc(100% - 20px);height:100%;overflow:hidden;margin:10px}window-area window{resize:both;max-width:100%;max-height:100%;min-height:35px;min-width:210px;background:var(--base);display:flex;flex-direction:column;border-radius:5px;box-shadow:0 10px 10px #0003,0 0 10px #0003;overflow:hidden;border:1px solid;border-color:color-mix(in srgb,var(--text) 20%,transparent);background:var(--crust);transition:.2s opacity,.2s transform}window-area window window-header{height:35px;padding:7.5px;display:flex;align-items:center;gap:7.5px;user-select:none}window-area window window-header img{aspect-ratio:1 / 1;height:1.2em;border-radius:var(--app-radius)}window-area window window-content{height:100%;border-radius:10px 10px 0 0;background:var(--mantle);overflow:scroll}window-area window window-content h1{margin-top:0}.gradient-blur{mask:linear-gradient(to bottom,transparent,black 5%),linear-gradient(to top,transparent,black 35%);mask-size:100% 50%;mask-repeat:no-repeat;mask-position:top,bottom}
|