diff --git a/web_server.py b/web_server.py index a5bcab1..35daf6a 100644 --- a/web_server.py +++ b/web_server.py @@ -394,20 +394,26 @@ def get_html(theme="dark"): /* Temp Grid */ .temp-grid {{ display: grid; - grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }} .temp-item {{ display: flex; - justify-content: space-between; - padding: 10px 15px; + flex-direction: column; + align-items: center; + padding: 12px; background: rgba(0,0,0,0.2); - border-radius: 6px; + border-radius: 8px; + text-align: center; }} - .temp-item .temp-value {{ font-weight: bold; }} + .temp-item .sensor-name {{ font-size: 0.8rem; color: var(--text-secondary); margin-bottom: 4px; }} + .temp-item .temp-value {{ font-weight: bold; font-size: 1.2rem; }} .temp-item .temp-value.high {{ color: var(--accent-danger); }} .temp-item .temp-value.medium {{ color: var(--accent-warning); }} .temp-item .temp-value.low {{ color: var(--accent-success); }} + .temp-section {{ margin-bottom: 20px; }} + .temp-section h4 {{ color: var(--accent-primary); margin-bottom: 10px; font-size: 0.9rem; display: flex; align-items: center; gap: 6px; }} + .temp-section h4 img {{ width: 16px; height: 16px; vertical-align: middle; }} /* Curve Editor */ .curve-point {{ @@ -880,7 +886,7 @@ def get_html(theme="dark"): if (groups.cpu1.length > 0) {{ const cores = groups.cpu1.filter(t => t.name.toLowerCase().includes('core')); const others = groups.cpu1.filter(t => !t.name.toLowerCase().includes('core')); - let html = '

🖥️ CPU 1

'; + let html = '

CPU 1

'; cores.forEach((t, i) => {{ const cls = t.value > 70 ? 'high' : t.value > 50 ? 'medium' : 'low'; html += `
Core ${{(i+1)}}${{t.value.toFixed(1)}}°C
`; @@ -898,7 +904,7 @@ def get_html(theme="dark"): if (groups.cpu2.length > 0) {{ const cores = groups.cpu2.filter(t => t.name.toLowerCase().includes('core')); const others = groups.cpu2.filter(t => !t.name.toLowerCase().includes('core')); - let html = '

🖥️ CPU 2

'; + let html = '

CPU 2

'; cores.forEach((t, i) => {{ const cls = t.value > 70 ? 'high' : t.value > 50 ? 'medium' : 'low'; html += `
Core ${{(i+1)}}${{t.value.toFixed(1)}}°C
`; @@ -914,7 +920,7 @@ def get_html(theme="dark"): // Render NVMe const nvmeEl = document.getElementById('temp-nvme'); if (groups.nvme.length > 0) {{ - let html = '

💾 NVMe SSD

'; + let html = '

NVMe SSD

'; groups.nvme.forEach((t, i) => {{ const cls = t.value > 70 ? 'high' : t.value > 50 ? 'medium' : 'low'; html += `
NVMe ${{(i+1)}}${{t.value.toFixed(1)}}°C
`; @@ -925,7 +931,7 @@ def get_html(theme="dark"): // Render RAID const raidEl = document.getElementById('temp-raid'); if (groups.raid.length > 0) {{ - let html = '

🔒 RAID Controller

'; + let html = '

RAID Controller

'; groups.raid.forEach((t, i) => {{ const cls = t.value > 70 ? 'high' : t.value > 50 ? 'medium' : 'low'; html += `
Controller ${{(i+1)}}${{t.value.toFixed(1)}}°C
`; @@ -936,7 +942,7 @@ def get_html(theme="dark"): // Render Ambient const ambientEl = document.getElementById('temp-ambient'); if (groups.ambient.length > 0 || groups.exhaust.length > 0 || groups.inlet.length > 0) {{ - let html = '

🌡️ Ambient / System

'; + let html = '

Ambient / System

'; [...groups.ambient, ...groups.exhaust, ...groups.inlet].forEach(t => {{ const cls = t.value > 40 ? 'high' : 'low'; const label = t.location === 'exhaust' ? 'Exhaust' : t.location === 'inlet' ? 'Inlet' : 'Ambient'; @@ -949,7 +955,7 @@ def get_html(theme="dark"): const otherEl = document.getElementById('temp-other'); const others = [...groups.pcie, ...groups.chipset, ...groups.other]; if (others.length > 0) {{ - let html = '

📊 Other Sensors

'; + let html = '

Other Sensors

'; others.forEach(t => {{ const cls = t.value > 70 ? 'high' : t.value > 50 ? 'medium' : 'low'; html += `
${{t.name}}${{t.value.toFixed(1)}}°C
`; @@ -1500,11 +1506,11 @@ def get_html(theme="dark"): fetchStatus(); -