0.3.2 — refresh rate, custom widget data & Docker fixes

frontend/package.json

@@ -1,7 +1,7 @@
 {
   "name": "inker-frontend",
   "private": true,
-  "version": "0.3.1",
+  "version": "0.3.2",
   "type": "module",
   "scripts": {
     "dev": "bunx --bun vite",

frontend/src/pages/custom-widgets/CustomWidgetForm.tsx

@@ -1504,7 +1504,7 @@ export function CustomWidgetForm() {
                     </code>
                     <div className="flex items-center gap-1">
                       {field.isImageUrl && (
-                        <span className="text-pink-500 text-xs">🖼️</span>
+                        <span className="text-pink-500 text-xs font-bold">IMG</span>
                       )}
                       {field.isLink && !field.isImageUrl && (
                         <span className="text-accent text-xs">🔗</span>

frontend/src/pages/devices/AddDevice.tsx

@@ -103,28 +103,6 @@ export function AddDevice() {
           </h2>
 
           <div className="space-y-5">
-            {/* API URL Display */}
-            <div>
-              <label className="block text-sm font-medium text-text-secondary mb-2">
-                Server URL for your device
-              </label>
-              <div className="flex items-center space-x-2">
-                <code className="flex-1 text-sm bg-bg-muted px-4 py-3 rounded-lg border border-border-default font-mono">
-                  {deviceApiUrl}
-                </code>
-                <button
-                  type="button"
-                  onClick={handleCopyUrl}
-                  className="inline-flex items-center justify-center px-3 py-1.5 text-sm font-semibold text-white rounded-xl transition-all duration-200"
-                  style={{ backgroundColor: copied ? '#22c55e' : '#3b82f6' }}
-                  onMouseEnter={(e) => { e.currentTarget.style.backgroundColor = copied ? '#16a34a' : '#2563eb'; }}
-                  onMouseLeave={(e) => { e.currentTarget.style.backgroundColor = copied ? '#22c55e' : '#3b82f6'; }}
-                >
-                  {copied ? 'Copied!' : 'Copy'}
-                </button>
-              </div>
-            </div>
-
             {/* Status Warning */}
             {!status.isOnline && (
               <div className="p-4 bg-status-warning-bg border border-status-warning-border rounded-lg">
@@ -160,18 +138,33 @@ export function AddDevice() {
                     <code className="bg-bg-muted px-1 rounded">192.168.4.1</code> in your browser.
                   </p>
                 </li>
-                <li>
-                  <strong>Enter the server URL</strong>
-                  <p className="ml-6 mt-1 text-text-muted">
-                    Paste: <code className="bg-bg-muted px-1 rounded">{deviceApiUrl}</code>
-                  </p>
-                </li>
                 <li>
                   <strong>Enter your WiFi credentials</strong>
                   <p className="ml-6 mt-1 text-text-muted">
                     Select your home/office WiFi and enter the password.
                   </p>
                 </li>
+                <li>
+                  <strong>Set the Server URL in Advanced Settings</strong>
+                  <p className="ml-6 mt-1 text-text-muted">
+                    Open <strong>Advanced Settings</strong> in the captive portal and paste this URL into the <strong>API Server</strong> field:
+                  </p>
+                  <div className="ml-6 mt-2 flex items-center space-x-2">
+                    <code className="flex-1 text-sm bg-bg-muted px-4 py-3 rounded-lg border border-border-default font-mono">
+                      {deviceApiUrl}
+                    </code>
+                    <button
+                      type="button"
+                      onClick={handleCopyUrl}
+                      className="inline-flex items-center justify-center px-3 py-1.5 text-sm font-semibold text-white rounded-xl transition-all duration-200"
+                      style={{ backgroundColor: copied ? '#22c55e' : '#3b82f6' }}
+                      onMouseEnter={(e) => { e.currentTarget.style.backgroundColor = copied ? '#16a34a' : '#2563eb'; }}
+                      onMouseLeave={(e) => { e.currentTarget.style.backgroundColor = copied ? '#22c55e' : '#3b82f6'; }}
+                    >
+                      {copied ? 'Copied!' : 'Copy'}
+                    </button>
+                  </div>
+                </li>
                 <li>
                   <strong>Done!</strong>
                   <p className="ml-6 mt-1 text-text-muted">

frontend/src/pages/screens/ScreenDesigner.tsx

@@ -22,12 +22,6 @@ const CUSTOM_WIDGET_TEMPLATE_OFFSET = 10000;
 const RESOLUTION_PRESETS = [
   { label: 'TRMNL Standard', width: 800, height: 480, description: '800 x 480 px (landscape)' },
   { label: 'TRMNL Portrait', width: 480, height: 800, description: '480 x 800 px (portrait)' },
-  { label: 'Small Display', width: 400, height: 300, description: '400 x 300 px' },
-  { label: 'Medium Display', width: 640, height: 384, description: '640 x 384 px' },
-  { label: 'Large Display', width: 1024, height: 758, description: '1024 x 758 px' },
-  { label: 'E-Paper 2.9"', width: 296, height: 128, description: '296 x 128 px' },
-  { label: 'E-Paper 4.2"', width: 400, height: 300, description: '400 x 300 px' },
-  { label: 'E-Paper 7.5"', width: 800, height: 480, description: '800 x 480 px' },
 ];
 
 export function ScreenDesigner() {