53 lines
2.6 KiB
HTML
53 lines
2.6 KiB
HTML
<!doctype html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>Родительский контроль</title>
|
|
<style>
|
|
:root { color-scheme: dark; }
|
|
* { box-sizing: border-box; }
|
|
[v-cloak] { display: none; }
|
|
body { margin:0; padding:16px; background:#14161a; color:#e6e8eb;
|
|
font:14px/1.5 system-ui, "Segoe UI", sans-serif; }
|
|
h1 { font-size:18px; margin:0 0 16px; }
|
|
h2 { font-size:14px; margin:0 0 10px; color:#9aa4b2; font-weight:600; }
|
|
.card { background:#1c1f26; border:1px solid #2a2f3a; border-radius:10px;
|
|
padding:14px; margin-bottom:14px; }
|
|
button { background:#2a2f3a; color:#e6e8eb; border:1px solid #3a4150;
|
|
border-radius:6px; padding:4px 10px; cursor:pointer; font-size:13px; }
|
|
button:hover { background:#343a47; }
|
|
button:disabled { opacity:.5; cursor:default; background:#2a2f3a; }
|
|
button.danger { border-color:#6b2b2b; color:#ff9b9b; }
|
|
button.danger:hover { background:#3a1f1f; }
|
|
input, select { background:#14161a; color:#e6e8eb; border:1px solid #3a4150;
|
|
border-radius:6px; padding:5px 8px; font-size:13px; }
|
|
table { width:100%; border-collapse:collapse; }
|
|
th { text-align:left; color:#9aa4b2; font-weight:500; padding:4px 6px;
|
|
border-bottom:1px solid #2a2f3a; font-size:12px; }
|
|
td { padding:4px 6px; border-bottom:1px solid #22262f; }
|
|
tr.blocked td:first-child { color:#ff9b9b; }
|
|
.scroll { max-height:340px; overflow:auto; }
|
|
.row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
|
|
.chips { margin-top:12px; }
|
|
.chip { display:inline-flex; align-items:center; gap:4px; background:#232833;
|
|
border:1px solid #3a4150; border-radius:20px; padding:3px 6px 3px 12px;
|
|
margin:6px 6px 0 0; font-size:13px; }
|
|
.chip button { border:0; background:none; color:#9aa4b2; padding:0 4px; }
|
|
.right { text-align:right; white-space:nowrap; }
|
|
.muted { color:#6b7484; }
|
|
.warn { color:#e0b872; }
|
|
pre { margin:0; font:12px/1.6 ui-monospace, Consolas, monospace; color:#9aa4b2;
|
|
white-space:pre-wrap; max-height:200px; overflow:auto; }
|
|
code { font:12px/1.5 ui-monospace, Consolas, monospace; color:#c8d0da;
|
|
background:#232833; border-radius:4px; padding:1px 4px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app" v-cloak></div>
|
|
<!-- Vue отдаёт сама служба: панель не должна зависеть от сети, тем более от
|
|
разрешения имён, которым служба и управляет. -->
|
|
<script src="/vue.js"></script>
|
|
<script src="/app.js"></script>
|
|
</body>
|
|
</html> |