You've already forked computing-box
Alexander Lyall
4facee954c
All checks were successful
Pre-release on non-main branches / prerelease (push) Successful in 24s
Signed-off-by: Alexander Lyall <alex@adcm.uk>
2 lines
6.2 KiB
CSS
2 lines
6.2 KiB
CSS
@font-face{font-family:DSEG7Classic;src:url(/fonts/DSEG7Classic-Regular.woff) format("woff"),url(/fonts/DSEG7Classic-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:SevenSegment;src:url(/fonts/Seven-Segment.woff2) format("woff2"),url(/fonts/Seven-Segment.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}.hex-sim{min-height:100vh;background:#14151c;color:#e7e8ee;padding:28px}.hex-font-number{font-family:DSEG7Classic,ui-monospace,monospace}.hex-font-mono{font-family:SevenSegment,ui-monospace,monospace}.hex-main{max-width:1200px;margin:0 auto;width:100%;padding-top:40px}.hex-readout{text-align:center}.hex-label{font-family:SevenSegment,ui-sans-serif,system-ui;font-size:12px;letter-spacing:2px;opacity:.7}.hex-mt{margin-top:12px}.hex-number{font-family:DSEG7Classic,ui-monospace,monospace;font-size:76px;line-height:1;font-weight:400;color:#46ff8a;text-shadow:0 0 18px rgba(70,255,138,.18)}.hex-number--small{font-size:64px}.hex-number--tiny{font-size:54px;letter-spacing:6px}.hex-divider{margin:26px auto 18px;height:1px;width:min(760px,90%);background:#ffffff1a}.hex-digits{margin-top:18px;display:flex;justify-content:center;gap:18px;flex-wrap:wrap}.hex-digit-col{width:160px;border-radius:18px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);padding:12px;display:grid;gap:10px;justify-items:center}.hex-digit-controls{width:100%;display:flex;justify-content:center;gap:10px}.hex-digit-char{font-size:64px;line-height:1;color:#46ff8a;text-shadow:0 0 18px rgba(70,255,138,.18)}.hex-digit-place{font-family:SevenSegment,ui-monospace,monospace;opacity:.65;font-size:14px;letter-spacing:1px}.hex-bulbs{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:end}.hex-bulb{display:grid;justify-items:center;gap:6px;opacity:.35;filter:grayscale(30%);transition:opacity .16s ease,filter .16s ease}.hex-bulb .hex-bulb-cap{width:18px;height:18px;border-radius:999px;background:#ffffff38;border:1px solid rgba(255,255,255,.14)}.hex-bulb .hex-bulb-glow{width:18px;height:10px;border-radius:999px;background:#46ff8a00;box-shadow:0 0 #46ff8a00;transition:background .16s ease,box-shadow .16s ease}.hex-bulb .hex-bulb-label{font-family:SevenSegment,ui-monospace,monospace;font-size:12px;opacity:.8}.hex-bulb.is-on{opacity:1;filter:none}.hex-bulb.is-on .hex-bulb-cap{background:#ffffff59}.hex-bulb.is-on .hex-bulb-glow{background:#46ff8a40;box-shadow:0 0 18px #46ff8a59}.hex-btn{padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:#e7e8ee;font-weight:800;cursor:pointer;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.hex-btn:hover{background:#ffffff1a}.hex-btn--square{width:48px;height:48px;padding:0;display:grid;place-items:center;font-size:18px}.hex-btn--wide{width:100%}.hex-btn--green{background:#2ec8782e;border-color:#2ec87859}.hex-btn--green:hover{background:#2ec87842}.hex-btn--green2{background:#2ec8782e;border-color:#2ec87859}.hex-btn--red{background:#dc3c462e;border-color:#dc3c4659}.hex-btn--random.is-running{border-color:#50ffa08c;background:#2ec87838;box-shadow:0 0 18px #50ffa059;animation:hexPulseGreen .9s ease-in-out infinite}@keyframes hexPulseGreen{0%,to{box-shadow:0 0 14px #50ffa040}50%{box-shadow:0 0 26px #50ffa073}}.hex-btn--reset:hover{background:#dc3c4647;border-color:#ff505a8c;animation:hexPulseRed .9s ease-in-out infinite}@keyframes hexPulseRed{0%,to{box-shadow:0 0 12px #ff505a33}50%{box-shadow:0 0 22px #ff505a61}}.hex-toolbox-btn{position:fixed;top:88px;right:28px;z-index:30;display:inline-flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:#e7e8ee;font-weight:800;letter-spacing:1px;cursor:pointer}.hex-toolbox-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;color:#ff4fa6;filter:drop-shadow(0 0 10px rgba(255,79,166,.35))}.hex-toolbox{position:fixed;top:140px;right:28px;width:340px;display:grid;gap:14px;z-index:25;transform:translate(0);opacity:1;transition:transform .22s ease,opacity .22s ease}.hex-toolbox:not(.is-open){transform:translate(380px);opacity:0;pointer-events:none}.hex-panel{border-radius:16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);padding:14px}.hex-panel-title{font-family:SevenSegment,ui-sans-serif,system-ui;font-size:12px;letter-spacing:2px;opacity:.7;margin-bottom:10px}.hex-setting-title{font-weight:900;opacity:.9;margin-bottom:10px}.hex-width{display:grid;grid-template-columns:48px 1fr 48px;gap:10px;align-items:center}.hex-width-readout{border-radius:14px;background:#00000038;border:1px solid rgba(255,255,255,.1);padding:10px 12px;display:flex;justify-content:space-between;align-items:baseline}.hex-width-label{font-family:SevenSegment,ui-sans-serif,system-ui;opacity:.7;font-weight:800;letter-spacing:1px;font-size:12px}.hex-width-number{font-size:30px;font-weight:900;color:#46ff8a}.hex-hint{margin-top:8px;opacity:.65;font-size:12px;font-family:SevenSegment,ui-sans-serif,system-ui}.hex-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.hex-mt-sm{margin-top:10px}.hex-tools-top{display:flex;gap:10px;justify-content:center;margin-bottom:10px}.hex-tiny-note{margin-top:8px;font-size:11px;opacity:.6;letter-spacing:1px;font-family:SevenSegment,ui-sans-serif,system-ui}.hex-dialog{border:none;padding:0;background:transparent}.hex-dialog::backdrop{background:#0000008c}.hex-dialog-card{width:min(560px,92vw);border-radius:18px;background:#1a1b24;border:1px solid rgba(255,255,255,.12);padding:16px;color:#e7e8ee}.hex-dialog-title{font-weight:900;letter-spacing:1px;margin-bottom:10px;font-family:SevenSegment,ui-sans-serif,system-ui}.hex-dialog-input{width:100%;padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:#00000040;color:#e7e8ee;font-size:18px}.hex-dialog-hint{margin-top:10px;opacity:.7;font-size:13px;font-family:SevenSegment,ui-sans-serif,system-ui}.hex-dialog-error{margin-top:8px;font-size:13px;color:#ff6b6b;min-height:18px;font-family:SevenSegment,ui-sans-serif,system-ui}.hex-dialog-actions{margin-top:14px;display:flex;gap:10px;justify-content:flex-end}@media(max-width:900px){.hex-toolbox{width:min(360px,92vw);right:16px}.hex-toolbox-btn{right:16px}.hex-number{font-size:60px}.hex-number--tiny{font-size:40px;letter-spacing:4px}}
|