39 lines
2.9 KiB
CSS
39 lines
2.9 KiB
CSS
*{box-sizing:border-box;margin:0;padding:0}
|
|
body{font-family:-apple-system,sans-serif;background:#0d1117;color:#c9d1d9;padding:16px;max-width:480px;margin:0 auto}
|
|
.container{display:flex;flex-direction:column;gap:12px}
|
|
header{text-align:center;padding:12px 0}
|
|
.title{font-size:22px;font-weight:700;color:#58a6ff}
|
|
.subtitle{font-size:13px;color:#8b949e}
|
|
.card{background:#161b22;border:1px solid #30363d;border-radius:8px;padding:14px}
|
|
.card-title{font-size:14px;font-weight:600;color:#58a6ff;margin-bottom:10px}
|
|
.dashboard{display:grid;grid-template-columns:1fr 1fr;gap:8px}
|
|
.stat{background:#0d1117;border-radius:6px;padding:8px;text-align:center}
|
|
.stat .l{font-size:11px;color:#8b949e;display:block}
|
|
.stat .v{font-size:15px;font-weight:600;display:block}
|
|
.green{color:#3fb950}.red{color:#f85149}.yellow{color:#d29922}
|
|
.source-selector{display:flex;gap:8px;margin-bottom:12px}
|
|
.src-btn{flex:1;padding:10px;border:1px solid #30363d;border-radius:6px;background:#0d1117;color:#8b949e;cursor:pointer;font-size:14px}
|
|
.src-btn.active{background:#1f6feb33;border-color:#1f6feb;color:#58a6ff}
|
|
.hidden{display:none}
|
|
label{font-size:12px;color:#8b949e;display:block;margin-bottom:4px}
|
|
input,select{width:100%;padding:10px;border:1px solid #30363d;border-radius:6px;background:#0d1117;color:#c9d1d9;font-size:14px}
|
|
.row{display:flex;gap:8px;margin-bottom:12px}.row>div{flex:1}
|
|
.num{width:100%}
|
|
.primary{width:100%;padding:12px;border:none;border-radius:6px;background:#238636;color:#fff;font-size:14px;font-weight:600;cursor:pointer;margin-top:8px}
|
|
.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
|
|
.btn{padding:12px;border:1px solid #30363d;border-radius:6px;background:#21262d;color:#c9d1d9;cursor:pointer;text-align:center;font-size:13px}
|
|
.btn.danger{border-color:#f8514944;color:#f85149}
|
|
.btn.warning{border-color:#d2992244;color:#d29922}
|
|
.console{background:#0d1117;border:1px solid #30363d;border-radius:6px;padding:10px;height:180px;overflow-y:auto;font-family:monospace;font-size:11px;color:#8b949e}
|
|
.console .ok{color:#3fb950}.console .err{color:#f85149}.console .info{color:#58a6ff}
|
|
.log-count{font-size:11px;color:#8b949e;font-weight:normal}
|
|
.btn-sm{padding:2px 8px;border:1px solid #30363d;border-radius:4px;background:#21262d;color:#c9d1d9;cursor:pointer;font-size:11px;float:right}
|
|
.muted{color:#8b949e;font-size:12px;text-align:center;padding:10px}
|
|
.device-info{font-size:12px;overflow-x:auto}
|
|
.di-table{width:100%;border-collapse:collapse;margin-bottom:8px}
|
|
.di-table td{padding:4px 6px;border:1px solid #30363d;vertical-align:top}
|
|
.di-lbl{color:#8b949e;white-space:nowrap;width:80px}
|
|
.di-cam{background:#0d1117;border:1px solid #30363d;border-radius:6px;padding:8px;margin-top:8px}
|
|
.di-cam-title{font-size:13px;font-weight:600;color:#58a6ff;margin-bottom:6px}
|
|
.size-badge{display:inline-block;background:#1f6feb33;border:1px solid #1f6feb44;border-radius:3px;padding:1px 5px;margin:1px;font-size:10px;color:#58a6ff}
|