diff --git a/README.md b/README.md
index ccb3770..422f1cb 100644
--- a/README.md
+++ b/README.md
@@ -1,9 +1,10 @@
+![Preview of the website](public/assets/images/website-light.jpg)
 [![Live](https://img.shields.io/badge/live-stefanimhoff.de-green.svg)](https://www.stefanimhoff.de/)
 ![Maintenance](https://img.shields.io/maintenance/yes/2023.svg)
 
 # stefanimhoff.de
 
-This is the source of my [personal website][si] build with [Astro], [Tailwind CSS], and [Preact].
+This is the source of my [personal website][si] build with [Astro], [Preact], and [Tailwind CSS].
 
 ## Installation
 
diff --git a/public/assets/images/website-dark.jpg b/public/assets/images/website-dark.jpg
new file mode 100644
index 0000000..44bcbda
Binary files /dev/null and b/public/assets/images/website-dark.jpg differ
diff --git a/public/assets/images/website-light.jpg b/public/assets/images/website-light.jpg
new file mode 100644
index 0000000..37eb6ce
Binary files /dev/null and b/public/assets/images/website-light.jpg differ
diff --git a/src/components/SearchModal.astro b/src/components/SearchModal.astro
index 41b5a1f..e003988 100644
--- a/src/components/SearchModal.astro
+++ b/src/components/SearchModal.astro
@@ -30,20 +30,24 @@ import { Link } from '.';
 <style is:global>
 	dialog::backdrop {
 		@apply bg-shibui-100  dark:bg-shibui-900;
-		animation: show-dimmer 0.5s ease-in-out;
+		animation: show-dimmer 0.2s ease-in-out;
 	}
 
 	dialog.hide::backdrop {
-		animation: hide-dimmer 0.5s ease-in-out;
+		animation: hide-dimmer 0.2s ease-in-out;
+	}
+
+	dialog {
+		@apply h-full;
 	}
 
 	dialog[open] {
 		@apply m-gap w-[calc(100%_-_5.55vw_*_2)] bg-shibui-100 p-0 font-sans font-normal leading-relaxed text-shibui-950 common-ligatures dark:bg-shibui-900 dark:text-shibui-200/[0.87];
-		animation: show-modal 0.5s ease-in-out;
+		animation: show-modal 0.2s ease-in-out;
 	}
 
 	dialog.hide {
-		animation: hide-modal 0.5s ease-in-out;
+		animation: hide-modal 0.2s ease-in-out;
 	}
 
 	@keyframes show-modal {