DevOpsTools/hysteria2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Ограничить lightbox QR высотой экрана с отступами сверху/снизу

Browse Source
This commit is contained in:
Sergey Antropoff
2026-07-23 09:13:00 +03:00
parent 212e891409
commit a39e5b7d16
2 changed files with 22 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
roles/hysteria2/templates/export/global-index.html.j2
+11 -3
View File
@@ -262,7 +262,8 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 1.5rem; padding: 1.75rem 1rem;
box-sizing: border-box;
background: rgba(8, 12, 18, 0.72); background: rgba(8, 12, 18, 0.72);
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
@@ -279,6 +280,7 @@
.lightbox-panel { .lightbox-panel {
position: relative; position: relative;
max-width: min(94vw, 640px); max-width: min(94vw, 640px);
max-height: calc(100dvh - 3.5rem);
width: 100%; width: 100%;
padding: 1.25rem 1.25rem 1rem; padding: 1.25rem 1.25rem 1rem;
background: var(--bg-card); background: var(--bg-card);
@@ -286,6 +288,7 @@
border-radius: 18px; border-radius: 18px;
box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45); box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);
text-align: center; text-align: center;
overflow: auto;
transform: translateY(12px) scale(0.96); transform: translateY(12px) scale(0.96);
transition: transform 0.22s ease; transition: transform 0.22s ease;
} }
@@ -293,13 +296,18 @@
transform: translateY(0) scale(1); transform: translateY(0) scale(1);
} }
.lightbox-panel img { .lightbox-panel img {
width: 100%; display: block;
max-width: 560px; width: auto;
height: auto; height: auto;
max-width: min(560px, 100%);
max-height: min(560px, calc(100dvh - 14rem));
margin: 0 auto;
aspect-ratio: 1; aspect-ratio: 1;
object-fit: contain;
background: #fff; background: #fff;
border-radius: 12px; border-radius: 12px;
padding: 1rem; padding: 1rem;
box-sizing: border-box;
image-rendering: pixelated; image-rendering: pixelated;
} }
.lightbox-caption { .lightbox-caption {
roles/hysteria2/templates/export/index.html.j2
+11 -3
View File
@@ -193,7 +193,8 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 1.5rem; padding: 1.75rem 1rem;
box-sizing: border-box;
background: rgba(8, 12, 18, 0.72); background: rgba(8, 12, 18, 0.72);
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
@@ -210,6 +211,7 @@
.lightbox-panel { .lightbox-panel {
position: relative; position: relative;
max-width: min(94vw, 640px); max-width: min(94vw, 640px);
max-height: calc(100dvh - 3.5rem);
width: 100%; width: 100%;
padding: 1.25rem 1.25rem 1rem; padding: 1.25rem 1.25rem 1rem;
background: var(--bg-card); background: var(--bg-card);
@@ -217,6 +219,7 @@
border-radius: 18px; border-radius: 18px;
box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45); box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);
text-align: center; text-align: center;
overflow: auto;
transform: translateY(12px) scale(0.96); transform: translateY(12px) scale(0.96);
transition: transform 0.22s ease; transition: transform 0.22s ease;
} }
@@ -224,13 +227,18 @@
transform: translateY(0) scale(1); transform: translateY(0) scale(1);
} }
.lightbox-panel img { .lightbox-panel img {
width: 100%; display: block;
max-width: 560px; width: auto;
height: auto; height: auto;
max-width: min(560px, 100%);
max-height: min(560px, calc(100dvh - 14rem));
margin: 0 auto;
aspect-ratio: 1; aspect-ratio: 1;
object-fit: contain;
background: #fff; background: #fff;
border-radius: 12px; border-radius: 12px;
padding: 1rem; padding: 1rem;
box-sizing: border-box;
image-rendering: pixelated; image-rendering: pixelated;
} }
.lightbox-caption { .lightbox-caption {