Fixed #21, added more fallback images for book

src/BookCard.svelte

@@ -4,8 +4,8 @@
   
 </script>
 
-<a class="relative flex flex-col lg:w-44 items-center mb-4 rounded-md overflow-hidden transform transition ease-out duration-300 drop-shadow-lg hover:drop-shadow-2xl hover:scale-105 break-inside-avoid" href="#/item/{item.rowid}">
+<a class="relative flex flex-col items-center mb-4 rounded-md overflow-hidden transform transition ease-out duration-300 drop-shadow-lg hover:drop-shadow-2xl hover:scale-105 break-inside-avoid" href="#/item/{item.rowid}">
-  <img class="object-cover h-36 w-24 lg:h-64 lg:w-44" src={item.image || randomCover(item.iid)} alt="{item.name}"/>
+  <img class="object-cover h-36 w-24 lg:h-60 lg:w-40" src={item.image || randomCover(item.iid)} alt="{item.name}"/>
   
   {#if item.rating}
   <h1 class="text-sm md:text-lg font-semibold p-2 text-white tracking-wider">

src/SearchForm.svelte

@@ -21,7 +21,7 @@
 
 </script>
 
-<div class="sticky z-10 top-[50px] bg-gradient-to-r from-lightGradOne to-lightGradTwo dark:bg-gradient-to-r dark:from-neutral_light dark:to-neutral_light rounded">
+<div class="sticky z-10 top-[50px] lg:-ml-10 bg-gradient-to-r from-lightGradOne to-lightGradTwo dark:bg-gradient-to-r dark:from-neutral_light dark:to-neutral_light rounded">
   <div class="relative pt-1">
     {#if  showForm == false}
     <div class="bg-primary rounded absolute top-0 right-0">

src/utility.js

@@ -4,7 +4,11 @@ export function randomCover(itemid){
   let images = [
     '/static/book-cover.png', 
     '/static/book-cover-2.png',
-    '/static/book-cover-3.png'
+    '/static/book-cover-3.png',
+    '/static/book-cover-4.png',
+    '/static/book-cover-5.png',
+    '/static/book-cover-6.png',
+    '/static/book-cover-7.png',
   ]
   return images[itemid.charCodeAt(0) % images.length];  
 }