Merge pull request #2776 from appwrite/origin/preview-box

-- Create preview-box.less styles

app/views/console/storage/index.phtml

@@ -35,7 +35,6 @@
                         <li class="margin-bottom">
                             <a data-ls-attrs="href=/console/storage/bucket?id={{bucket.$id}}&project={{router.params.project}}" class="box">
                                 <div data-ls-bind="{{bucket.name}}" class="text-one-liner margin-bottom text-bold">&nbsp;</div>
-
                                 <i class="icon-right-open"></i>
                             </a>
                         </li>

public/styles/comps/preview-box.less

@@ -0,0 +1,21 @@
+.preview-box {
+  display: grid;
+  place-content: center;
+  padding: 40px;
+  background: var(--config-color-background-fade);
+  border: 1px dashed var(--config-color-background-dark);
+  border-radius: 8px;
+  &-image {
+    display: grid;
+    place-content: center;
+    width: 40px;
+    height: 40px;
+    margin-inline: auto;
+    background-color: var(--config-color-background-focus);
+    border-radius: 50%;
+  }
+  &-text{
+    margin-top: 16px;
+    color: var(--config-color-fade);
+  }
+}

public/styles/default.less

@@ -34,6 +34,7 @@ img[src=""] {
 @import "comps/modal";
 @import "comps/scroll";
 @import "comps/tabs";
+@import "comps/preview-box";
 @import "comps/upload-box";
 @import "comps/pill";
 
@@ -57,4 +58,4 @@ ul {
     margin: 0;
     list-style: none;
   }
-}
+}