This commit is contained in:
Dobromir Popov
2026-07-07 20:16:40 +03:00
3 changed files with 1820 additions and 1678 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -5,8 +5,9 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>meshnet tracker</title> <title>meshnet tracker</title>
<style> <style>
:root { --bg:#0d1117; --panel:#161b22; --border:#30363d; --fg:#c9d1d9; :root { --bg:#0d1117; --panel:#161b22; --border:#30363d; --fg:#e6edf3;
--dim:#8b949e; --accent:#58a6ff; --ok:#3fb950; --bad:#f85149; --warn:#d29922; } --dim:#8b949e; --accent:#58a6ff; --ok:#3fb950; --bad:#f85149; --warn:#d29922;
--chat-input-bg:#21262d; --chat-user-bg:#1f4788; --chat-user-border:#388bfd; }
* { box-sizing:border-box; } * { box-sizing:border-box; }
html, body { height:100%; } html, body { height:100%; }
body { margin:0; background:var(--bg); color:var(--fg); body { margin:0; background:var(--bg); color:var(--fg);
@@ -114,7 +115,7 @@
.chat-session-item:hover .chat-session-delete, .chat-session-item:hover .chat-session-delete,
.chat-session-item.active .chat-session-delete { opacity:1; } .chat-session-item.active .chat-session-delete { opacity:1; }
.chat-session-delete:hover { color:var(--bad); background:#1a1012; } .chat-session-delete:hover { color:var(--bad); background:#1a1012; }
.chat-main { display:flex; flex-direction:column; min-height:0; min-width:0; } .chat-main { display:flex; flex-direction:column; min-height:0; min-width:0; color-scheme:dark; }
.chat-toolbar { .chat-toolbar {
display:flex; gap:12px; align-items:center; flex-shrink:0; display:flex; gap:12px; align-items:center; flex-shrink:0;
padding:10px 16px; border-bottom:1px solid var(--border); background:var(--panel); padding:10px 16px; border-bottom:1px solid var(--border); background:var(--panel);
@@ -122,10 +123,15 @@
.chat-toolbar label { .chat-toolbar label {
display:flex; align-items:center; gap:8px; color:var(--dim); margin:0; display:flex; align-items:center; gap:8px; color:var(--dim); margin:0;
} }
.chat-toolbar select { min-width:220px; max-width:min(420px, 50vw); } .chat-toolbar select {
min-width:220px; max-width:min(420px, 50vw);
color:var(--fg); background:var(--chat-input-bg); border:1px solid var(--border);
border-radius:6px; padding:6px 8px;
}
.chat-status { color:var(--dim); font-size:12px; margin-left:auto; } .chat-status { color:var(--dim); font-size:12px; margin-left:auto; }
.chat-messages { .chat-messages {
flex:1; overflow:auto; padding:24px 16px; min-height:0; flex:1; overflow:auto; padding:24px 16px; min-height:0;
background:var(--bg); color:var(--fg);
} }
.chat-messages-inner { .chat-messages-inner {
max-width:768px; margin:0 auto; display:flex; flex-direction:column; gap:20px; max-width:768px; margin:0 auto; display:flex; flex-direction:column; gap:20px;
@@ -139,13 +145,15 @@
.chat-row.assistant, .chat-row.error { justify-content:flex-start; } .chat-row.assistant, .chat-row.error { justify-content:flex-start; }
.chat-bubble { .chat-bubble {
max-width:85%; padding:12px 14px; border-radius:16px; line-height:1.55; max-width:85%; padding:12px 14px; border-radius:16px; line-height:1.55;
white-space:pre-wrap; word-break:break-word; font-size:13px; white-space:pre-wrap; word-break:break-word; font-size:14px; color:var(--fg);
} }
.chat-bubble.user { .chat-bubble.user {
background:#1f3a5f; border:1px solid #264a73; border-bottom-right-radius:4px; background:var(--chat-user-bg); border:1px solid var(--chat-user-border);
border-bottom-right-radius:4px; color:#f0f6fc;
} }
.chat-bubble.assistant { .chat-bubble.assistant {
background:transparent; border:0; padding-left:0; padding-right:0; max-width:100%; background:var(--panel); border:1px solid var(--border);
border-bottom-left-radius:4px; max-width:100%; color:var(--fg);
} }
.chat-bubble.error { .chat-bubble.error {
background:#1a1012; border:1px solid #5c2020; color:#ffb4b4; border-bottom-left-radius:4px; background:#1a1012; border:1px solid #5c2020; color:#ffb4b4; border-bottom-left-radius:4px;
@@ -157,16 +165,25 @@
.chat-compose { .chat-compose {
display:flex; gap:8px; align-items:flex-end; max-width:768px; margin:0 auto; display:flex; gap:8px; align-items:flex-end; max-width:768px; margin:0 auto;
padding:10px 12px; border:1px solid var(--border); border-radius:16px; padding:10px 12px; border:1px solid var(--border); border-radius:16px;
background:var(--bg); background:var(--chat-input-bg);
}
.chat-compose:focus-within {
border-color:var(--accent);
box-shadow:0 0 0 1px var(--accent);
} }
.chat-compose:focus-within { border-color:var(--accent); }
.chat-compose textarea { .chat-compose textarea {
flex:1; min-height:24px; max-height:200px; resize:none; width:auto; flex:1; min-height:24px; max-height:200px; resize:none; width:auto;
border:0; background:transparent; padding:2px 0; outline:none; border:0; background:transparent; padding:4px 0; outline:none;
color:var(--fg); caret-color:var(--accent); font:inherit; font-size:14px; line-height:1.5;
} }
.chat-compose textarea::placeholder { color:var(--dim); opacity:1; }
.chat-compose button { .chat-compose button {
flex-shrink:0; min-width:36px; height:36px; padding:0; flex-shrink:0; min-width:36px; height:36px; padding:0;
border-radius:8px; border:1px solid var(--border); border-radius:8px; border:1px solid var(--chat-user-border);
background:var(--chat-user-bg); color:#f0f6fc;
}
.chat-compose button:hover:not(:disabled) {
border-color:var(--accent); background:#2563b8;
} }
.chat-compose button:disabled { opacity:.45; cursor:not-allowed; } .chat-compose button:disabled { opacity:.45; cursor:not-allowed; }
.console { .console {

File diff suppressed because it is too large Load Diff