database setup for outsidethebox.top webhosting infrastructure project
https://data.outsidethebox.top
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
99 lines
4.9 KiB
99 lines
4.9 KiB
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif} |
|
.container{padding:16px} |
|
.topbar{position:sticky;top:0;display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:10px 14px;background:#111;color:#fff;z-index:5} |
|
.brand{font-weight:700;letter-spacing:.2px} |
|
.search{display:flex;gap:8px;align-items:center;flex:1;min-width:220px} |
|
.search input{width:100%;max-width:520px;padding:8px 10px;border-radius:10px;border:1px solid #333;background:#0e0e0e;color:#fff} |
|
.search button{padding:8px 12px;border-radius:10px;border:1px solid #333;background:#1d1d1d;color:#fff} |
|
.topbar nav a{color:#fff;text-decoration:none;margin:0 8px} |
|
.toggles{display:flex;gap:10px;align-items:center} |
|
.toggles button{padding:7px 10px;border-radius:10px;border:1px solid #333;background:#1d1d1d;color:#fff} |
|
.footer{margin-top:20px;} |
|
|
|
.row{display:flex;gap:12px;align-items:center} |
|
.between{justify-content:space-between} |
|
.actions{display:flex;gap:10px;flex-wrap:wrap} |
|
|
|
h1{margin:10px 0 14px;font-size:22px} |
|
.card{background:#151515;border:1px solid #2a2a2a;border-radius:14px;padding:14px;margin:12px 0;color:#e6e6e6} |
|
.subtle{color:#aaa;font-size:12px;margin-top:4px} |
|
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace} |
|
.right{text-align:right} |
|
.empty{margin-top:18px;color:#aaa} |
|
|
|
.flashes{margin:10px 0 14px} |
|
.flash{padding:10px 12px;border-radius:12px;margin:8px 0;border:1px solid #2a2a2a} |
|
.flash.ok{background:#0f2a17;color:#cfe} |
|
.flash.err{background:#2a1010;color:#ffd4d4} |
|
.flash.warn{background:#2a2410;color:#fff0c2} |
|
|
|
.btn{display:inline-block;padding:8px 12px;border-radius:12px;border:1px solid #333;background:#1d1d1d;color:#fff;text-decoration:none;cursor:pointer} |
|
.btn.primary{background:#0b2a5a;border-color:#214d9a} |
|
.btn.danger{background:#3a1414;border-color:#6a2a2a} |
|
.btn.small{padding:6px 10px;border-radius:10px;font-size:13px} |
|
|
|
.table{width:100%;border-collapse:collapse;background:#151515;color:#e6e6e6;border:1px solid #2a2a2a;border-radius:14px;overflow:hidden} |
|
.table th,.table td{border-bottom:1px solid #2a2a2a;padding:12px 10px;vertical-align:top;line-height:1.25} |
|
.table thead th{position:sticky;top: calc(var(--topbar-h, 54px) + 8px);background:#121212;z-index:3;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#bbb} |
|
.apex-row td{background:#101010;color:#fff} |
|
.details-row td{background:#0f0f0f} |
|
.details{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:#ddd} |
|
.hidden{display:none} |
|
|
|
.legend{display:flex;gap:14px;align-items:center;flex-wrap:wrap;color:#bbb;margin:10px 0 12px;font-size:13px} |
|
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;border:1px solid #444;margin-right:6px;vertical-align:middle} |
|
.dot-blank{background:transparent} |
|
.dot-green{background:#2ecc71;border-color:#2ecc71} |
|
.dot-red{background:#ff4d4d;border-color:#ff4d4d} |
|
.dot-yellow{background:#f1c40f;border-color:#f1c40f} |
|
.dot-orange{background:#ff8c1a;border-color:#ff8c1a} |
|
|
|
.form label{display:block;font-size:12px;color:#bbb;margin:8px 0 6px} |
|
.form input,.form textarea{width:100%;padding:9px 10px;border-radius:12px;border:1px solid #333;background:#0e0e0e;color:#fff;box-sizing:border-box} |
|
.form textarea{resize:vertical} |
|
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px} |
|
.checkbox{display:flex;gap:10px;align-items:center;color:#ddd} |
|
.ok{color:#86efac} |
|
.err{color:#fca5a5} |
|
.warn{color:#fde68a;margin-top:6px} |
|
|
|
.theme-light .topbar{background:#f5f5f5;color:#111} |
|
.theme-light .topbar nav a{color:#111} |
|
.theme-light .search input{background:#fff;color:#111;border-color:#ddd} |
|
.theme-light .search button,.theme-light .toggles button,.theme-light .btn{background:#fff;color:#111;border-color:#ddd} |
|
.theme-light .table{background:#fff;color:#111;border-color:#ddd} |
|
.theme-light .table th,.theme-light .table td{border-bottom:1px solid #eee} |
|
.theme-light .table thead th{background:#fafafa;color:#555} |
|
.theme-light .card{background:#fff;color:#111;border-color:#ddd} |
|
.theme-light .form input,.theme-light .form textarea{background:#fff;color:#111;border-color:#ddd} |
|
|
|
.mask .mono, .mask td.mono {filter: blur(4px)} |
|
|
|
|
|
/* FIX: prevent first row from sitting under the header row */ |
|
table tbody::before { |
|
content: ""; |
|
display: block; |
|
height: 60px; |
|
} |
|
|
|
|
|
/* Icon inside +Add Host button */ |
|
.btn-icon-img{width:18px;height:18px;vertical-align:middle;margin-right:8px;filter:brightness(1.2)} |
|
|
|
/* Make hostname clickable for edit (mobile-friendly) */ |
|
.hostlink{color:inherit;text-decoration:none} |
|
.hostlink:hover{text-decoration:underline} |
|
|
|
|
|
/* v3.1 - hosts header logo + inline actions */ |
|
.add-host-group{display:flex;align-items:center;gap:10px;flex-wrap:wrap} |
|
.add-host-logo-link{display:inline-flex;align-items:center} |
|
.add-host-logo{width:48px;height:48px;display:block} |
|
form.inline{display:inline;margin:0} |
|
.footer{margin-top:20px;} |
|
.footer-right{display:flex;gap:8px;align-items:center;opacity:0.9} |
|
.footer-right .sep{opacity:0.6} |
|
|
|
|
|
.footer-center{width:100%; text-align:center; opacity:.75; font-size:12px; padding:10px 0;}
|
|
|