From ffe80adc20cce78b1405861770ea2d2bb1388544 Mon Sep 17 00:00:00 2001
From: Quaternions <krakow20@gmail.com>
Date: Mon, 10 Mar 2025 11:30:44 -0700
Subject: [PATCH] add blur
---
index.html | 28 ++++++++++++++++++++--------
1 file changed, 20 insertions(+), 8 deletions(-)
diff --git a/index.html b/index.html
index b5cca15..6545a97 100644
--- a/index.html
+++ b/index.html
@@ -18,16 +18,26 @@
height: 100vh;
}
- #video-background {
+ .video-container {
position: fixed;
+ top: 0;
right: 0;
bottom: 0;
+ left: 0;
+ overflow: hidden;
+ z-index: -100;
+ }
+
+ #video-background {
+ position: absolute;
+ top: 50%;
+ left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
- z-index: -100;
- filter: brightness(40%);
+ transform: translateX(-50%) translateY(-50%);
+ filter: blur(8px) brightness(40%);
}
.overlay {
@@ -123,11 +133,13 @@
</style>
</head>
<body>
- <!-- Video Background -->
- <video autoplay muted loop id="video-background">
- <source src="assets/mh.mp4" type="video/mp4">
- Your browser does not support the video tag.
- </video>
+ <!-- Video Background with Blur -->
+ <div class="video-container">
+ <video autoplay muted loop id="video-background">
+ <source src="assets/mh.mp4" type="video/mp4">
+ Your browser does not support the video tag.
+ </video>
+ </div>
<div class="overlay"></div>
<!-- Main Content -->