fix: load FA locally instead of CDN; Alpine color input error via x-init+

2026-06-17 13:53:48 +07:00
parent 10d4c1156b
commit 2fb5d2a0f0
15 changed files with 71 additions and 16 deletions
@@ -15,6 +15,7 @@ document.addEventListener('alpine:init', () => {
    // ── Edit state ──
    editing: null,
    editForm: {
+      bg_color: '',
      actions: {
        tap: {},
        long_press: {},
@@ -6,7 +6,7 @@
 <title>StreamDeck</title>
 <script src="/static/app.js"></script>
 <script defer src="/static/alpine.min.js"></script>
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
+<link rel="stylesheet" href="/static/fontawesome/css/all.min.css">
 <link rel="stylesheet" href="/static/styles.css">
 </head>
 <body>
@@ -505,8 +505,8 @@
        <div class="form-group">
          <label>Background</label>
          <div style="display:flex;gap:8px;align-items:center;">
-            <input type="color" :value="editForm.bg_color || '#000000'"
-                   @input="editForm.bg_color = $event.target.value"
+            <input type="color"
+                   x-init="$el.value = editForm.bg_color || '#000000'; $el.addEventListener('input', () => editForm.bg_color = $el.value); $watch('editForm.bg_color', v => $el.value = v || '#000000')"
                   style="width:40px;height:40px;padding:2px;border-radius:var(--radius-xs);cursor:pointer;">
            <input type="text" x-model="editForm.bg_color"
                   placeholder="#rrggbb or #rrggbbaa" maxlength="9"