Optimize browser GUI layout for iPad Air 4 / Safari
- Add viewport meta tag so Safari uses device CSS pixels - Move LCD units to a dedicated right-hand column; strip them from labels - Tighten LCD grid: 4-column layout, narrower gap, font-size 1.9em Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01SH2D4LRuCnhLSzoYerAfJX
This commit is contained in:
+8
-3
@@ -2,6 +2,7 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>BrewPi</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
@@ -88,21 +89,25 @@
|
||||
<div class="lcd-label"></div>
|
||||
<div>Ist</div>
|
||||
<div>Soll</div>
|
||||
<div></div>
|
||||
</div>
|
||||
<div class="lcd-row">
|
||||
<div class="lcd-label">Temperature [°C]</div>
|
||||
<div class="lcd-label">Temperature</div>
|
||||
<div class="lcd" id="lcd-temp-ist">--</div>
|
||||
<div class="lcd" id="lcd-temp-soll">--</div>
|
||||
<div class="lcd-unit">°C</div>
|
||||
</div>
|
||||
<div class="lcd-row">
|
||||
<div class="lcd-label">Heat rate [°C/min]</div>
|
||||
<div class="lcd-label">Heat rate</div>
|
||||
<div class="lcd" id="lcd-rate-ist">--</div>
|
||||
<div class="lcd" id="lcd-rate-soll">--</div>
|
||||
<div class="lcd-unit">°C/min</div>
|
||||
</div>
|
||||
<div class="lcd-row">
|
||||
<div class="lcd-label">Power [W]</div>
|
||||
<div class="lcd-label">Power</div>
|
||||
<div class="lcd" id="lcd-power-ist">--</div>
|
||||
<div class="lcd" id="lcd-power-soll">--</div>
|
||||
<div class="lcd-unit">W</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user