From 314ddc4751c708441964749d8dc7c48c25165b2a Mon Sep 17 00:00:00 2001 From: Kakune55 Date: Sun, 21 Apr 2024 23:45:41 +0800 Subject: [PATCH] =?UTF-8?q?feat:=E8=B0=83=E6=95=B4=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E6=98=BE=E7=A4=BA=E6=95=88=E6=9E=9C=20=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E9=9A=90=E7=A7=81=E4=BF=9D=E6=8A=A4=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- templates/overview.html | 93 +++++++++++++++++++++++++---------------- templates/upload.html | 4 +- templates/view.html | 40 +++++++++++++++++- 3 files changed, 96 insertions(+), 41 deletions(-) diff --git a/templates/overview.html b/templates/overview.html index 771d5dc..6801f7f 100644 --- a/templates/overview.html +++ b/templates/overview.html @@ -39,28 +39,22 @@ } } - .image { - max-width: 100%; - height: auto; - cursor: pointer; - } - - #imageContainer { - display: none; - justify-content: center; - align-items: center; + #global-blur { + background-color: rgba(255, 255, 255, 0.5); position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - z-index: 9999; - max-height: 90%; - max-width: 90%; - } - - #imageContainer img { - max-width: 100%; - height: auto; + top: 0; + left: 0; + width: 100%; + height: 100%; + backdrop-filter: blur(10px); + /* 模糊度可以根据需要调整 */ + transition: display; + z-index: 1; + /* 保证遮罩在页面上方 */ + pointer-events: none; + /* 确保遮罩不影响下方元素的交互 */ + opacity: 0; + transition: opacity 0.3s ease } @@ -68,33 +62,41 @@
- +
-
+