185 lines
27 KiB
CSS
185 lines
27 KiB
CSS
.col-6,.col-md-4,.col-md-5,.col-md-7,.container{padding-right:15px;padding-left:15px;width:100%}.btn,.progress{background-color:transparent}.progress,.progress-bar{overflow:hidden;display:flex}.btn,.footer-main a,.list-unstyled a,.nav-link{text-decoration:none}*,::after,::before{box-sizing:border-box}body{margin:0;font-family:Inter,sans-serif;padding:unset!important;overflow:auto!important}.container{margin-right:auto;margin-left:auto}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}.col-md-4{flex:0 0 33.333333%;max-width:33.333333%}.col-md-5{flex:0 0 41.666667%;max-width:41.666667%}.col-md-7{flex:0 0 58.333333%;max-width:58.333333%}.order-md-1{order:1}.d-md-none{display:none!important}.d-md-flex{display:flex!important}.py-md-3{padding-top:1rem!important;padding-bottom:1rem!important}.mb-md-0{margin-bottom:0!important}.text-md-right{text-align:right!important}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1300px}}.row{display:flex;flex-wrap:wrap;margin-right:-15px;margin-left:-15px}.col-6,.col-md-4,.col-md-5,.col-md-7{position:relative}.col-6{flex:0 0 50%;max-width:50%}.d-none,.nav-link-auth{display:none!important}.d-flex{display:flex!important}.flex-column{flex-direction:column!important}.align-items-center{align-items:center!important}.btn,.navbar-toggler{align-items:center;cursor:pointer}.m-0{margin:0!important}.mb-0{margin-bottom:0!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}.mt-4{margin-top:1.5rem!important}.mr-4{margin-right:1.5rem!important}.px-0{padding-left:0!important;padding-right:0!important}.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-5{padding-top:3rem!important;padding-bottom:3rem!important}.h5{font-size:1.25rem;font-weight:500;line-height:1.2}.list-unstyled{padding-left:0;list-style:none}.list-unstyled a{color:#56ccf2}.btn{display:inline-flex;justify-content:center;font-weight:400;text-align:center;vertical-align:middle;user-select:none;border:1px solid transparent;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem}.btn.disabled{opacity:1}.progress{height:1rem;font-size:.75rem;border-radius:.25rem}.progress-bar{flex-direction:column;justify-content:center;color:#fff;text-align:center;white-space:nowrap;transition:width .6s}.btn-header,.btn-header:hover{color:#990694}.navbar{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}.navbar-brand{display:inline-block;padding-top:.3125rem;padding-bottom:.3125rem;white-space:nowrap}.navbar-collapse{flex-basis:100%;flex-grow:1;align-items:center}.collapse:not(.show),.footer-logo img:nth-child(2),.navbar-brand img:nth-child(2),.theme-dark .footer-logo img:first-child,.theme-dark .navbar-brand img:first-child{display:none}.nav{display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.nav-link{display:block;padding:.5rem 1rem}.wrapper{display:flex;flex-direction:column;min-height:100vh;background:url(../images/bg.jpg) center/cover no-repeat}.header,.header .navbar-collapse{background-color:rgba(255,255,255,.6)}.site{flex-grow:1;padding-top:90px}.main-section{display:flex;flex-direction:column;justify-content:center;min-height:calc(100vh - 88px)}.header{position:absolute;top:0;left:0;width:100%;z-index:60}.dropzone-form-loading-progress .progress-label,.image-loading-error,.image-loading-icon,.image-loading-icon img.sandglass{top:50%;left:50%;transform:translate(-50%,-50%)}.header .navbar{border-bottom:1px solid #e5e5e7}.btn-header{gap:8px;border:1px solid #990694;border-radius:16px;font-size:16px;padding:.9rem 24px}.navbar-toggler{border-radius:16px;width:56px;height:56px;background:linear-gradient(to bottom,#3d87e3,#990694);color:#f9f9f9;border:none;display:inline-flex;justify-content:center}.navbar-toggler .navbar-toggler-icon{width:30px;height:30px;display:inline-block;background:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") center/contain no-repeat}.navbar-toggler:not(.collapsed) .navbar-toggler-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-width='2' d='M6 6L24 23.9999M6 24L24 6.00015'/%3e%3c/svg%3e")}.header-navbar{max-width:448px;margin-left:auto;padding-top:8px;padding-bottom:24px}.header-navbar .nav-link{color:currentColor;transition:.2s;background-color:transparent!important;display:flex;align-items:center;gap:8px}.header-navbar .nav-link span{flex-grow:1}.dropzone-form-loading-info-icon,.header-navbar .nav-link svg,.image-examples-label{flex-shrink:0}.header-navbar .nav-link:hover{background-color:rgba(255,255,255,.6)!important;color:#871ea3}.gradient-dashed-border{position:relative;border-radius:24px}.gradient-dashed-border::before{content:"";position:absolute;z-index:10;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,#168cff 0,#705cff 50%,#ed00c8 100%);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='0.5' y='0.5' width='99' height='99' rx='6' ry='6' fill='none' stroke='white' stroke-width='1.5' stroke-dasharray='7 8' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='0.5' y='0.5' width='99' height='99' rx='6' ry='6' fill='none' stroke='white' stroke-width='1.5' stroke-dasharray='7 8' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center/100% 100% no-repeat}.dropzone-form{border-radius:3px;background:0 0;border:none;padding:20px}.dropzone-form-inner{text-align:center;padding-top:76px;padding-bottom:76px}.dropzone-form-icon{display:flex;justify-content:center}.dropzone-form-icon img{max-width:100%;height:auto}.dropzone-form-text{font-size:18px;line-height:1.5;margin-top:18px}.dropzone-form-format{margin-top:24px;display:flex;color:#979aa0;font-size:12px;gap:12px;flex-wrap:wrap;align-items:center;justify-content:center}.dropzone-form-format-label{color:#2b2d2f}.dropzone-form-format-list{display:flex;gap:8px;flex-wrap:wrap}.dropzone-form-format-item{display:inline-flex;align-items:center;padding:4px 8px;border:1px solid #e5e5e7;border-radius:8px;background-color:#f8f9fb;color:#596574}.dropzone-form-action{margin-top:24px}.dropzone-form-button{display:inline-flex;padding:0 24px;height:48px;align-items:center;justify-content:center;text-align:center;gap:6px;border:none;background:linear-gradient(to bottom,#3d87e3,#990694);color:#fff;font-weight:600;border-radius:16px;cursor:pointer}.dropzone-form-button svg{width:20px;height:20px}.dropzone-form-loading .dropzone-form-inner{padding:86px 16px}.dropzone-form-filename{font-size:16px;color:#979aa0;margin-top:10px}.dropzone-form-loading-info{margin-top:24px;display:flex;align-items:center;justify-content:space-between}.dropzone-form-loading-info-item{display:flex;gap:8px}.dropzone-form-loading-info-item:not(:last-child),.image-loading-error-icon{margin-bottom:8px}.dropzone-form-loading-info-icon svg{width:24px;height:24px}.dropzone-form-loading-info-text{font-size:14px;line-height:1.5;text-align:left}.dropzone-form-loading-info-arrow{flex-basis:54px}.dropzone-form-loading-info-arrow svg{width:37px;height:24px}.dropzone-form-loading-progress{margin-top:24px;max-width:368px;margin-left:auto;margin-right:auto}.dropzone-form-loading-progress .progress{height:29px;border-radius:100px;background-color:transparent;border:1px solid #fff;position:relative}.dropzone-form-loading-progress .progress-bar{border-radius:100px;background:linear-gradient(to bottom,#3d87e3,#990694);font-size:16px}.dropzone-form-loading-progress .progress-label{position:absolute;color:currentColor}.dropzone-form-note{margin-top:24px;font-size:16px;color:#979aa0;font-weight:500}.image-examples{margin-top:16px;display:flex;gap:16px;align-items:center}.image-examples-list{display:flex;gap:2px;flex-grow:1}.image-examples-item{flex-basis:calc((100% - 8px)/ 5);cursor:pointer}.image-examples-image{position:relative;padding-bottom:100%}.image-examples-image img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block;border-radius:8px}.image-loading img{max-width:100%;border-radius:24px}.image-loading-progress{position:relative}.image-loading-progress::before{content:"";display:block;width:100%;height:100%;position:absolute;top:0;left:0;background-color:rgba(0,0,0,.4);z-index:2;background-image:var(--source);filter:blur(15px) brightness(.7);background-size:cover;background-position:center;transform:scale(1.1)}.image-loading-progress img{position:relative;z-index:1}.image-loading-icon{position:absolute;z-index:3}.image-loading-icon img.sandglass{position:absolute;width:40px;height:40px;object-fit:contain}.image-loading-icon img.spinner{width:140px;height:140px;object-fit:contain}.image-loading-error{position:absolute;max-width:400px;width:100%;padding:16px;text-align:center;z-index:4}.image-loading-error-icon img{width:64px;height:64px;object-fit:contain}.image-loading-error-title{font-size:24px}.image-loading-error-text{font-size:14px;margin-top:10px;color:#979aa0}.footer{background-color:rgba(255,255,255,.75);padding-top:50px}.footer-main p,.footer-main ul{font-size:14px}.footer-main a{color:currentColor}.footer-bottom{border-top:1px solid #323539;font-size:12px;color:#979aa0}.theme-dark,.theme-dark .btn{color:#f9f9f9}.theme-dark .wrapper{background-image:url(../images/dark-bg.jpg)}.theme-dark .btn-header{border-color:#fff;color:#fff}.theme-dark .btn-header:hover{color:#fff}.theme-dark .footer-logo img:nth-child(2),.theme-dark .navbar-brand img:nth-child(2){display:block}.theme-dark .header{background-color:transparent}.theme-dark .header .navbar{border-color:#323539}.theme-dark .header .navbar-collapse{background-color:rgba(1,1,3,.9)}.theme-dark .header .header-navbar .nav-link:hover{background-color:#0b0b10!important}.theme-dark .dropzone-form-format-label{color:#979aa0}.theme-dark .dropzone-form-format-item{border-color:#323539;background-color:#0b0b10;color:#979aa0}.theme-dark .footer{background-color:rgba(2,2,3,.5)}@media (max-width:767.98px){.nav-link-auth{display:inline-flex!important}.site{padding-top:60px}.navbar-toggler{width:40px;height:40px;padding:0;border-radius:8px}.image-examples{display:block;text-align:center}.image-examples-label{margin-bottom:16px}.image-loading-error-title{font-size:18px}.image-loading-error-text{margin-top:8px;font-size:13px}.dropzone-form-inner,.dropzone-form-loading .dropzone-form-inner{padding-top:0;padding-bottom:0}.dropzone-form-text{font-size:16px;margin-top:8px}.dropzone-form-format{margin-top:8px;row-gap:8px}.dropzone-form-action{margin-top:8px}#dropzone-form,#preview{margin-top:16px}.footer{padding-top:0}.navbar-brand img{max-width:130px}.dropzone-form-loading-info-text,.footer-main p,.footer-main ul{font-size:13px}.footer-main .h5{font-size:16px}.footer-bottom{font-size:10px}.dropzone-form-button{font-size:14px;padding-left:14px;padding-right:14px;width:100%}.dropzone-form-loading-info{margin:0 5%}.main-section{justify-content:unset}.dropzone-form-filename,.dropzone-form-note{font-size:14px}.gradient-dashed-border{border-radius:10px}}@media (orientation:portrait){.hide-on-pc{display:block}.hide-on-mob{display:none}}@media (orientation:landscape){.hide-on-pc{display:none!important}.hide-on-mob{display:block}}@media (orientation:portrait),(max-aspect-ratio:1/1){.image-examples{max-width:calc(100svh / 3);margin:0 auto}#dropzone-form{padding:2svh 2.75svh}.dropzone-form-icon{max-height:8svh}.dropzone-form-text,.image-examples-label{font-size:2.45svh}.dropzone-form-format-item,.dropzone-form-format-label{font-size:1.8svh}.main-section{padding-top:2svh!important}}.native-icv .icv__handle-circle::after,.native-icv .icv__handle-circle::before{content:'';display:inline-block;width:14px;height:14px;background-repeat:no-repeat;background-position:center;background-size:contain}.image-compare.native-icv{position:relative;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:ew-resize;aspect-ratio:1696/920;border-radius:24px}.native-icv .icv__before-wrap{position:absolute;top:0;left:0;height:100%;width:50%;overflow:hidden;z-index:2}.native-icv .icv__after-img,.native-icv .icv__before-wrap img{left:0;width:100%;top:0;position:absolute;pointer-events:none;height:100%;object-fit:cover}.native-icv .icv__after-img{display:block}.native-icv .icv__handle{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;z-index:3;transform:translateX(-50%);box-shadow:0 0 10px rgba(0,0,0,.5)}.native-icv .icv__handle-circle{position:absolute;top:50%;left:50%;width:38px;height:38px;background:#fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 2px 8px rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center}.native-icv .icv__handle-circle::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'%3E%3C/polyline%3E%3C/svg%3E")}.native-icv .icv__handle-circle::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E")}.native-icv .icv__label{position:absolute;top:1rem;z-index:4;font-size:12px;background-color:rgba(255,255,255,.45);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#333;border:1px solid rgba(255,255,255,.7);border-radius:8px;padding:4px 10px;pointer-events:none;font-weight:500}.native-icv .icv__label-before{left:1rem}.native-icv .icv__label-after{right:1rem}#image-compare:not(.native-icv):not(.icv){position:relative;display:flex;overflow:hidden;aspect-ratio:1696/920;border-radius:24px}#image-compare:not(.native-icv):not(.icv) img:first-of-type{width:50%;height:100%;object-fit:cover;object-position:left}#image-compare:not(.native-icv):not(.icv) img:last-of-type{width:50%;height:100%;object-fit:cover;object-position:right}.image-examples-item.active{border-color:#007bff}.deferred-thumb{transition:opacity .25s ease-in}.deferred-thumb:not([src]){opacity:0}
|
|
/* api#283: утверждённый первый экран с раскрытыми панелями Яндекса. */
|
|
@media (max-width: 767.98px) {
|
|
.index-mobile-fit { padding-top: 8px !important; }
|
|
.index-mobile-fit #image-compare { width: 100%; container-type: inline-size; aspect-ratio: 1696 / 920; max-height: clamp(120px, calc(100svh - 440px), 240px); }
|
|
/* Обе стороны одного масштаба и кадрирования при ограниченной высоте. */
|
|
.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 :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; }
|
|
.index-mobile-fit .image-examples-item { flex-basis: calc((100% - 32px) / 5); min-width: 0; }
|
|
.index-mobile-fit #image-compare .icv__label { top: 4px; bottom: auto; margin: 0; width: 48px; height: 20px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; font: 600 9px/1.3 Inter, sans-serif; padding: 2px 5px; border: 1px solid rgb(255 255 255 / 65%); border-radius: 5px; background: rgb(67 72 82 / 72%); color: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / 20%); text-shadow: 0 1px 1px rgb(0 0 0 / 35%); white-space: nowrap; }
|
|
.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;display:inline-flex;align-items:center;justify-content:center;} .header .navbar-toggler-icon{width:20px;height:20px;background-size:20px;display:block;}
|
|
.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;}}
|
|
@media (min-width:768px){.image-compare .icv__label{top:10px;width:92px;height:36px;display:flex;align-items:center;justify-content:center;padding:4px 10px;font:400 16px/26px Inter,sans-serif;color:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;background:rgb(0 0 0 / 25%);border:1px solid rgb(255 255 255 / 80%);box-shadow:none;text-shadow:none;}}
|
|
.upload-loading-dots{display:inline-grid;text-align:left;}.upload-loading-dots::before{content:'.....';visibility:hidden;grid-area:1 / 1;}.upload-loading-dots > span{grid-area:1 / 1;}
|
|
|
|
|
|
/* api#298: общий каркас API/Preland; синхронизировать этот блок в обоих репозиториях. */
|
|
html { scrollbar-gutter: stable; }
|
|
body { isolation: isolate; }
|
|
.wrapper {
|
|
--site-header-height: 90px;
|
|
--site-background: url(../images/bg.jpg);
|
|
min-height: 100svh;
|
|
background-image: none;
|
|
}
|
|
.theme-dark .wrapper { --site-background: url(../images/dark-bg.jpg); background-image: none; }
|
|
.wrapper::before {
|
|
content: "";
|
|
position: fixed;
|
|
z-index: -1;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100vh;
|
|
height: 100lvh;
|
|
background: var(--site-background) center / cover no-repeat;
|
|
pointer-events: none;
|
|
}
|
|
.wrapper .main-section:not(.main-section-alt),
|
|
.wrapper .main-section.main-section-alt2,
|
|
.wrapper .main-content-wrapper { min-height: calc(100svh - var(--site-header-height)); }
|
|
.wrapper .main-content-wrapper { height: auto; }
|
|
.wrapper .main-content-wrapper > .main-section { min-height: 0; }
|
|
@media (min-width: 768px) {
|
|
/* 520px — общий desktop-слот Index с фото и полосой примеров при контейнере 1300px.
|
|
Верхняя граница не зависит от короткого/длинного содержимого текущего шага. */
|
|
.wrapper .index-mobile-fit,
|
|
.wrapper .tour-processing {
|
|
justify-content: flex-start;
|
|
padding-top: max(24px, calc((100svh - var(--site-header-height) - 520px) / 2)) !important;
|
|
}
|
|
:is(.index-mobile-fit, .tour-processing) :is(#dropzone-form, #process) {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-height: 456px;
|
|
}
|
|
:is(.index-mobile-fit, .tour-processing) :is(#dropzone-form, #process) .dropzone-form-inner {
|
|
width: 100%;
|
|
padding-top: 0;
|
|
padding-bottom: 0;
|
|
}
|
|
:is(.index-mobile-fit, .tour-processing) #preview { height: 100%; aspect-ratio: auto; }
|
|
}
|
|
@media (max-width: 767.98px) { .wrapper { --site-header-height: 68px; } }
|
|
/* /api#298 */
|
|
|
|
/* api#301: геометрия примеров существует до загрузки изображений и viewer. */
|
|
.index-mobile-fit .dropzone-form-action { display: flex; justify-content: center; }
|
|
.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; }
|
|
}
|
|
/* Разметка может прийти частями: показываем только полностью полученную форму. */
|
|
|
|
@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; }
|
|
}
|
|
|
|
/* preland#11: общий с API адаптивный платёжный бейдж подвала. */
|
|
.footer-main img[src$="/images/payment.svg"]{max-width:100%;height:auto;}
|
|
|
|
/* preland#12: восстановлен пропущенный в critical CSS Bootstrap-контракт navbar. */
|
|
.navbar>.container{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between;}
|
|
|
|
/* api#313 / preland#16: первый экран, стабильный бюджет высоты и явное состояние загрузки. */
|
|
#dropzone-form[data-upload-pending="true"] .dropzone-form-button {
|
|
background: #979aa0; opacity: 1; filter: none; cursor: progress;
|
|
}
|
|
#dropzone-form[data-upload-pending="true"] .dropzone-form-action [data-files-picker] {
|
|
color: #979aa0; pointer-events: none; cursor: default;
|
|
}
|
|
.wrapper { min-height: 100vh; min-height: 100svh; }
|
|
.wrapper .main-section.index-mobile-fit,
|
|
.wrapper .main-content-wrapper { min-height: calc(100vh - var(--site-header-height)); }
|
|
@supports (height: 100svh) {
|
|
.wrapper .main-section.index-mobile-fit,
|
|
.wrapper .main-content-wrapper { min-height: calc(100svh - var(--site-header-height)); }
|
|
}
|
|
@media (min-width: 768px) {
|
|
.index-mobile-fit .index-upload-heading { font-size: 24px; font-weight: 600; }
|
|
}
|
|
@media (max-width: 767.98px) {
|
|
.index-mobile-fit { --index-small-height: 100vh; }
|
|
.index-mobile-fit #image-compare { max-height: clamp(120px, calc(var(--index-small-height) - 360px), 240px); }
|
|
.index-mobile-fit #image-compare .icv__img,
|
|
.index-mobile-fit #image-compare.native-icv img { width: var(--compare-width, 100%) !important; }
|
|
html[data-upload-device=android] .index-mobile-fit #dropzone-form { min-height: 243px; }
|
|
html[data-upload-device=mobile] .index-mobile-fit #dropzone-form { min-height: 201px; }
|
|
.index-mobile-fit[data-compact-upload=true] .dropzone-form-icon { display: none; }
|
|
.index-mobile-fit[data-compact-upload=true] #dropzone-form #form-title { margin-top: 0; }
|
|
html[data-upload-device] .index-mobile-fit[data-compact-upload=true] #dropzone-form { min-height: 0; }
|
|
}
|
|
@supports (height: 100svh) {
|
|
.index-mobile-fit { --index-small-height: 100svh; }
|
|
}
|
|
/* Без :has форма остаётся доступной; современные движки сохраняют partial-HTML gate. */
|
|
@supports selector(:has(*)) {
|
|
.index-mobile-fit #dropzone-form:not(:has([data-upload-markup-ready])) { visibility: hidden; }
|
|
}
|
|
/* /api#313 / preland#16 */ |