feat: Increase API key creation rate limit from 3 to 5 per hour; update modal styles for UI consistency

Author: Zingzy

api/v1/keys.py

@@ -40,7 +40,7 @@ def _parse_expires_at(value: Optional[str | int | float]):
 
 
 @api_v1.route("/keys", methods=["POST"])
-@limiter.limit("3 per hour", key_func=rate_limit_key_for_request)
+@limiter.limit("5 per hour", key_func=rate_limit_key_for_request)
 @requires_auth
 def create_api_key():
     body = request.get_json(silent=True) or {}

static/css/dashboard/keys.css

@@ -311,7 +311,7 @@
     right: 0;
     bottom: 0;
     background: rgba(0, 0, 0, 0.7);
-    backdrop-filter: blur(10px);
+    backdrop-filter: blur(10px) saturate(180%) brightness(0.7);
 }
 
 .modal-content {
@@ -320,8 +320,8 @@
     width: 100%;
     max-height: 90vh;
     overflow-y: auto;
-    background: linear-gradient(135deg, rgba(20, 25, 40, 0.98), rgba(15, 20, 35, 0.98));
-    backdrop-filter: blur(20px);
+    background: rgba(15, 20, 35, 0.5);
+    backdrop-filter: blur(60px);
     border: 1px solid var(--border-color);
     border-radius: var(--radius-lg);
     box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
@@ -344,9 +344,10 @@
     display: flex;
     justify-content: space-between;
     align-items: center;
-    padding: 24px 24px 20px 24px;
+    padding: 24px 20px;
     margin-bottom: 20px;
     border-bottom: 1px solid var(--border-color);
+    background: rgba(255, 255, 255, 0.02);
 }
 
 .modal-header h2 {
@@ -388,6 +389,7 @@
     gap: 12px;
     padding: 20px 24px 24px 24px;
     border-top: 1px solid var(--border-color);
+    background: rgba(255, 255, 255, 0.02);
     margin-top: 24px;
 }
 
@@ -466,7 +468,7 @@
     gap: 12px;
     padding: 16px;
     background: rgba(255, 255, 255, 0.03);
-    border: 2px solid var(--border-color);
+    border: 1px solid var(--border-color);
     border-radius: var(--radius-md);
     cursor: pointer;
     transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
@@ -740,6 +742,10 @@
     border-color: var(--accent-primary);
 }
 
+.token-input:focus {
+    border-color: var(--accent-primary);
+}
+
 .copy-btn {
     padding: 12px;
     background: rgba(255, 255, 255, 0.08);

static/css/dashboard/url-modal.css

@@ -30,7 +30,7 @@
     padding: 20px;
     position: relative;
     z-index: 2;
-    background: rgba(0, 0, 0, 0.5);
+    background: rgba(0, 0, 0, 0.7);
     -webkit-backdrop-filter: blur(10px) saturate(180%) brightness(0.7);
     backdrop-filter: blur(10px) saturate(180%) brightness(0.7);
 }
@@ -41,12 +41,11 @@
 
 /* Modal Content */
 .modal-content {
-    background: #1a1a1a;
+    backdrop-filter: blur(60px);
+    background: rgba(15, 20, 35, 0.5);
     border: 1px solid rgba(255, 255, 255, 0.1);
     border-radius: 16px;
-    box-shadow:
-        0 20px 40px rgba(0, 0, 0, 0.5),
-        0 0 0 1px rgba(255, 255, 255, 0.05);
+    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05);
     width: 100%;
     max-width: 800px;
     max-height: 90vh;
@@ -294,9 +293,8 @@
 .field input:focus,
 .field select:focus {
     outline: none;
-    border-color: var(--accent-color);
+    border-color: var(--accent-primary);
     background: rgba(255, 255, 255, 0.08);
-    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
 }
 
 .field input::placeholder {

static/js/dashboard/keys.js

@@ -180,10 +180,6 @@ function openKeySuccessModal(token, tokenPrefix) {
         } catch (error) {
             console.log('Auto-copy failed, user can copy manually');
         }
-
-        // Focus and select token for manual copy if needed
-        keyElements.tokenInput.focus();
-        keyElements.tokenInput.select();
     }, 100);
 }