fix: breaking changes from css bucket to grid-item-1

src/lib/components/bucket.svelte

@@ -3,16 +3,16 @@
 </script>
 
 <a class="card" {href}>
-    <div class="bucket">
+    <div class="grid-item-1">
         <div class="eyebrow-heading-3"><slot name="eyebrow" /></div>
         <h2 class="heading-level-6"><slot name="title" /></h2>
-        <div class="bucket-status">
+        <div class="status">
             <slot name="status" />
         </div>
-        <div class="bucket-options">
+        <div class="options">
             <slot />
         </div>
-        <ul class="bucket-icons u-flex u-gap-8">
+        <ul class="icons u-flex u-gap-8">
             <slot name="icons" />
         </ul>
     </div>

src/routes/console/organization-[organization]/index.svelte

@@ -125,7 +125,7 @@
         </div>
     {:else}
         <Empty dashed centered>
-            <div class="bucket">
+            <div class="grid-item-1">
                 <div class="u-flex u-flex-vertical u-cross-center ">
                     <div class="common-section">
                         <Button secondary round on:click={() => (showCreate = true)}>

src/routes/console/project-[project]/storage/index.svelte

@@ -117,7 +117,7 @@
         </div>
     {:else}
         <Empty dashed centered>
-            <div class="bucket">
+            <div class="grid-item-1">
                 <div class="u-flex u-flex-vertical u-cross-center">
                     <div class="common-section">
                         <Button secondary round on:click={() => (showCreate = true)}>