feat(ui): общий бренд и компактная мобильная обработка (refs #5)
deploy-preland / deploy zoomstage.online (push) Successful in 30s

This commit is contained in:
Panfilov Konstantin committed 2026-10-19 22:41:49 +03:00
1 parent d2637e8f61
commit c30e3239a0
4 files changed
+126 -3

No files matched your search

+3 -3
View File
@@ -22,7 +22,7 @@ $labelsJson = json_encode($labels, JSON_UNESCAPED_UNICODE);
</svg>
</div>
<div class="dropzone-form-loading-info-text">
<span id="origin_width"><?= htmlspecialchars($origin_width ?? '', ENT_QUOTES, 'UTF-8') ?></span> x <span id="origin_height"><?= htmlspecialchars($origin_height ?? '', ENT_QUOTES, 'UTF-8') ?></span>&nbsp;<span>px</span></div>
<span id="origin_width"><?= htmlspecialchars($origin_width ?? '', ENT_QUOTES, 'UTF-8') ?></span>×<span id="origin_height"><?= htmlspecialchars($origin_height ?? '', ENT_QUOTES, 'UTF-8') ?></span>&nbsp;<span class="process-dimensions-unit">px</span></div>
</div>
<div class="dropzone-form-loading-info-item">
<div class="dropzone-form-loading-info-icon">
@@ -48,7 +48,7 @@ $labelsJson = json_encode($labels, JSON_UNESCAPED_UNICODE);
</svg>
</div>
<div class="dropzone-form-loading-info-text">
<span id="upscale_width"><?= htmlspecialchars($upscale_width ?? '', ENT_QUOTES, 'UTF-8') ?></span> x <span id="upscale_height"><?= htmlspecialchars($upscale_height ?? '', ENT_QUOTES, 'UTF-8') ?></span>&nbsp;<span>px</span></div>
<span id="upscale_width"><?= htmlspecialchars($upscale_width ?? '', ENT_QUOTES, 'UTF-8') ?></span>×<span id="upscale_height"><?= htmlspecialchars($upscale_height ?? '', ENT_QUOTES, 'UTF-8') ?></span>&nbsp;<span class="process-dimensions-unit">px</span></div>
</div>
<div class="dropzone-form-loading-info-item">
<div class="dropzone-form-loading-info-icon">
@@ -133,7 +133,7 @@ $labelsJson = json_encode($labels, JSON_UNESCAPED_UNICODE);
if (bytes === 0 || isNaN(bytes)) return '0 B';
const units = ['B', 'Kb', 'Mb', 'Gb', 'Tb'];
const i = Math.floor(Math.log(bytes) / Math.log(1024));
const formattedValue = (bytes / Math.pow(1024, i)).toFixed(2);
const formattedValue = (bytes / Math.pow(1024, i)).toFixed(i === 1 ? 0 : 2);
return parseFloat(formattedValue) + ' ' + units[i];
}
};
+41
View File
@@ -2793,3 +2793,44 @@ body:not(.theme-dark) .theme-light-hidden {
.index-mobile-fit #image-compare .icv__label-before { left: 24px; }
.index-mobile-fit #image-compare .icv__label-after { right: 24px; }
}
/* api#284: общий контракт утверждённых шапки/подвала и мобильной обработки. */
.header .navbar{height:90px;padding-top:0!important;padding-bottom:0!important;}
.header .navbar>.container{height:100%;align-items:center;flex-wrap:nowrap;}
.header .navbar-brand{padding:0;margin-right:12px;min-width:0;flex:1 1 0;display:flex;align-items:center;}
.header .navbar-brand img{width:240px;max-width:100%;height:auto;}
.footer-logo img{width:160px;height:auto;max-width:100%;}
.header .btn-header{min-height:44px;height:44px;font-size:14px;line-height:20px;padding:0 16px;border-radius:12px;white-space:nowrap;gap:6px;}
@media(max-width:767.98px){
.header .navbar{height:68px;} .header .navbar-brand img{width:180px;} .header .navbar-toggler{width:30px;height:30px;border-radius:8px;padding:0;} .header .navbar-toggler-icon{width:20px;height:20px;background-size:20px;}
.header .navbar-brand{margin-right:8px;}
.header .btn-header{height:30px;min-height:30px;font-size:12px;padding:0 12px;border-radius:11px;}
.header .btn-header svg{width:16px;height:16px;}
.footer-logo img{width:130px;height:auto;}
.site{padding-top:68px;}
.index-mobile-fit #image-compare{max-height:clamp(120px,calc(100svh - 450px),240px);}
}
@media(max-width:767.98px){
.tour-processing, .main-section:has(#process:not([style*="display: none"])) {padding-top:12px!important;padding-bottom:12px!important;min-height:0!important;}
#process{padding:16px 12px;}
#process .process-dimensions-unit{display:none;}
#process .dropzone-form-inner{padding:0;}
#process-title{margin:0;font-size:16px;line-height:24px;}
#process-scale-note{margin:12px 0;font-size:13px;line-height:20px;text-align:center;}
#process .dropzone-form-loading-info{margin:0;display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);gap:4px;align-items:center;}
#process .dropzone-form-loading-info-col{min-width:0;}
#process .dropzone-form-loading-info-item{gap:4px;align-items:center;}
#process .dropzone-form-loading-info-col:last-child .dropzone-form-loading-info-item{justify-content:flex-end;}
#process .dropzone-form-loading-info-item:not(:last-child){margin-bottom:8px;}
#process .dropzone-form-loading-info-icon svg{width:16px;height:16px;display:block;}
#process .dropzone-form-loading-info-text{font-size:clamp(12px,3.6vw,13px);line-height:20px;white-space:nowrap;}
#process .dropzone-form-loading-info-arrow{display:flex;justify-content:center;flex-basis:auto;opacity:.75;}
#process .dropzone-form-loading-info-arrow svg{width:24px;}
#process .dropzone-form-loading-progress{margin-top:16px;}
#process .progress{height:24px;}
#process .progress-label{font-size:12px;line-height:24px;}
#process .process-file-line{margin-top:12px;font-size:12px;line-height:18px;}
.tour-processing #preview, .main-section:has(#process:not([style*="display: none"])) #preview{height:clamp(220px,calc(100svh - 335px),380px)!important;margin-top:16px;}
}
@media(max-width:767.98px){.result-download-title{font-size:24px;line-height:1.2;}}
+41
View File
@@ -798,3 +798,44 @@ padding-top: 2svh !important;
.index-mobile-fit #image-compare .icv__label-before { left: 24px; }
.index-mobile-fit #image-compare .icv__label-after { right: 24px; }
}
/* api#284: общий контракт утверждённых шапки/подвала и мобильной обработки. */
.header .navbar{height:90px;padding-top:0!important;padding-bottom:0!important;}
.header .navbar>.container{height:100%;align-items:center;flex-wrap:nowrap;}
.header .navbar-brand{padding:0;margin-right:12px;min-width:0;flex:1 1 0;display:flex;align-items:center;}
.header .navbar-brand img{width:240px;max-width:100%;height:auto;}
.footer-logo img{width:160px;height:auto;max-width:100%;}
.header .btn-header{min-height:44px;height:44px;font-size:14px;line-height:20px;padding:0 16px;border-radius:12px;white-space:nowrap;gap:6px;}
@media(max-width:767.98px){
.header .navbar{height:68px;} .header .navbar-brand img{width:180px;} .header .navbar-toggler{width:30px;height:30px;border-radius:8px;padding:0;} .header .navbar-toggler-icon{width:20px;height:20px;background-size:20px;}
.header .navbar-brand{margin-right:8px;}
.header .btn-header{height:30px;min-height:30px;font-size:12px;padding:0 12px;border-radius:11px;}
.header .btn-header svg{width:16px;height:16px;}
.footer-logo img{width:130px;height:auto;}
.site{padding-top:68px;}
.index-mobile-fit #image-compare{max-height:clamp(120px,calc(100svh - 450px),240px);}
}
@media(max-width:767.98px){
.tour-processing, .main-section:has(#process:not([style*="display: none"])) {padding-top:12px!important;padding-bottom:12px!important;min-height:0!important;}
#process{padding:16px 12px;}
#process .process-dimensions-unit{display:none;}
#process .dropzone-form-inner{padding:0;}
#process-title{margin:0;font-size:16px;line-height:24px;}
#process-scale-note{margin:12px 0;font-size:13px;line-height:20px;text-align:center;}
#process .dropzone-form-loading-info{margin:0;display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);gap:4px;align-items:center;}
#process .dropzone-form-loading-info-col{min-width:0;}
#process .dropzone-form-loading-info-item{gap:4px;align-items:center;}
#process .dropzone-form-loading-info-col:last-child .dropzone-form-loading-info-item{justify-content:flex-end;}
#process .dropzone-form-loading-info-item:not(:last-child){margin-bottom:8px;}
#process .dropzone-form-loading-info-icon svg{width:16px;height:16px;display:block;}
#process .dropzone-form-loading-info-text{font-size:clamp(12px,3.6vw,13px);line-height:20px;white-space:nowrap;}
#process .dropzone-form-loading-info-arrow{display:flex;justify-content:center;flex-basis:auto;opacity:.75;}
#process .dropzone-form-loading-info-arrow svg{width:24px;}
#process .dropzone-form-loading-progress{margin-top:16px;}
#process .progress{height:24px;}
#process .progress-label{font-size:12px;line-height:24px;}
#process .process-file-line{margin-top:12px;font-size:12px;line-height:18px;}
.tour-processing #preview, .main-section:has(#process:not([style*="display: none"])) #preview{height:clamp(220px,calc(100svh - 335px),380px)!important;margin-top:16px;}
}
@media(max-width:767.98px){.result-download-title{font-size:24px;line-height:1.2;}}
+41
View File
@@ -20,3 +20,44 @@
.index-mobile-fit #image-compare .icv__label-before { left: 24px; }
.index-mobile-fit #image-compare .icv__label-after { right: 24px; }
}
/* api#284: общий контракт утверждённых шапки/подвала и мобильной обработки. */
.header .navbar{height:90px;padding-top:0!important;padding-bottom:0!important;}
.header .navbar>.container{height:100%;align-items:center;flex-wrap:nowrap;}
.header .navbar-brand{padding:0;margin-right:12px;min-width:0;flex:1 1 0;display:flex;align-items:center;}
.header .navbar-brand img{width:240px;max-width:100%;height:auto;}
.footer-logo img{width:160px;height:auto;max-width:100%;}
.header .btn-header{min-height:44px;height:44px;font-size:14px;line-height:20px;padding:0 16px;border-radius:12px;white-space:nowrap;gap:6px;}
@media(max-width:767.98px){
.header .navbar{height:68px;} .header .navbar-brand img{width:180px;} .header .navbar-toggler{width:30px;height:30px;border-radius:8px;padding:0;} .header .navbar-toggler-icon{width:20px;height:20px;background-size:20px;}
.header .navbar-brand{margin-right:8px;}
.header .btn-header{height:30px;min-height:30px;font-size:12px;padding:0 12px;border-radius:11px;}
.header .btn-header svg{width:16px;height:16px;}
.footer-logo img{width:130px;height:auto;}
.site{padding-top:68px;}
.index-mobile-fit #image-compare{max-height:clamp(120px,calc(100svh - 450px),240px);}
}
@media(max-width:767.98px){
.tour-processing, .main-section:has(#process:not([style*="display: none"])) {padding-top:12px!important;padding-bottom:12px!important;min-height:0!important;}
#process{padding:16px 12px;}
#process .process-dimensions-unit{display:none;}
#process .dropzone-form-inner{padding:0;}
#process-title{margin:0;font-size:16px;line-height:24px;}
#process-scale-note{margin:12px 0;font-size:13px;line-height:20px;text-align:center;}
#process .dropzone-form-loading-info{margin:0;display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);gap:4px;align-items:center;}
#process .dropzone-form-loading-info-col{min-width:0;}
#process .dropzone-form-loading-info-item{gap:4px;align-items:center;}
#process .dropzone-form-loading-info-col:last-child .dropzone-form-loading-info-item{justify-content:flex-end;}
#process .dropzone-form-loading-info-item:not(:last-child){margin-bottom:8px;}
#process .dropzone-form-loading-info-icon svg{width:16px;height:16px;display:block;}
#process .dropzone-form-loading-info-text{font-size:clamp(12px,3.6vw,13px);line-height:20px;white-space:nowrap;}
#process .dropzone-form-loading-info-arrow{display:flex;justify-content:center;flex-basis:auto;opacity:.75;}
#process .dropzone-form-loading-info-arrow svg{width:24px;}
#process .dropzone-form-loading-progress{margin-top:16px;}
#process .progress{height:24px;}
#process .progress-label{font-size:12px;line-height:24px;}
#process .process-file-line{margin-top:12px;font-size:12px;line-height:18px;}
.tour-processing #preview, .main-section:has(#process:not([style*="display: none"])) #preview{height:clamp(220px,calc(100svh - 335px),380px)!important;margin-top:16px;}
}
@media(max-width:767.98px){.result-download-title{font-size:24px;line-height:1.2;}}