refactor(Style): Add font abstraction and CSS-like styling constants

boards/esp32-32e-4/DisplayDriverTFT.cpp

@@ -1,9 +1,86 @@
 #include "DisplayDriverTFT.h"
 
+#include <Arduino.h>
 #include <KlubhausCore.h>
+#include <TFT_eSPI.h>
 
 extern DisplayManager display;
 
+// ── Fonts ───────────────────────────────────────────────────
+// TFT_eSPI built-in fonts for 320x480 display (scaled from 800x480)
+// Using FreeFonts - scaled bitmap fonts via setTextSize would be too pixelated
+// Note: FreeFonts are enabled via LOAD_GFXFF=1 in board-config.sh
+
+void DisplayDriverTFT::setTitleFont() { _tft.setFreeFont(&FreeSansBold18pt7b); }
+
+void DisplayDriverTFT::setBodyFont() { _tft.setFreeFont(&FreeSans12pt7b); }
+
+void DisplayDriverTFT::setLabelFont() { _tft.setFreeFont(&FreeSans9pt7b); }
+
+void DisplayDriverTFT::setDefaultFont() { _tft.setTextFont(2); }
+
+// ── Test harness ───────────────────────────────────────────────
+
+// Test harness: parse serial commands to inject synthetic touches
+// Commands:
+//   TEST:touch x y press   - simulate press at (x, y)
+//   TEST:touch x y release - simulate release at (x, y)
+//   TEST:touch clear       - clear test mode
+bool DisplayDriverTFT::parseTestTouch(int* outX, int* outY, bool* outPressed) {
+    if(!Serial.available())
+        return false;
+
+    if(Serial.peek() != 'T') {
+        return false;
+    }
+
+    String cmd = Serial.readStringUntil('\n');
+    cmd.trim();
+
+    if(!cmd.startsWith("TEST:touch"))
+        return false;
+
+    int firstSpace = cmd.indexOf(' ');
+    if(firstSpace < 0)
+        return false;
+
+    String args = cmd.substring(firstSpace + 1);
+    args.trim();
+
+    if(args.equals("clear")) {
+        _testMode = false;
+        Serial.println("[TEST] Test mode cleared");
+        return false;
+    }
+
+    int secondSpace = args.indexOf(' ');
+    if(secondSpace < 0)
+        return false;
+
+    String xStr = args.substring(0, secondSpace);
+    String yState = args.substring(secondSpace + 1);
+    yState.trim();
+
+    int x = xStr.toInt();
+    int y = yState.substring(0, yState.indexOf(' ')).toInt();
+    String state = yState.substring(yState.indexOf(' ') + 1);
+    state.trim();
+
+    bool pressed = state.equals("press");
+
+    Serial.printf("[TEST] Injecting touch: (%d,%d) %s\n", x, y, pressed ? "press" : "release");
+
+    if(outX)
+        *outX = x;
+    if(outY)
+        *outY = y;
+    if(outPressed)
+        *outPressed = pressed;
+
+    _testMode = true;
+    return true;
+}
+
 void DisplayDriverTFT::begin() {
     // Backlight
     pinMode(PIN_LCD_BL, OUTPUT);
@@ -74,14 +151,17 @@ void DisplayDriverTFT::drawBoot(const ScreenState& st) {
 
     _tft.fillScreen(TFT_BLACK);
     _tft.setTextColor(TFT_WHITE, TFT_BLACK);
-    _tft.setTextSize(2);
+
+    setTitleFont();
     _tft.setCursor(10, 10);
-    _tft.printf("KLUBHAUS v%s", FW_VERSION);
-    _tft.setTextSize(1);
+    _tft.print("KLUBHAUS");
+
+    setBodyFont();
     _tft.setCursor(10, 40);
     _tft.print(BOARD_NAME);
 
     // Show boot stage status
+    setLabelFont();
     _tft.setCursor(10, 70);
     switch(stage) {
     case BootStage::SPLASH:
@@ -113,15 +193,15 @@ void DisplayDriverTFT::drawAlert(const ScreenState& st) {
     _tft.fillScreen(bg);
     _tft.setTextColor(TFT_WHITE, bg);
 
-    _tft.setTextSize(3);
+    setTitleFont();
     _tft.setCursor(10, 20);
     _tft.print(st.alertTitle.length() > 0 ? st.alertTitle : "ALERT");
 
-    _tft.setTextSize(2);
+    setBodyFont();
     _tft.setCursor(10, 80);
     _tft.print(st.alertBody);
 
-    _tft.setTextSize(1);
+    setLabelFont();
     _tft.setCursor(10, DISPLAY_HEIGHT - 20);
     _tft.print("Hold to silence...");
 }
@@ -130,14 +210,15 @@ void DisplayDriverTFT::drawDashboard(const ScreenState& st) {
     _tft.fillScreen(TFT_BLACK);
 
     // Header
-    _tft.setTextColor(TFT_WHITE, TFT_BLACK);
-    _tft.setTextSize(1);
-    _tft.setCursor(5, 5);
-    _tft.printf("KLUBHAUS");
+    _tft.fillRect(0, 0, DISPLAY_WIDTH, 30, 0x1A1A); // Dark gray header
+    setBodyFont();
+    _tft.setTextColor(TFT_WHITE);
+    _tft.setCursor(5, 10);
+    _tft.print("KLUBHAUS");
 
     // WiFi indicator
-    _tft.setCursor(DISPLAY_WIDTH - 50, 5);
-    _tft.printf("WiFi:%s", st.wifiSsid.length() > 0 ? "ON" : "OFF");
+    _tft.setCursor(DISPLAY_WIDTH - 60, 10);
+    _tft.print(st.wifiSsid.length() > 0 ? "WiFi:ON" : "WiFi:OFF");
 
     // Get tile layouts from library helper
     int tileCount = display.calculateDashboardLayouts(30, 8);
@@ -160,8 +241,8 @@ void DisplayDriverTFT::drawDashboard(const ScreenState& st) {
         _tft.drawRoundRect(x, y, w, h, 8, TFT_WHITE);
 
         // Tile label
+        setBodyFont();
         _tft.setTextColor(TFT_WHITE);
-        _tft.setTextSize(2);
         int textLen = strlen(tileLabels[i]);
         int textW = textLen * 12;
         _tft.setCursor(x + w / 2 - textW / 2, y + h / 2 - 10);
@@ -173,6 +254,34 @@ void DisplayDriverTFT::drawDashboard(const ScreenState& st) {
 
 TouchEvent DisplayDriverTFT::readTouch() {
     TouchEvent evt;
+
+    // Check for test injection via serial
+    int testX, testY;
+    bool testPressed;
+    if(parseTestTouch(&testX, &testY, &testPressed)) {
+        if(testPressed && !_touchWasPressed) {
+            evt.pressed = true;
+            _touchDownX = testX;
+            _touchDownY = testY;
+            evt.downX = _touchDownX;
+            evt.downY = _touchDownY;
+        } else if(!testPressed && _touchWasPressed) {
+            evt.released = true;
+            evt.downX = _touchDownX;
+            evt.downY = _touchDownY;
+        }
+
+        if(testPressed) {
+            evt.x = testX;
+            evt.y = testY;
+            evt.downX = _touchDownX;
+            evt.downY = _touchDownY;
+        }
+
+        _touchWasPressed = testPressed;
+        return evt;
+    }
+
     uint16_t tx, ty;
     uint8_t touched = _tft.getTouch(&tx, &ty, 100);
 

boards/esp32-32e-4/DisplayDriverTFT.h

@@ -19,6 +19,12 @@ public:
     // Dashboard - uses transform for touch coordinate correction
     void transformTouch(int* x, int* y) override;
 
+    // Fonts
+    void setTitleFont() override;
+    void setBodyFont() override;
+    void setLabelFont() override;
+    void setDefaultFont() override;
+
 private:
     void drawBoot(const ScreenState& st);
     void drawAlert(const ScreenState& st);
@@ -36,4 +42,8 @@ private:
     bool _touchWasPressed = false;
     int _touchDownX = -1;
     int _touchDownY = -1;
+
+    // Test mode for touch injection
+    bool _testMode = false;
+    bool parseTestTouch(int* outX, int* outY, bool* outPressed);
 };

boards/esp32-32e-4/board-config.sh

@@ -1,4 +1,4 @@
 FQBN="esp32:esp32:esp32:FlashSize=4M,PartitionScheme=default"
 PORT="/dev/ttyUSB0"
 LIBS="--libraries ./vendor/esp32-32e-4/TFT_eSPI"
-OPTS="-DDEBUG_MODE -DBOARD_HAS_PSRAM"
+OPTS="-DDEBUG_MODE -DBOARD_HAS_PSRAM -DLOAD_GFXFF=1"

boards/esp32-32e-4/board_config.h

@@ -15,4 +15,23 @@
 #define PIN_LCD_BL 27
 
 // Touch — XPT2046 configured in tft_user_setup.h
-// Touch CS: GPIO33, Touch IRQ: GPIO36
+// Touch CS: GPIO33, Touch IRQ: GPIO36
+
+// ── Style Constants (CSS-like) ────────────────────────────────────────
+// Spacing - scaled for 320x480
+#define STYLE_SPACING_X 6
+#define STYLE_SPACING_Y 6
+#define STYLE_HEADER_HEIGHT 24
+#define STYLE_TILE_GAP 4
+#define STYLE_TILE_PADDING 8
+#define STYLE_TILE_RADIUS 4
+
+// Colors
+#define STYLE_COLOR_BG TFT_BLACK
+#define STYLE_COLOR_HEADER 0x1A1A
+#define STYLE_COLOR_FG TFT_WHITE
+#define STYLE_COLOR_ALERT TFT_RED
+#define STYLE_COLOR_TILE_1 0x0280
+#define STYLE_COLOR_TILE_2 0x0400
+#define STYLE_COLOR_TILE_3 0x0440
+#define STYLE_COLOR_TILE_4 0x0100

boards/esp32-32e-4/esp32-32e-4.ino

@@ -4,7 +4,14 @@
 
 #include "DisplayDriverTFT.h"
 #include "board_config.h"
+
+// Include local secrets.h if it exists (board-specific credentials),
+// otherwise KlubhausCore/src/secrets.h provides defaults.
+#ifdef LOCAL_SECRETS
 #include "secrets.h"
+#else
+#include <secrets.h>
+#endif
 
 #include <KlubhausCore.h>