@limpiolux/ui-styles 1.0.18 → 1.0.19

package/components.css

@@ -182,7 +182,7 @@
   }
 
   .portal-launchpad-grid {
-    @apply grid grid-cols-3 gap-x-4 gap-y-6 sm:grid-cols-4 lg:grid-cols-3 xl:grid-cols-4;
+    @apply grid grid-cols-2 gap-x-4 gap-y-6 sm:grid-cols-3 lg:grid-cols-3 xl:grid-cols-4;
   }
 
   .portal-launchpad-card {
@@ -199,18 +199,19 @@
 
   .portal-launchpad-icon {
     @apply inline-flex h-20 w-20 items-center justify-center rounded-[28px] border sm:h-24 sm:w-24;
-    border-color: rgba(255, 255, 255, 0.14);
+    border-color: rgba(255, 255, 255, 0.18);
     background:
-      radial-gradient(circle at top left, rgba(255, 255, 255, 0.42), transparent 54%),
-      radial-gradient(circle at bottom right, rgba(var(--color-brand) / 0.18), transparent 52%),
-      linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04));
+      radial-gradient(ellipse at 28% 8%, rgba(255, 255, 255, 0.62), transparent 50%),
+      radial-gradient(circle at bottom right, rgba(var(--color-brand) / 0.22), transparent 52%),
+      linear-gradient(160deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.04) 100%);
     color: #f8fdff;
     box-shadow:
-      inset 0 1px 0 rgba(255, 255, 255, 0.28),
-      inset 0 -16px 24px -20px rgba(0, 0, 0, 0.24),
-      0 24px 42px -28px rgba(0, 117, 169, 0.46);
-    backdrop-filter: blur(18px);
-    -webkit-backdrop-filter: blur(18px);
+      inset 0 1px 0 rgba(255, 255, 255, 0.38),
+      inset 0 -20px 28px -18px rgba(0, 0, 0, 0.2),
+      0 24px 48px -28px rgba(0, 117, 169, 0.52),
+      0 2px 8px -2px rgba(0, 0, 0, 0.18);
+    backdrop-filter: blur(20px) saturate(2);
+    -webkit-backdrop-filter: blur(20px) saturate(2);
     transition:
       transform 220ms ease,
       border-color 220ms ease,
@@ -221,11 +222,12 @@
   .portal-launchpad-card:hover .portal-launchpad-icon,
   .portal-launchpad-card:focus-visible .portal-launchpad-icon {
     transform: translateY(-2px);
-    border-color: rgba(var(--color-brand) / 0.28);
+    border-color: rgba(var(--color-brand) / 0.32);
     box-shadow:
-      inset 0 1px 0 rgba(255, 255, 255, 0.32),
-      inset 0 -16px 24px -20px rgba(0, 0, 0, 0.18),
-      0 28px 52px -30px rgba(0, 117, 169, 0.58);
+      inset 0 1px 0 rgba(255, 255, 255, 0.44),
+      inset 0 -20px 28px -18px rgba(0, 0, 0, 0.16),
+      0 32px 56px -28px rgba(0, 117, 169, 0.64),
+      0 4px 14px -4px rgba(0, 0, 0, 0.2);
   }
 
   .portal-launchpad-title {
@@ -269,7 +271,7 @@
   }
 
   .portal-dashboard-grid {
-    @apply mt-8 grid gap-6 xl:grid-cols-[1.45fr_0.95fr];
+    @apply mt-5 grid gap-5 md:mt-8 md:gap-6 xl:grid-cols-[1.45fr_0.95fr];
   }
 
   .portal-dashboard-main {
@@ -615,7 +617,8 @@
   /* ── Soft tabs ── */
 
   .soft-tab {
-    @apply relative inline-flex shrink-0 items-center justify-center rounded-xl px-3 py-2 text-sm md:px-3.5;
+    @apply relative inline-flex items-center justify-center rounded-xl px-3 py-2 text-sm md:px-3.5;
+    flex: 1 0 0%;
     background: transparent;
     border-color: transparent;
     color: #a1a1aa;
@@ -627,6 +630,12 @@
       opacity 160ms ease;
   }
 
+  @media (min-width: 768px) {
+    .soft-tab {
+      flex: 0 0 auto;
+    }
+  }
+
   .soft-tab:hover {
     color: #e4e4e7;
   }

package/light.css

@@ -476,14 +476,17 @@
 .light .portal-launchpad-icon {
   border-color: rgba(186, 230, 253, 0.92);
   background:
-    radial-gradient(circle at top left, rgba(255, 255, 255, 0.98), transparent 50%),
-    radial-gradient(circle at bottom right, rgba(56, 189, 248, 0.14), transparent 54%),
-    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(224, 242, 254, 0.82));
+    radial-gradient(ellipse at 28% 8%, rgba(255, 255, 255, 0.98), transparent 48%),
+    radial-gradient(circle at bottom right, rgba(56, 189, 248, 0.18), transparent 54%),
+    linear-gradient(160deg, rgba(255, 255, 255, 0.94) 0%, rgba(224, 242, 254, 0.82) 100%);
   color: rgb(var(--color-brand-strong));
   box-shadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.92),
-    inset 0 -16px 24px -22px rgba(8, 47, 73, 0.08),
-    0 20px 36px -28px rgba(14, 116, 144, 0.32);
+    inset 0 1px 0 rgba(255, 255, 255, 0.96),
+    inset 0 -20px 28px -20px rgba(8, 47, 73, 0.07),
+    0 20px 40px -28px rgba(14, 116, 144, 0.36),
+    0 2px 8px -2px rgba(14, 116, 144, 0.12);
+  backdrop-filter: blur(20px) saturate(1.6);
+  -webkit-backdrop-filter: blur(20px) saturate(1.6);
 }
 
 .light .portal-launchpad-card:hover .portal-launchpad-icon,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@limpiolux/ui-styles",
-  "version": "1.0.18",
+  "version": "1.0.19",
   "description": "Shared design system — Limpiolux liquid glass theme with auth, portal and dark/light mode support",
   "type": "module",
   "exports": {