Basic Settings Default Cover

Author: Farzin

src/Blogifier.Admin/Pages/Settings/BasicView.razor

@@ -19,6 +19,12 @@
                 <label class="form-label">@_localizer["description"]</label>
                 <textarea class="form-control" cols="30" rows="5" @bind="Blog.Description" name="description"></textarea>
             </div>
+            <div class="form-item">
+                <label class="form-label">@_localizer["Default Cover"]</label>
+                <button class="settings-cover" type="button" onclick="">
+                    <img class="settings-cover-img" id="defaultCover" src="@Constants.DefaultCover" alt="@_localizer["Default Cover"]">
+                </button>
+            </div>
             <div class="form-item">
                 <div class="form-check form-switch">
                     <input class="form-check-input" type="checkbox" @bind="Blog.IncludeFeatured" id="IncludeFeaturedSwitch">

src/Blogifier.Admin/wwwroot/admin/css/app.css

@@ -0,0 +1,27 @@
+.settings {
+  &-cover {
+    height: 10rem;
+    width: 100%;
+    background: #fff;
+    border-radius: 0.25rem;
+    padding: 0;
+    border: 0;
+    overflow: hidden;
+    box-shadow: 0 0 0 1px transparent;
+    transition: box-shadow ease-in-out .15s;
+    border:1px solid transparent;
+
+    &-img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+      object-position: center;
+    }
+
+    &:focus,
+    &:hover{
+      outline: none;
+      box-shadow: 0 0 0 1px $gray-600;
+    }
+  }
+}