@happyvertical/smrt-svelte 0.55.16 → 0.55.18

package/dist/components/workspace/admin-shell/ActivityToasts.svelte

@@ -60,7 +60,7 @@ onDestroy(() => {
 </script>
 
 {#if toasts.length > 0}
-  <div class="smrt-activity-toasts" aria-live="polite">
+  <div class="smrt-activity-toasts" aria-live="polite" data-smrt-component="ActivityToasts">
     {#each toasts as toast (toast.id)}
       <article class="smrt-activity-toast" data-status={toast.activity.status}>
         <div>
@@ -81,6 +81,8 @@ onDestroy(() => {
 {/if}
 
 <style>
+@layer smrt.reset, smrt.structure, smrt.theme;
+@layer smrt.theme {
   .smrt-activity-toasts {
     position: fixed;
     inset-block-start: var(--smrt-spacing-4);
@@ -96,12 +98,14 @@ onDestroy(() => {
     align-items: center;
     justify-content: space-between;
     gap: var(--smrt-spacing-3);
-    border: 1px solid var(--smrt-color-outline-variant);
+    border: var(--smrt-hairline);
     border-radius: var(--smrt-radius-medium);
-    background: var(--smrt-color-surface-container);
+    background: var(--smrt-glass-surface-strong);
+    -webkit-backdrop-filter: blur(var(--smrt-glass-blur)) saturate(var(--smrt-glass-saturation));
+    backdrop-filter: blur(var(--smrt-glass-blur)) saturate(var(--smrt-glass-saturation));
     color: var(--smrt-color-on-surface);
     padding: var(--smrt-spacing-3);
-    box-shadow: var(--smrt-elevation-2);
+    box-shadow: var(--smrt-elevation-3), var(--smrt-inset-highlight);
   }
 
   .smrt-activity-toast div {
@@ -138,4 +142,5 @@ onDestroy(() => {
       transform: translateY(0);
     }
   }
+}
 </style>