style: remove emojis from startup logs and add developer attribution banner

src/app/main.py

@@ -30,11 +30,15 @@ app = FastAPI(
 @app.on_event("startup")
 async def startup_event():
     """Initialize the application on startup"""
-    logger.info(f"🚀 Starting {settings.APP_NAME} v1.0.0")
-    logger.info(f"📊 Environment: {settings.ENVIRONMENT}")
-    logger.info(f"🗄️  Database: Connected to Supabase")
-    logger.info(f"🔑 Supabase URL: {settings.SUPABASE_URL}")
-    logger.info("✅ Application startup complete")
+    logger.info("=" * 60)
+    logger.info("Built by Lewis Kimaru")
+    logger.info("=" * 60)
+    logger.info(f"Starting {settings.APP_NAME} v1.0.0")
+    logger.info(f"Environment: {settings.ENVIRONMENT}")
+    logger.info(f"Database: Connected to Supabase")
+    logger.info(f"Supabase URL: {settings.SUPABASE_URL}")
+    logger.info("Application startup complete")
+    logger.info("=" * 60)
 
 # Mount static files
 app.mount("/static", StaticFiles(directory=str(static_dir)), name="static")

src/app/static/css/main.css

@@ -1,4 +1,4 @@
-/* SwiftOps API - Main Stylesheet */
+/* SwiftOps API - Main Stylesheet - Dark Mode */
 
 * {
     margin: 0;
@@ -6,174 +6,140 @@
     box-sizing: border-box;
 }
 
-:root {
-    --bg-primary: #ffffff;
-    --bg-secondary: #f8f9fa;
-    --bg-card: #ffffff;
-    --text-primary: #1a1a1a;
-    --text-secondary: #6c757d;
-    --border-color: #dee2e6;
-    --accent-color: #0066cc;
-    --accent-hover: #0052a3;
-    --success-color: #28a745;
-    --shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-}
-
-@media (prefers-color-scheme: dark) {
-    :root {
-        --bg-primary: #1a1a1a;
-        --bg-secondary: #2d2d2d;
-        --bg-card: #2d2d2d;
-        --text-primary: #ffffff;
-        --text-secondary: #b0b0b0;
-        --border-color: #404040;
-        --accent-color: #4da3ff;
-        --accent-hover: #66b3ff;
-        --success-color: #4caf50;
-        --shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-    }
-}
-
 body {
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-    background: var(--bg-primary);
-    color: var(--text-primary);
+    background: #0a0a0a;
+    color: #e0e0e0;
     line-height: 1.6;
     min-height: 100vh;
     display: flex;
     flex-direction: column;
+    align-items: center;
+    padding: 2rem 1rem;
 }
 
 .container {
-    max-width: 1200px;
+    width: 100%;
+    max-width: 800px;
     margin: 0 auto;
-    padding: 2rem;
-    flex: 1;
 }
 
 header {
     text-align: center;
-    padding: 3rem 0 2rem;
-    border-bottom: 1px solid var(--border-color);
+    padding: 2rem 0 3rem;
+    border-bottom: 1px solid #2a2a2a;
     margin-bottom: 3rem;
 }
 
-.logo {
-    font-size: 3rem;
-    margin-bottom: 0.5rem;
-}
-
 h1 {
     font-size: 2.5rem;
     font-weight: 700;
     margin-bottom: 0.5rem;
-    color: var(--text-primary);
+    color: #ffffff;
+    letter-spacing: -0.5px;
 }
 
-.version {
-    display: inline-block;
-    background: var(--accent-color);
-    color: white;
-    padding: 0.25rem 0.75rem;
-    border-radius: 20px;
-    font-size: 0.875rem;
+h2 {
+    font-size: 1.5rem;
+    margin-bottom: 1.5rem;
+    color: #ffffff;
     font-weight: 600;
-    margin-left: 1rem;
 }
 
-.description {
-    font-size: 1.125rem;
-    color: var(--text-secondary);
-    margin-top: 1rem;
-    max-width: 600px;
-    margin-left: auto;
-    margin-right: auto;
+h3 {
+    font-size: 1rem;
+    margin-bottom: 0.5rem;
+    color: #ffffff;
+    font-weight: 600;
 }
 
-.status-badge {
-    display: inline-flex;
-    align-items: center;
-    gap: 0.5rem;
-    background: var(--bg-secondary);
-    padding: 0.5rem 1rem;
-    border-radius: 8px;
-    margin-top: 1.5rem;
-    font-weight: 500;
+p {
+    color: #888;
+    line-height: 1.6;
+}
+
+a {
+    color: #4a9eff;
+    text-decoration: none;
+    transition: color 0.2s;
 }
 
-.status-dot {
-    width: 8px;
-    height: 8px;
-    background: var(--success-color);
-    border-radius: 50%;
-    animation: pulse 2s infinite;
+a:hover {
+    color: #64b5f6;
 }
 
-@keyframes pulse {
-    0%, 100% { opacity: 1; }
-    50% { opacity: 0.5; }
+.description {
+    font-size: 1rem;
+    color: #888;
+    margin-top: 0.5rem;
 }
 
 .cards {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-    gap: 1.5rem;
-    margin-top: 2rem;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 1rem;
+    margin-bottom: 3rem;
 }
 
 .card {
-    background: var(--bg-card);
-    border: 1px solid var(--border-color);
-    border-radius: 12px;
+    background: #1a1a1a;
+    border: 1px solid #2a2a2a;
+    border-radius: 8px;
     padding: 1.5rem;
-    box-shadow: var(--shadow);
-    transition: transform 0.2s, box-shadow 0.2s;
+    text-align: center;
+    transition: all 0.2s;
+    cursor: pointer;
+    text-decoration: none;
+    color: inherit;
+    display: block;
 }
 
 .card:hover {
-    transform: translateY(-4px);
-    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
+    border-color: #4a9eff;
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(74, 158, 255, 0.1);
 }
 
 .card h3 {
-    font-size: 1.25rem;
-    margin-bottom: 0.75rem;
-    color: var(--text-primary);
+    font-size: 1rem;
+    margin-bottom: 0.5rem;
+    color: #ffffff;
+    font-weight: 600;
 }
 
 .card p {
-    color: var(--text-secondary);
-    margin-bottom: 1rem;
+    font-size: 0.875rem;
+    color: #888;
+    line-height: 1.4;
 }
 
-.endpoints {
-    margin-top: 3rem;
+.endpoints-section {
+    margin-bottom: 3rem;
 }
 
-.endpoints h2 {
-    font-size: 1.75rem;
+.endpoints-section h2 {
+    font-size: 1.5rem;
     margin-bottom: 1.5rem;
-    color: var(--text-primary);
+    color: #ffffff;
+    font-weight: 600;
 }
 
 .endpoint {
-    background: var(--bg-card);
-    border: 1px solid var(--border-color);
+    background: #1a1a1a;
+    border: 1px solid #2a2a2a;
     border-radius: 8px;
     padding: 1.25rem;
     margin-bottom: 1rem;
-    transition: border-color 0.2s;
-}
-
-.endpoint:hover {
-    border-color: var(--accent-color);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
 }
 
-.endpoint-header {
+.endpoint-left {
     display: flex;
     align-items: center;
     gap: 1rem;
-    margin-bottom: 0.75rem;
+    flex: 1;
 }
 
 .method {
@@ -181,153 +147,125 @@ h1 {
     padding: 0.25rem 0.75rem;
     border-radius: 4px;
     font-weight: 600;
-    font-size: 0.875rem;
+    font-size: 0.75rem;
     font-family: 'Courier New', monospace;
+    background: #1e3a5f;
+    color: #64b5f6;
+    min-width: 50px;
+    text-align: center;
     text-transform: uppercase;
 }
 
-.method.get {
-    background: #e3f2fd;
-    color: #1976d2;
-}
-
 .method.post {
-    background: #e8f5e9;
-    color: #388e3c;
+    background: #1b5e20;
+    color: #81c784;
 }
 
 .method.put {
-    background: #fff3e0;
-    color: #f57c00;
+    background: #e65100;
+    color: #ffb74d;
 }
 
 .method.patch {
-    background: #f3e5f5;
-    color: #7b1fa2;
+    background: #4a148c;
+    color: #ba68c8;
 }
 
 .method.delete {
-    background: #ffebee;
-    color: #d32f2f;
-}
-
-@media (prefers-color-scheme: dark) {
-    .method.get {
-        background: #1e3a5f;
-        color: #64b5f6;
-    }
-    
-    .method.post {
-        background: #1b5e20;
-        color: #81c784;
-    }
-    
-    .method.put {
-        background: #e65100;
-        color: #ffb74d;
-    }
-    
-    .method.patch {
-        background: #4a148c;
-        color: #ba68c8;
-    }
-    
-    .method.delete {
-        background: #b71c1c;
-        color: #ef5350;
-    }
+    background: #b71c1c;
+    color: #ef5350;
 }
 
 .endpoint-path {
     font-family: 'Courier New', monospace;
-    font-size: 1rem;
-    color: var(--text-primary);
+    font-size: 0.95rem;
+    color: #e0e0e0;
     font-weight: 500;
 }
 
-.endpoint-description {
-    color: var(--text-secondary);
-    margin-bottom: 0.5rem;
+.copy-btn, .btn {
+    background: #2a2a2a;
+    border: 1px solid #3a3a3a;
+    color: #888;
+    padding: 0.5rem 1rem;
+    border-radius: 6px;
+    cursor: pointer;
+    font-size: 0.875rem;
+    transition: all 0.2s;
+    font-family: inherit;
 }
 
-.endpoint-status {
-    display: inline-flex;
-    align-items: center;
-    gap: 0.5rem;
-    font-size: 0.875rem;
-    color: var(--success-color);
-    font-weight: 500;
+.copy-btn:hover, .btn:hover {
+    background: #3a3a3a;
+    color: #4a9eff;
+    border-color: #4a9eff;
 }
 
-.link-button {
-    display: inline-block;
-    background: var(--accent-color);
-    color: white;
-    padding: 0.75rem 1.5rem;
-    border-radius: 8px;
-    text-decoration: none;
-    font-weight: 600;
-    transition: background 0.2s, transform 0.2s;
-    margin-top: 1rem;
+.copy-btn.copied {
+    background: #1e4d2b;
+    color: #4ade80;
+    border-color: #4ade80;
 }
 
-.link-button:hover {
-    background: var(--accent-hover);
-    transform: translateY(-2px);
+.btn-primary {
+    background: #1e3a5f;
+    color: #64b5f6;
+    border-color: #1e3a5f;
+}
+
+.btn-primary:hover {
+    background: #2a4a6f;
+    border-color: #4a9eff;
 }
 
 footer {
     text-align: center;
-    padding: 2rem;
-    border-top: 1px solid var(--border-color);
-    color: var(--text-secondary);
-    margin-top: 3rem;
+    padding: 2rem 0;
+    border-top: 1px solid #2a2a2a;
+    color: #666;
+    font-size: 0.875rem;
+    margin-top: auto;
+    width: 100%;
+    max-width: 800px;
 }
 
-.footer-links {
+.footer-content {
     display: flex;
-    justify-content: center;
-    gap: 2rem;
-    margin-top: 1rem;
+    justify-content: space-between;
+    align-items: center;
 }
 
-.footer-links a {
-    color: var(--accent-color);
+.footer-link {
+    color: #4a9eff;
     text-decoration: none;
-    font-weight: 500;
     transition: color 0.2s;
 }
 
-.footer-links a:hover {
-    text-decoration: underline;
+.footer-link:hover {
+    color: #64b5f6;
 }
 
 @media (max-width: 768px) {
-    .container {
-        padding: 1rem;
-    }
-
-    h1 {
-        font-size: 2rem;
-    }
-
-    .version {
-        display: block;
-        margin: 0.5rem auto 0;
-        width: fit-content;
-    }
-
     .cards {
         grid-template-columns: 1fr;
     }
 
-    .endpoint-header {
+    .endpoint {
         flex-direction: column;
         align-items: flex-start;
+        gap: 1rem;
+    }
+
+    .copy-btn {
+        width: 100%;
     }
 
-    .footer-links {
+    .footer-content {
         flex-direction: column;
         gap: 0.5rem;
     }
+
+    h1 {
+        font-size: 2rem;
+    }
 }

src/app/templates/base.html

@@ -6,19 +6,198 @@
     <meta name="description" content="{% block meta_description %}SwiftOps API - Field Service Management Platform{% endblock %}">
     <title>{% block title %}SwiftOps API{% endblock %}</title>
     
-    <!-- Favicon -->
-    <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🚀</text></svg>">
-    
-    <!-- Styles -->
-    <link rel="stylesheet" href="{{ url_for('static', path='/css/main.css') }}">
-    
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+            background: #0a0a0a;
+            color: #e0e0e0;
+            line-height: 1.6;
+            min-height: 100vh;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            padding: 2rem 1rem;
+        }
+
+        .container {
+            width: 100%;
+            max-width: 800px;
+            margin: 0 auto;
+        }
+
+        header {
+            text-align: center;
+            padding: 2rem 0 3rem;
+            border-bottom: 1px solid #2a2a2a;
+            margin-bottom: 3rem;
+        }
+
+        h1 {
+            font-size: 2.5rem;
+            font-weight: 700;
+            margin-bottom: 0.5rem;
+            color: #ffffff;
+            letter-spacing: -0.5px;
+        }
+
+        h2 {
+            font-size: 1.5rem;
+            margin-bottom: 1.5rem;
+            color: #ffffff;
+            font-weight: 600;
+        }
+
+        h3 {
+            font-size: 1rem;
+            margin-bottom: 0.5rem;
+            color: #ffffff;
+            font-weight: 600;
+        }
+
+        p {
+            color: #888;
+            line-height: 1.6;
+        }
+
+        a {
+            color: #4a9eff;
+            text-decoration: none;
+            transition: color 0.2s;
+        }
+
+        a:hover {
+            color: #64b5f6;
+        }
+
+        .description {
+            font-size: 1rem;
+            color: #888;
+            margin-top: 0.5rem;
+        }
+
+        .cards {
+            display: grid;
+            grid-template-columns: repeat(3, 1fr);
+            gap: 1rem;
+            margin-bottom: 3rem;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border: 1px solid #2a2a2a;
+            border-radius: 8px;
+            padding: 1.5rem;
+            text-align: center;
+            transition: all 0.2s;
+            cursor: pointer;
+            text-decoration: none;
+            color: inherit;
+            display: block;
+        }
+
+        .card:hover {
+            border-color: #4a9eff;
+            transform: translateY(-2px);
+            box-shadow: 0 4px 12px rgba(74, 158, 255, 0.1);
+        }
+
+        .card h3 {
+            font-size: 1rem;
+            margin-bottom: 0.5rem;
+            color: #ffffff;
+            font-weight: 600;
+        }
+
+        .card p {
+            font-size: 0.875rem;
+            color: #888;
+            line-height: 1.4;
+        }
+
+        .btn {
+            background: #2a2a2a;
+            border: 1px solid #3a3a3a;
+            color: #e0e0e0;
+            padding: 0.75rem 1.5rem;
+            border-radius: 6px;
+            cursor: pointer;
+            font-size: 0.875rem;
+            transition: all 0.2s;
+            font-family: inherit;
+            text-decoration: none;
+            display: inline-block;
+        }
+
+        .btn:hover {
+            background: #3a3a3a;
+            color: #4a9eff;
+            border-color: #4a9eff;
+        }
+
+        .btn-primary {
+            background: #1e3a5f;
+            color: #64b5f6;
+            border-color: #1e3a5f;
+        }
+
+        .btn-primary:hover {
+            background: #2a4a6f;
+            border-color: #4a9eff;
+        }
+
+        footer {
+            text-align: center;
+            padding: 2rem 0;
+            border-top: 1px solid #2a2a2a;
+            color: #666;
+            font-size: 0.875rem;
+            margin-top: auto;
+            width: 100%;
+            max-width: 800px;
+        }
+
+        .footer-content {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+        }
+
+        .footer-link {
+            color: #4a9eff;
+            text-decoration: none;
+            transition: color 0.2s;
+        }
+
+        .footer-link:hover {
+            color: #64b5f6;
+        }
+
+        @media (max-width: 768px) {
+            .cards {
+                grid-template-columns: 1fr;
+            }
+
+            .footer-content {
+                flex-direction: column;
+                gap: 0.5rem;
+            }
+
+            h1 {
+                font-size: 2rem;
+            }
+        }
+    </style>
     {% block extra_css %}{% endblock %}
 </head>
 <body>
     {% block content %}{% endblock %}
     
-    <!-- Scripts -->
-    <script src="{{ url_for('static', path='/js/main.js') }}"></script>
     {% block extra_js %}{% endblock %}
 </body>
 </html>