From 4e1d084e0f3292de434a077b84bd5096e16c5530 Mon Sep 17 00:00:00 2001
From: Maksim Pischulenok <pischule@outlook.com>
Date: Fri, 30 May 2025 14:02:42 +0300
Subject: [PATCH] Add blurred background image behind main content

- Position the main container relatively to allow absolute positioning of background
- Add pseudo-element with background image, blur effect and scaling
- Ensure main image stays above background with z-index
- Improve visual appeal while maintaining focus on primary content
---
 static/index.html | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/static/index.html b/static/index.html
index 6cdbbe1..2dd5285 100644
--- a/static/index.html
+++ b/static/index.html
@@ -18,11 +18,29 @@
             align-items: center;
             height: 100vh;
             overflow: hidden;
+            position: relative;
+        }
+        body::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-image: url('_.jpeg');
+            background-size: cover;
+            background-position: center;
+            background-repeat: no-repeat;
+            filter: blur(20px);
+            transform: scale(1.1);
+            z-index: -1;
         }
         img {
             width: 100%;
             height: 100%;
             object-fit: contain;
+            position: relative;
+            z-index: 1;
         }
     </style>
 </head>