rds_ssm_connect 1.8.1 → 1.8.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rds_ssm_connect",
-  "version": "1.8.1",
+  "version": "1.8.2",
   "type": "module",
   "repository": {
     "type": "git",

package/src/App.svelte

@@ -95,6 +95,16 @@ async function initApp() {
   loadingProjects = true
 
   try {
+    // Wait for Tauri IPC bridge before importing modules
+    await withTimeout(
+      new Promise((resolve) => {
+        if (window.__TAURI_INTERNALS__) return resolve()
+        const id = setInterval(() => {
+          if (window.__TAURI_INTERNALS__) { clearInterval(id); resolve() }
+        }, 50)
+      }),
+      5000,
+    )
     const [core, event, windowModule] = await withTimeout(
       Promise.all([
         import('@tauri-apps/api/core'),
@@ -672,6 +682,37 @@ const isAlreadySaved = $derived(
 </main>
 
 <style>
+  :global(:root) {
+    --glass-bg: rgba(255, 255, 255, 0.04);
+    --glass-bg-hover: rgba(255, 255, 255, 0.07);
+    --glass-border: rgba(255, 255, 255, 0.08);
+    --glass-border-hover: rgba(255, 255, 255, 0.14);
+    --glass-blur: blur(16px) saturate(1.8);
+    --glass-blur-heavy: blur(32px) saturate(1.8);
+    --glass-inner-glow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
+    --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+    --press-scale: scale(0.97);
+    --transition-fast: 0.15s ease;
+    --transition-normal: 0.2s ease;
+  }
+
+  @media (prefers-reduced-transparency) {
+    :global(:root) {
+      --glass-bg: rgba(30, 30, 50, 0.95);
+      --glass-bg-hover: rgba(40, 40, 60, 0.95);
+      --glass-blur: none;
+      --glass-blur-heavy: none;
+    }
+  }
+
+  @media (prefers-reduced-motion) {
+    :global(:root) {
+      --press-scale: none;
+      --transition-fast: 0s;
+      --transition-normal: 0s;
+    }
+  }
+
   :global(*) {
     box-sizing: border-box;
   }
@@ -793,9 +834,12 @@ const isAlreadySaved = $derived(
     flex-direction: column;
     gap: 12px;
     padding: 16px;
-    background: rgba(251, 191, 36, 0.1);
+    background: var(--glass-bg);
+    -webkit-backdrop-filter: var(--glass-blur);
+    backdrop-filter: var(--glass-blur);
     border: 1px solid rgba(251, 191, 36, 0.2);
     border-radius: 12px;
+    box-shadow: var(--glass-inner-glow);
     animation: fadeIn 0.3s ease-out;
   }
 
@@ -847,6 +891,10 @@ const isAlreadySaved = $derived(
     background: #fcd34d;
   }
 
+  .btn-save:active {
+    transform: var(--press-scale);
+  }
+
   .btn-dismiss-save {
     padding: 6px 14px;
     font-size: 0.8rem;
@@ -869,9 +917,12 @@ const isAlreadySaved = $derived(
     align-items: flex-start;
     gap: 12px;
     padding: 16px;
-    background: rgba(239, 68, 68, 0.1);
+    background: var(--glass-bg);
+    -webkit-backdrop-filter: var(--glass-blur);
+    backdrop-filter: var(--glass-blur);
     border: 1px solid rgba(239, 68, 68, 0.2);
     border-radius: 16px;
+    box-shadow: var(--glass-inner-glow);
     animation: slideIn 0.3s ease-out;
   }
 
@@ -965,6 +1016,10 @@ const isAlreadySaved = $derived(
     color: #a1a1aa;
   }
 
+  .settings-btn:active {
+    transform: var(--press-scale);
+  }
+
   .check-updates-btn {
     padding: 6px 12px;
     font-size: 0.7rem;
@@ -983,6 +1038,10 @@ const isAlreadySaved = $derived(
     color: #a1a1aa;
   }
 
+  .check-updates-btn:active:not(:disabled) {
+    transform: var(--press-scale);
+  }
+
   .check-updates-btn:disabled {
     opacity: 0.7;
     cursor: wait;

package/src/lib/ActiveConnections.svelte

@@ -135,10 +135,13 @@ function handleHeaderKeydown(e, connectionId) {
 
 <style>
   .active-connections-card {
-    background: rgba(255, 255, 255, 0.03);
-    border: 1px solid rgba(52, 211, 153, 0.2);
+    background: var(--glass-bg);
+    -webkit-backdrop-filter: var(--glass-blur);
+    backdrop-filter: var(--glass-blur);
+    border: 1px solid rgba(16, 185, 129, 0.3);
     border-radius: 20px;
     padding: 24px;
+    box-shadow: var(--glass-inner-glow);
   }
 
   .card-header {
@@ -195,6 +198,10 @@ function handleHeaderKeydown(e, connectionId) {
     border-color: rgba(239, 68, 68, 0.3);
   }
 
+  .btn-disconnect-all:active {
+    transform: var(--press-scale);
+  }
+
   .connections-list {
     display: flex;
     flex-direction: column;

package/src/lib/ConfirmDialog.svelte

@@ -57,12 +57,15 @@ function handleKeydown(e) {
   }
 
   .confirm-dialog {
-    background: linear-gradient(145deg, #1a1a2e 0%, #16162a 100%);
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: rgba(26, 26, 46, 0.85);
+    -webkit-backdrop-filter: var(--glass-blur-heavy);
+    backdrop-filter: var(--glass-blur-heavy);
+    border: 1px solid var(--glass-border);
     border-radius: 16px;
     padding: 24px;
     max-width: 380px;
     width: 100%;
+    box-shadow: var(--glass-inner-glow), var(--glass-shadow);
     animation: slideUp 0.2s ease-out;
   }
 
@@ -108,6 +111,10 @@ function handleKeydown(e) {
     color: #a1a1aa;
   }
 
+  .btn-cancel:active {
+    transform: var(--press-scale);
+  }
+
   .btn-confirm {
     padding: 10px 18px;
     font-size: 0.875rem;
@@ -125,6 +132,10 @@ function handleKeydown(e) {
     box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
   }
 
+  .btn-confirm:active {
+    transform: var(--press-scale);
+  }
+
   .btn-confirm.destructive {
     background: #ef4444;
   }

package/src/lib/ConnectionForm.svelte

@@ -112,10 +112,13 @@ function handleConnectClick() {
 
 <style>
   .connection-card {
-    background: rgba(255, 255, 255, 0.03);
-    border: 1px solid rgba(255, 255, 255, 0.06);
+    background: var(--glass-bg);
+    -webkit-backdrop-filter: var(--glass-blur);
+    backdrop-filter: var(--glass-blur);
+    border: 1px solid var(--glass-border);
     border-radius: 20px;
     padding: 24px;
+    box-shadow: var(--glass-inner-glow);
   }
 
   .card-header {
@@ -247,7 +250,7 @@ function handleConnectClick() {
   }
 
   .btn-connect:active:not(:disabled) {
-    transform: translateY(0);
+    transform: var(--press-scale);
   }
 
   .btn-connect:disabled {

package/src/lib/PrerequisitesCheck.svelte

@@ -81,12 +81,15 @@ function handleKeydown(e) {
   }
 
   .modal-content {
-    background: linear-gradient(145deg, #1a1a2e 0%, #16162a 100%);
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: rgba(26, 26, 46, 0.85);
+    -webkit-backdrop-filter: var(--glass-blur-heavy);
+    backdrop-filter: var(--glass-blur-heavy);
+    border: 1px solid var(--glass-border);
     border-radius: 20px;
     padding: 28px;
     max-width: 440px;
     width: 100%;
+    box-shadow: var(--glass-inner-glow), var(--glass-shadow);
     animation: slideUp 0.3s ease-out;
   }
 
@@ -243,4 +246,8 @@ function handleKeydown(e) {
     background: rgba(255, 255, 255, 0.1);
     color: #e4e4e7;
   }
+
+  .btn-continue:active {
+    transform: var(--press-scale);
+  }
 </style>

package/src/lib/SavedConnections.svelte

@@ -211,10 +211,13 @@ function handleHeaderKeydown(e, activeConn, connectionId) {
 
 <style>
   .saved-connections-card {
-    background: rgba(255, 255, 255, 0.03);
-    border: 1px solid rgba(255, 255, 255, 0.06);
+    background: var(--glass-bg);
+    -webkit-backdrop-filter: var(--glass-blur);
+    backdrop-filter: var(--glass-blur);
+    border: 1px solid var(--glass-border);
     border-radius: 20px;
     padding: 24px;
+    box-shadow: var(--glass-inner-glow);
   }
 
   .card-header {
@@ -383,6 +386,10 @@ function handleHeaderKeydown(e, activeConn, connectionId) {
     border-color: rgba(52, 211, 153, 0.3);
   }
 
+  .btn-connect:active {
+    transform: var(--press-scale);
+  }
+
   .btn-delete {
     color: #71717a;
   }

package/src/lib/SessionStatus.svelte

@@ -60,8 +60,11 @@ const statusConfig = $derived(STATUS_CONFIGS[connectionStatus])
     justify-content: space-between;
     padding: 12px 16px;
     background: var(--status-bg);
+    -webkit-backdrop-filter: blur(12px) saturate(1.8);
+    backdrop-filter: blur(12px) saturate(1.8);
     border: 1px solid var(--status-border);
     border-radius: 12px;
+    box-shadow: var(--glass-inner-glow);
     transition: background-color 0.3s ease, border-color 0.3s ease;
   }
 

package/src/lib/Settings.svelte

@@ -656,8 +656,10 @@ onDestroy(() => {
   }
 
   .modal-content {
-    background: linear-gradient(145deg, #1a1a2e 0%, #16162a 100%);
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: rgba(26, 26, 46, 0.85);
+    -webkit-backdrop-filter: var(--glass-blur-heavy);
+    backdrop-filter: var(--glass-blur-heavy);
+    border: 1px solid var(--glass-border);
     border-radius: 20px;
     padding: 24px;
     max-width: 560px;
@@ -665,6 +667,7 @@ onDestroy(() => {
     max-height: 80vh;
     display: flex;
     flex-direction: column;
+    box-shadow: var(--glass-inner-glow), var(--glass-shadow);
     animation: slideUp 0.3s ease-out;
   }
 
@@ -726,6 +729,7 @@ onDestroy(() => {
 
   .tab:hover {
     color: #a1a1aa;
+    background: var(--glass-bg-hover);
   }
 
   .tab.active {
@@ -798,6 +802,10 @@ onDestroy(() => {
     background: rgba(99, 102, 241, 0.15);
   }
 
+  .btn-add:active {
+    transform: var(--press-scale);
+  }
+
   .empty-state {
     text-align: center;
     padding: 40px 20px;
@@ -820,8 +828,8 @@ onDestroy(() => {
   }
 
   .profile-card {
-    background: rgba(255, 255, 255, 0.03);
-    border: 1px solid rgba(255, 255, 255, 0.06);
+    background: var(--glass-bg);
+    border: 1px solid var(--glass-border);
     border-radius: 12px;
     padding: 14px;
   }
@@ -974,6 +982,10 @@ onDestroy(() => {
     box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
   }
 
+  .btn-save:active:not(:disabled) {
+    transform: var(--press-scale);
+  }
+
   .btn-save:disabled {
     opacity: 0.5;
     cursor: not-allowed;
@@ -991,12 +1003,15 @@ onDestroy(() => {
   }
 
   .edit-modal {
-    background: #1e1e32;
-    border: 1px solid rgba(255, 255, 255, 0.1);
+    background: rgba(30, 30, 50, 0.9);
+    -webkit-backdrop-filter: var(--glass-blur-heavy);
+    backdrop-filter: var(--glass-blur-heavy);
+    border: 1px solid var(--glass-border);
     border-radius: 16px;
     padding: 24px;
     width: 400px;
     max-width: 90%;
+    box-shadow: var(--glass-inner-glow), var(--glass-shadow);
   }
 
   .edit-modal.project-modal {
@@ -1180,4 +1195,8 @@ onDestroy(() => {
     background: rgba(255, 255, 255, 0.05);
     color: #a1a1aa;
   }
+
+  .btn-cancel:active {
+    transform: var(--press-scale);
+  }
 </style>

package/src/lib/UpdateBanner.svelte

@@ -53,9 +53,12 @@ function handleDismiss() {
     align-items: center;
     gap: 12px;
     padding: 12px 16px;
-    background: linear-gradient(135deg, rgba(99, 102, 241, 0.15) 0%, rgba(139, 92, 246, 0.15) 100%);
+    background: var(--glass-bg);
+    -webkit-backdrop-filter: var(--glass-blur);
+    backdrop-filter: var(--glass-blur);
     border: 1px solid rgba(99, 102, 241, 0.3);
     border-radius: 14px;
+    box-shadow: var(--glass-inner-glow);
     animation: slideIn 0.3s ease-out;
   }
 
@@ -141,6 +144,10 @@ function handleDismiss() {
     box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
   }
 
+  .btn-install:active {
+    transform: var(--press-scale);
+  }
+
   .btn-dismiss {
     width: 28px;
     height: 28px;