anton/preland
4
0 Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: единая загрузка примеров и стабильный первый кадр (api#301)
deploy-preland / deploy zoomstage.online (push) Successful in 33s
Details

Browse Source
This commit is contained in:
Panfilov Konstantin committed 2026-10-20 19:52:30 +03:00
1 parent 75ccf14889
commit 0c9a406d68
10 files changed
+347 -257
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

style.min.css
Vendored
+29 -5
View File
@@ -7,11 +7,11 @@
.index-mobile-fit #image-compare .icv__img { position: absolute; top: 0; bottom: 0; left: 0; width: 100cqw; height: 100%; object-fit: cover; object-position: center; }
.index-mobile-fit #image-compare .icv__img-b { left: auto; right: 0; }
.index-mobile-fit #image-compare.native-icv img { width: 100cqw !important; }
.index-mobile-fit #dropzone-form[data-mobile-upload] { padding: 12px; margin-top: 12px; }
.index-mobile-fit #dropzone-form[data-mobile-upload] .dropzone-form-icon img { width: 36px; height: 36px; }
.index-mobile-fit #dropzone-form[data-mobile-upload] .dropzone-form-text { margin-top: 6px; }
.index-mobile-fit #dropzone-form[data-mobile-upload] .dropzone-form-format { margin-top: 8px; }
.index-mobile-fit #dropzone-form[data-mobile-upload] .dropzone-form-action { margin-top: 10px; }
.index-mobile-fit :is(#dropzone-form[data-mobile-upload], html[data-upload-device="mobile"] #dropzone-form, html[data-upload-device="android"] #dropzone-form) { padding: 12px; margin-top: 12px; }
.index-mobile-fit :is(#dropzone-form[data-mobile-upload], html[data-upload-device="mobile"] #dropzone-form, html[data-upload-device="android"] #dropzone-form) .dropzone-form-icon img { width: 36px; height: 36px; }
.index-mobile-fit :is(#dropzone-form[data-mobile-upload], html[data-upload-device="mobile"] #dropzone-form, html[data-upload-device="android"] #dropzone-form) .dropzone-form-text { margin-top: 6px; }
.index-mobile-fit :is(#dropzone-form[data-mobile-upload], html[data-upload-device="mobile"] #dropzone-form, html[data-upload-device="android"] #dropzone-form) .dropzone-form-format { margin-top: 8px; }
.index-mobile-fit :is(#dropzone-form[data-mobile-upload], html[data-upload-device="mobile"] #dropzone-form, html[data-upload-device="android"] #dropzone-form) .dropzone-form-action { margin-top: 10px; }
.index-mobile-fit .image-examples { max-width: min(100%, 50svh); margin: 12px auto 0; }
.index-mobile-fit .image-examples-label { display: none; }
.index-mobile-fit .image-examples-list { gap: 8px; }
@@ -115,3 +115,27 @@ body { isolation: isolate; }
}
@media (max-width: 767.98px) { .wrapper { --site-header-height: 68px; } }
/* /api#298 */
/* api#301: геометрия примеров существует до загрузки изображений и viewer. */
.index-mobile-fit #examples { position: relative; }
.index-mobile-fit #image-compare { position: relative; width: 100%; aspect-ratio: 1696 / 920; overflow: hidden; }
.index-mobile-fit #image-compare > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.index-mobile-fit #examples .examples-retry { position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%); }
.index-mobile-fit #examples .examples-retry[hidden] { display: none; }
.index-mobile-fit #examples .image-examples-item { cursor: pointer; }
.index-mobile-fit #examples .image-examples-item.active { border-color: #007bff; }
/* /api#301 */
@media (min-width: 768px) {
/* Обе колонки занимают свои ячейки и при частично полученном HTML. */
.index-mobile-fit > .container > .row { display: grid; grid-template-columns: 5fr 7fr; }
.index-mobile-fit > .container > .row > .col-md-5 { grid-column: 1; grid-row: 1; max-width: none; }
.index-mobile-fit > .container > .row > .col-md-7 { grid-column: 2; grid-row: 1; max-width: none; }
}
/* Разметка может прийти частями: показываем только полностью полученную форму. */
.index-mobile-fit #dropzone-form:not(:has([data-upload-markup-ready])) { visibility: hidden; }
@media (max-width: 767.98px) {
/* Высоты существующего компактного вида: 243/201px контент + 24px padding. */
html[data-upload-device=android] .index-mobile-fit #dropzone-form { min-height: 267px; }
html[data-upload-device=mobile] .index-mobile-fit #dropzone-form { min-height: 225px; }
html[data-upload-device=android] .index-mobile-fit .dropzone-form-action { min-height: 90px; }
}