Browse Source

Increase font weights to medium and add prominent dashboard link

Font weight adjustments (middle ground):
- Body text: normal → 500 (medium weight)
- Table cells: normal → 500
- Form inputs: normal → 500
- Code blocks: normal → 500
- Small text: normal → 500
- Headers remain: bold
- Labels remain: bold

Result: Readable but not too light or too heavy

Dashboard link on main page:
- Added prominent black button at top
- "→ OPEN WEB DASHBOARD ←" with arrows
- Full-width, centered, bold uppercase
- Black background, white text
- Inverts on hover (white bg, black text)
- Hard to miss - positioned right after system info

This makes the dashboard much more discoverable while maintaining
the 60s technical datasheet aesthetic!

👾 Generated with [Letta Code](https://letta.com)

Co-Authored-By: Letta <noreply@letta.com>
Cameron Pfiffer 4 months ago
parent
commit
196fddfce8
2 changed files with 32 additions and 13 deletions
  1. 26 7
      app.py
  2. 6 6
      dashboard.html

+ 26 - 7
app.py

@@ -302,7 +302,7 @@ async def root(request: Request):
                     margin: 0;
                     padding: 15px;
                     line-height: 1.5;
-                    font-weight: normal;
+                    font-weight: 500;
                 }
                 .container {
                     max-width: 900px;
@@ -342,7 +342,7 @@ async def root(request: Request):
                     font-size: 13px;
                     line-height: 1.6;
                     margin: 0;
-                    font-weight: normal;
+                    font-weight: 500;
                 }
                 .feature-list {
                     list-style: none;
@@ -351,7 +351,7 @@ async def root(request: Request):
                 }
                 .feature-list li {
                     padding: 4px 0;
-                    font-weight: normal;
+                    font-weight: 500;
                 }
                 .feature-list li:before {
                     content: "▪ ";
@@ -362,7 +362,7 @@ async def root(request: Request):
                     background: #f0f0f0;
                     padding: 2px 6px;
                     border: 1px solid #000;
-                    font-weight: normal;
+                    font-weight: 500;
                 }
                 pre {
                     background: #fafafa;
@@ -370,14 +370,14 @@ async def root(request: Request):
                     padding: 12px;
                     overflow-x: auto;
                     margin: 10px 0;
-                    font-weight: normal;
+                    font-weight: 500;
                 }
                 .endpoint {
                     background: #fafafa;
                     padding: 8px 12px;
                     margin: 6px 0;
                     border: 2px solid #000;
-                    font-weight: normal;
+                    font-weight: 500;
                 }
                 a {
                     color: #000;
@@ -393,7 +393,24 @@ async def root(request: Request):
                     border: 2px solid #000;
                     padding: 12px;
                     margin: 15px 0;
-                    font-weight: normal;
+                    font-weight: 500;
+                }
+                .dashboard-link {
+                    display: block;
+                    background: #000;
+                    color: white;
+                    padding: 15px;
+                    text-align: center;
+                    text-decoration: none;
+                    font-weight: bold;
+                    font-size: 16px;
+                    letter-spacing: 2px;
+                    margin: 20px 0;
+                    border: 3px solid #000;
+                }
+                .dashboard-link:hover {
+                    background: white;
+                    color: #000;
                 }
             </style>
         </head>
@@ -407,6 +424,8 @@ STATUS:   OPERATIONAL
 HOSTING:  FREE SERVERLESS DEPLOYMENT</pre>
             </div>
             
+            <a href="/dashboard" class="dashboard-link">→ OPEN WEB DASHBOARD ←</a>
+            
             <h2>FEATURES</h2>
             <ul class="feature-list">
                 <li>IMMEDIATE OR SCHEDULED MESSAGE DELIVERY</li>

+ 6 - 6
dashboard.html

@@ -12,7 +12,7 @@
             color: #000;
             padding: 15px;
             line-height: 1.5;
-            font-weight: normal;
+            font-weight: 500;
         }
         .container { max-width: 1400px; margin: 0 auto; background: white; padding: 30px; box-shadow: 0 0 20px rgba(0,0,0,0.1); }
         h1 { 
@@ -49,7 +49,7 @@
             color: #000;
             font-family: 'Courier New', monospace;
             font-size: 14px;
-            font-weight: normal;
+            font-weight: 500;
         }
         #api-key-section input:focus {
             outline: none;
@@ -143,7 +143,7 @@
             letter-spacing: 1px;
         }
         tr:hover { background: #fafafa; }
-        td { font-size: 14px; font-weight: normal; }
+        td { font-size: 14px; font-weight: 500; }
         
         /* Forms */
         .form-group {
@@ -166,7 +166,7 @@
             color: #000;
             font-family: 'Courier New', monospace;
             font-size: 15px;
-            font-weight: normal;
+            font-weight: 500;
         }
         input:focus, textarea:focus, select:focus {
             outline: none;
@@ -174,7 +174,7 @@
             box-shadow: none;
         }
         textarea { min-height: 80px; }
-        small { color: #666; font-size: 12px; font-weight: normal; }
+        small { color: #666; font-size: 12px; font-weight: 500; }
         
         /* Status badges */
         .badge {
@@ -199,7 +199,7 @@
         
         .hidden { display: none; }
         .error { color: #000; margin-top: 8px; font-weight: bold; }
-        .empty { text-align: center; padding: 30px; color: #666; font-weight: normal; }
+        .empty { text-align: center; padding: 30px; color: #666; font-weight: 500; }
         
         /* Loading spinner */
         .loading {