lee/hypermind
1
0
Fork 0
mirror of https://github.com/lklynet/hypermind.git synced 2026-05-03 17:40:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update css for new terminal

Browse Source
This commit is contained in:
Owen G
2026-01-06 21:03:54 -07:00
parent b4230ebc2f
commit b949a0605e
6 changed files with 131 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/style.css
+49 -28
View File
@@ -21,23 +21,32 @@ body.chat-collapsed {
}
.container { text-align: center; position: relative; z-index: 10; }
#network { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.count { font-size: 8rem; font-weight: bold; color: var(--color-count); transition: color 0.2s; visibility: hidden; }
.count.loaded { visibility: visible; }
.label { font-size: 1.5rem; color: #9ca3af; margin-top: 1rem; }
.label { font-size: 1.5rem; color: var(--color-text-main-label); margin-top: 1rem; }
.footer {
margin: 2rem auto 0;
font-size: 0.9rem;
color: #9ca3af;
color: var(--color-text-footer);
}
.debug {
font-size: 0.8rem;
color: #9ca3af;
color: var(--color-text-debug);
margin: 1rem auto 0;
}
.debug-link { color: #9ca3af; border-bottom: 1px dotted #9ca3af; cursor: pointer; }
.debug-link:hover { color: #e5e7eb; }
a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
.debug-link { color: var(--color-text-debug-link); border-bottom: 1px dotted var(--color-text-debug-link); cursor: pointer; transition: color 0.2s, border-color 0.2s;}
.debug-link:hover { color: var(--color-text-debug-link-hover); border-color : var(--color-text-debug-link-hover); }
a { color: var(--color-text-anchor-link); text-decoration: none; border-bottom: 1px dotted var(--color-text-anchor-link); }
.pulse { animation: pulse 0.5s ease-in-out; }
@keyframes pulse {
@@ -45,16 +54,18 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
50% { transform: scale(1.1); color: var(--color-pulse); }
100% { transform: scale(1); }
}
.footer a {
color: var(--color-text-footer);
border-bottom: 1px dotted var(--color-text-footer);
cursor: pointer;
transition: color 0.2s, border-color 0.2s;
}
.footer a:hover {
color: var(--color-text-footer-hover);
border-color: var(--color-text-footer-hover);
}
.modal {
display: none;
position: fixed;
@@ -65,7 +76,9 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
height: 100%;
background: var(--color-bg-overlay);
}
.modal.active { display: flex; align-items: center; justify-content: center; }
.modal-content {
background: var(--color-modal-bg);
border: 1px solid var(--color-modal-border);
@@ -74,6 +87,7 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
width: 90%;
position: relative;
}
.modal-content.map-content {
max-width: 1000px;
width: 100%;
@@ -110,13 +124,14 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
cursor: pointer;
transition: color 0.2s;
}
.close-btn:hover { color: var(--color-modal-close-btn-hover); }
color: #9ca3af;
.close-btn:hover {
color: var(--color-modal-close-btn-hover);
font-size: 1.2rem;
cursor: pointer;
z-index: 1001;
}
.close-btn:hover { color: #fff; }
.stat-row {
display: flex;
justify-content: space-between;
@@ -124,18 +139,23 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
border-bottom: 1px solid var(--color-modal-stat-div);
font-size: 0.85rem;
}
.stat-row:last-child { border-bottom: none; }
.stat-label { color: var(--color-modal-stat-label); }
.stat-value {
color: var(--color-modal-stat-value);
font-variant-numeric: tabular-nums;
}
.update-time {
text-align: center;
font-size: 0.7rem;
color: var(--color-modal-footer);
margin-top: 1rem;
}
.theme-btn {
position: fixed;
bottom: 1.5rem;
@@ -160,6 +180,7 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
.theme-btn:hover .material-symbols-outlined {
color: var(--color-theme-toggle-hover);
}
.terminal {
position: fixed;
@@ -169,8 +190,8 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
width: 800px;
max-width: 100%;
height: 250px;
background: rgba(0, 0, 0, 0.9);
border: 1px solid #333;
background: var(--color-terminal-bg);
border: 1px solid var(--color-terminal-border);
border-bottom: none;
border-radius: 8px 8px 0 0;
z-index: 100;
@@ -178,9 +199,9 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
display: flex;
flex-direction: column;
padding: 12px;
color: #4ade80;
color: var(--color-terminal-text-default);
font-size: 12px;
box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.3);
box-shadow: 0 -4px 12px var(--color-terminal-shadow);
transition: transform 0.3s ease;
}
@@ -201,11 +222,11 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
top: -24px;
left: 50%;
transform: translateX(-50%);
background: rgba(0, 0, 0, 0.9);
border: 1px solid #333;
background: var(--color-terminal-bg);
border: 1px solid var(--color-terminal-border);
border-bottom: none;
border-radius: 8px 8px 0 0;
color: #4ade80;
color: var(--color-terminal-tab-arrow);
cursor: pointer;
font-family: monospace;
font-weight: bold;
@@ -217,17 +238,18 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
display: flex;
align-items: center;
justify-content: center;
transition: color 0.2s, background 0.2s;
}
.terminal-toggle:hover {
color: #fff;
background: #222;
color: var(--color-terminal-tab-arrow-hover);
background: var(--color-terminal-tab-bg-hover);
}
.system-status-bar {
height: 20px;
margin-bottom: 5px;
color: #666;
color: var(--color-terminal-status-message);
font-style: italic;
white-space: nowrap;
overflow: hidden;
@@ -243,7 +265,7 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
flex-direction: column;
gap: 2px;
scrollbar-width: thin;
scrollbar-color: #333 transparent;
scrollbar-color: var(--color-terminal-scrollbar) transparent;
}
.terminal-output::-webkit-scrollbar {
@@ -255,38 +277,37 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
}
.terminal-output::-webkit-scrollbar-thumb {
background-color: #333;
background-color: var(--color-terminal-scrollbar);
border-radius: 3px;
}
.terminal-output::-webkit-scrollbar-thumb:hover {
background-color: #444;
background-color: var(--color-terminal-scrollbar-hover);
}
.terminal-input-line {
display: flex;
align-items: center;
border-top: 1px solid #333;
border-top: 1px solid var(--color-terminal-input-divider);
padding-top: 10px;
}
.prompt {
margin-right: 10px;
color: #4ade80;
}
#terminal-input {
flex: 1;
background: transparent;
border: none;
color: #fff;
color: var(--color-terminal-input-text);
font-family: inherit;
font-size: inherit;
outline: none;
}
.msg-system {
color: #666;
color: var(--color-terminal-status-message);
font-style: italic;
}
@@ -295,5 +316,5 @@ a { color: #9ca3af; text-decoration: none; border-bottom: 1px dotted #9ca3af; }
}
.msg-content {
color: #ddd;
color: var(--color-terminal-output-message);
}
public/themes/default.css
+16 -4
View File
@@ -5,18 +5,17 @@
--color-pulse: #fff;
--color-theme-toggle: #4ade80;
--color-theme-toggle-hover: #fff;
--color-bg-main: #111;
--color-bg-overlay: rgba(0, 0, 0, 0.8);
--color-text-default: #eee;
--color-text-secondary: #4b5563;
--color-text-main-label: #9ca3af;
--color-text-footer: #4b5563;
--color-text-footer-hover: #9ca3af;
--color-text-debug: #4b5563;
--color-text-debug-link: #4b5563;
--color-text-debug-link-hover: #9ca3af;
--color-bg-overlay: rgba(0, 0, 0, 0.8);
--color-bg-main: #111;
--color-text-anchor-link: #4b5563;
--color-modal-bg: #111;
--color-modal-border: #222;
@@ -28,4 +27,17 @@
--color-modal-stat-value: #9ca3af;
--color-modal-footer: #333;
--color-terminal-bg: rgba(0, 0, 0, 0.9);
--color-terminal-border: #333;
--color-terminal-shadow: rgba(0, 0, 0, 0.3);
--color-terminal-input-text: #fff;
--color-terminal-input-divider: #333;
--color-terminal-output-message: #ddd;
--color-terminal-tab-arrow: #4ade80;
--color-terminal-tab-arrow-hover: #fff;
--color-terminal-tab-bg-hover: #222;
--color-terminal-status-message: #666;
--color-terminal-scrollbar: #333;
--color-terminal-scrollbar-hover: #444;
--color-terminal-text-default: #4ade80;
}
public/themes/nord-dark.css
+18 -6
View File
@@ -5,18 +5,17 @@
--color-pulse: #eceff4;
--color-theme-toggle: #88c0d0;
--color-theme-toggle-hover: #eceff4;
--color-bg-main: #2e3440;
--color-bg-overlay: rgba(46, 52, 64, 0.8);
--color-text-default: #eee;
--color-text-secondary: #81a1c1;
--color-text-main-label: #5e81ac;
--color-text-footer: #81a1c1;
--color-text-footer-hover: #5e81ac;
--color-text-debug: #81a1c1;
--color-text-debug-link: #81a1c1;
--color-text-debug-link-hover: #5e81ac;
--color-bg-overlay: rgba(46, 52, 64, 0.8);
--color-bg-main: #2e3440;
--color-text-anchor-link: #81a1c1;
--color-modal-bg: #2e3440;
--color-modal-border: #434c5e;
@@ -24,8 +23,21 @@
--color-modal-close-btn: #434c5e;
--color-modal-close-btn-hover: #5e81ac;
--color-modal-stat-div: #434c5e;
--color-modal-stat-label: #5e81ac;
--color-modal-stat-value: #8fbcbb;
--color-modal-stat-label: #8fbcbb;
--color-modal-stat-value: #5e81ac;
--color-modal-footer: #434c5e;
--color-terminal-bg: rgba(46, 52, 64, 0.9);
--color-terminal-border: #434c5e;
--color-terminal-shadow: rgba(0, 0, 0, 0.3);
--color-terminal-input-text: #88c0d0;
--color-terminal-input-divider: #434c5e;
--color-terminal-output-message: #88c0d0;
--color-terminal-tab-arrow: #88c0d0;
--color-terminal-tab-arrow-hover: #eceff4;
--color-terminal-tab-bg-hover: #434c5e;
--color-terminal-status-message: #4c566a;
--color-terminal-scrollbar: #434c5e;
--color-terminal-scrollbar-hover: #4c566a;
--color-terminal-text-default: #88c0d0;
}
public/themes/solarized-light.css
+16 -4
View File
@@ -5,18 +5,17 @@
--color-pulse: #93a1a1;
--color-theme-toggle: #073642;
--color-theme-toggle-hover: #93a1a1;
--color-bg-main: #eee8d5;
--color-bg-overlay: rgba(238, 232, 213, 0.8);
--color-text-default: #eee;
--color-text-secondary: #657b83;
--color-text-main-label: #b58900;
--color-text-footer: #657b83;
--color-text-footer-hover: #b58900;
--color-text-debug: #657b83;
--color-text-debug-link: #657b83;
--color-text-debug-link-hover: #b58900;
--color-bg-overlay: rgba(238, 232, 213, 0.8);
--color-bg-main: #eee8d5;
--color-text-anchor-link: #657b83;
--color-modal-bg: #eee8d5;
--color-modal-border: #073642;
@@ -28,4 +27,17 @@
--color-modal-stat-value: #268bd2;
--color-modal-footer: #073642;
--color-terminal-bg: rgba(238, 232, 213, 0.8);
--color-terminal-border: #93a1a1;
--color-terminal-shadow: rgba(0, 0, 0, 0.3);
--color-terminal-input-text: #073642;
--color-terminal-input-divider: #93a1a1;
--color-terminal-output-message: #073642;
--color-terminal-tab-arrow: #268bd2;
--color-terminal-tab-arrow-hover: #fdf6e3;
--color-terminal-tab-bg-hover: #93a1a1;
--color-terminal-status-message: #586e75;
--color-terminal-scrollbar: #93a1a1;
--color-terminal-scrollbar-hover: #586e75;
--color-terminal-text-default: #268bd2;
}
public/themes/tokyo-night.css
+16 -4
View File
@@ -5,18 +5,17 @@
--color-pulse: #b4f9f8;
--color-theme-toggle: #f7768e;
--color-theme-toggle-hover: #b4f9f8;
--color-bg-main: #1a1b26;
--color-bg-overlay: rgba(26, 27, 38, 0.8);
--color-text-default: #eee;
--color-text-secondary: #9aa5ce;
--color-text-main-label: #bb9af7;
--color-text-footer: #9aa5ce;
--color-text-footer-hover: #bb9af7;
--color-text-debug: #9aa5ce;
--color-text-debug-link: #9aa5ce;
--color-text-debug-link-hover: #bb9af7;
--color-bg-overlay: rgba(26, 27, 38, 0.8);
--color-bg-main: #1a1b26;
--color-text-anchor-link: #9aa5ce;
--color-modal-bg: #1a1b26;
--color-modal-border: #414868;
@@ -28,4 +27,17 @@
--color-modal-stat-value: #ff9e64;
--color-modal-footer: #414868;
--color-terminal-bg: rgba(26, 27, 38, 0.9);
--color-terminal-border: #414868;
--color-terminal-shadow: rgba(0, 0, 0, 0.3);
--color-terminal-input-text: #b4f9f8;
--color-terminal-input-divider: #414868;
--color-terminal-output-message: #b4f9f8;
--color-terminal-tab-arrow: #ff9e64;
--color-terminal-tab-arrow-hover: #b4f9f8;
--color-terminal-tab-bg-hover: #414868;
--color-terminal-status-message: #565f89;
--color-terminal-scrollbar: #414868;
--color-terminal-scrollbar-hover: #565f89;
--color-terminal-text-default: #ff9e64;
}
public/themes/volcano.css
+16 -4
View File
@@ -5,18 +5,17 @@
--color-pulse: #ffd0aa;
--color-theme-toggle: #00bcd4;
--color-theme-toggle-hover: #ffd0aa;
--color-bg-main: #390000;
--color-bg-overlay: rgba(57, 0, 0, 0.8);
--color-text-default: #eee;
--color-text-secondary: #ffd0aa;
--color-text-main-label: #ffd0aa;
--color-text-footer: #7F6451;
--color-text-footer-hover: #ffd0aa;
--color-text-debug: #7F6451;
--color-text-debug-link: #7F6451;
--color-text-debug-link-hover: #ffd0aa;
--color-bg-overlay: rgba(57, 0, 0, 0.8);
--color-bg-main: #390000;
--color-text-anchor-link: #7F6451;
--color-modal-bg: #390000;
--color-modal-border: #ffd0aa;
@@ -28,4 +27,17 @@
--color-modal-stat-value: #00bcd4;
--color-modal-footer: #7F6451;
--color-terminal-bg: rgba(57, 0, 0, 0.9);
--color-terminal-border: #7F6451;
--color-terminal-shadow: rgba(0, 0, 0, 0.3);
--color-terminal-input-text: #ffd0aa;
--color-terminal-input-divider: #7F6451;
--color-terminal-output-message: #ffd0aa;
--color-terminal-tab-arrow: #00bcd4;
--color-terminal-tab-arrow-hover: #ffd0aa;
--color-terminal-tab-bg-hover: #7F6451;
--color-terminal-status-message: #7f3c3c;
--color-terminal-scrollbar: #7f3c3c;
--color-terminal-scrollbar-hover: #00bcd4;
--color-terminal-text-default: #ffd0aa;
}