caterium/caterium-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: match the early login boot placeholder to the cream login redesign

Browse Source 
performance.js paints a full-screen boot placeholder immediately on
page load (before app-runtime.js and the real auth gate exist), so it
never got updated when login-signature-v1776.js was redesigned from a
dark two-column layout with an offer-gallery/002.jpg table photo to
the light single-column "cream login" with the Caterium SVG mark.

Result: every signed-out visitor saw the old dark/photo screen flash
for a moment, then get replaced by the new light screen once the real
gate rendered - the flicker was two genuinely different, undeployed-
in-sync designs, not a caching artifact. Rebuilt the boot placeholder's
markup and inline critical CSS to mirror login-signature-v1776.js's
current design (same background, mark, type, and copy) so the first
paint already matches what replaces it.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
pavlov346346-source 2026-09-12 14:40:33 +03:00
parent 195e0ba5c3
commit 2e2f02efc3
1 changed files with 14 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
public/core/performance.js
View File

@ -7,24 +7,22 @@
function installAuthBoot(){
if(hasStoredSession()||document.getElementById('cateriumAuthBootV1776'))return;
const style=document.createElement('style');style.id='caterium-auth-boot-v1776-style';style.textContent=`
#cateriumAuthBootV1776{position:fixed;inset:0;z-index:30000;display:grid;grid-template-columns:minmax(520px,47%) 1fr;background:#091019;color:#fff;overflow:hidden;transition:opacity .18s ease}
#cateriumAuthBootV1776{position:fixed;inset:0;z-index:30000;overflow:hidden;display:grid;place-items:center;padding:clamp(32px,6vh,78px) clamp(24px,8vw,120px);background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.92),transparent 34%),radial-gradient(circle at 77% 22%,rgba(255,255,255,.5),transparent 28%),linear-gradient(135deg,#f8f4ec 0%,#f2ece1 56%,#f7f3eb 100%);color:#282621;transition:opacity .18s ease}
#cateriumAuthBootV1776.leave{opacity:0;pointer-events:none}
#cateriumAuthBootV1776:before{content:'';position:absolute;inset:0 47% 0 0;background:radial-gradient(circle at 74% 48%,rgba(226,169,59,.13),transparent 18%),linear-gradient(125deg,#091019 0%,#111922 62%,#17191b 100%)}
#cateriumAuthBootV1776:after{content:'';position:absolute;top:0;right:0;bottom:0;width:53%;background-image:linear-gradient(90deg,#111922 0%,rgba(17,25,34,.48) 12%,rgba(0,0,0,.08) 44%),url('offer-gallery/002.jpg');background-size:cover;background-position:center;filter:saturate(.92) contrast(1.04)}
#cateriumAuthBootV1776 .cab-wrap{position:relative;z-index:2;grid-column:1;align-self:center;justify-self:center;width:min(470px,calc(100% - 72px));padding:24px 0 34px}
#cateriumAuthBootV1776 .cab-wrap:before{content:'C';position:fixed;z-index:-1;left:-7vw;top:50%;transform:translateY(-53%);font:400 min(68vw,790px)/.72 Georgia,'Times New Roman',serif;color:transparent;-webkit-text-stroke:min(5.8vw,82px) rgba(255,255,255,.09)}
#cateriumAuthBootV1776 .cab-brand{display:flex;align-items:center;gap:12px;margin-bottom:42px}
#cateriumAuthBootV1776 .cab-c{position:relative;width:52px;height:52px;font:500 58px/1 Georgia,'Times New Roman',serif;letter-spacing:-8px}.cab-c i{position:absolute;right:-2px;top:23px;width:9px;height:9px;border-radius:50%;background:#e3aa3f}
#cateriumAuthBootV1776 .cab-word{font:500 30px/1 Georgia,'Times New Roman',serif}
#cateriumAuthBootV1776 h1{margin:0;max-width:440px;font:500 clamp(37px,3.25vw,52px)/1.04 Georgia,'Times New Roman',serif;letter-spacing:-.025em}
#cateriumAuthBootV1776 p{margin:10px 0 0;color:rgba(255,255,255,.67);font:15px/1.5 Arial,sans-serif}
#cateriumAuthBootV1776 .cab-fields{margin-top:31px;display:grid;gap:13px}.cab-field{height:48px;border:1px solid rgba(255,255,255,.22);border-radius:9px;background:rgba(8,12,16,.30)}
#cateriumAuthBootV1776 .cab-btn{height:50px;margin-top:7px;border-radius:9px;background:linear-gradient(100deg,#dba137,#efc45f)}
#cateriumAuthBootV1776 .cab-note{position:fixed;right:42px;top:36px;width:150px;color:rgba(255,255,255,.7);font:9px/1.9 Arial,sans-serif;letter-spacing:.23em;text-transform:uppercase;text-shadow:0 1px 10px #0008}
#cateriumAuthBootV1776 .cab-note:after{content:'';display:block;width:42px;height:2px;margin-top:12px;background:#e3aa3f}
@media(max-width:900px){#cateriumAuthBootV1776{grid-template-columns:1fr;background:#091019}#cateriumAuthBootV1776:after{width:100%;opacity:.5;background-image:linear-gradient(180deg,rgba(5,10,15,.38),rgba(5,10,15,.88)),url('offer-gallery/002.jpg')}#cateriumAuthBootV1776:before{inset:0;background:linear-gradient(180deg,rgba(7,13,20,.72),rgba(7,13,20,.9))}#cateriumAuthBootV1776 .cab-wrap{grid-column:1;width:min(460px,calc(100% - 36px));padding:24px 20px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(7,12,17,.66);backdrop-filter:blur(13px)}#cateriumAuthBootV1776 .cab-note{display:none}}
#cateriumAuthBootV1776:before{content:'C';position:fixed;z-index:0;left:-7vw;top:49%;transform:translateY(-50%);font:400 min(72vw,860px)/.72 Georgia,'Times New Roman',serif;color:rgba(73,67,59,.032)}
#cateriumAuthBootV1776 .cab-wrap{position:relative;z-index:2;width:min(790px,100%);padding:0 0 58px}
#cateriumAuthBootV1776 .cab-brand{display:flex;align-items:center;gap:13px;margin:0 0 clamp(46px,7vh,88px)}
#cateriumAuthBootV1776 .cab-mark{display:block;width:62px;height:62px;object-fit:contain;flex:0 0 62px}
#cateriumAuthBootV1776 .cab-word{font:500 36px/1 Georgia,'Times New Roman',serif;color:#26231f;letter-spacing:-.02em}
#cateriumAuthBootV1776 h1{margin:0;max-width:720px;color:#24211d;font:500 clamp(48px,5.2vw,76px)/.99 Georgia,'Times New Roman',serif;letter-spacing:-.045em}
#cateriumAuthBootV1776 p{margin:18px 0 0;color:#8e887f;font:400 clamp(16px,1.55vw,21px)/1.45 Arial,sans-serif}
#cateriumAuthBootV1776 .cab-fields{margin-top:25px;display:grid;gap:14px}.cab-field{height:58px;border:1px solid #bdb5aa;border-radius:13px;background:rgba(255,255,255,.13)}
#cateriumAuthBootV1776 .cab-btn{height:62px;margin-top:11px;border-radius:13px;background:linear-gradient(100deg,#d9aa42,#efca69)}
#cateriumAuthBootV1776 .cab-note{position:fixed;left:42px;bottom:31px;color:#9d968d;font:9px/1 Arial,sans-serif;letter-spacing:.31em;text-transform:uppercase;text-shadow:none}
@media(max-width:900px){#cateriumAuthBootV1776{padding:34px 28px 70px;place-items:start center}#cateriumAuthBootV1776 .cab-wrap{width:min(720px,100%);padding-top:12px}}
@media(max-width:620px){#cateriumAuthBootV1776{min-height:100dvh;padding:25px 18px 50px;place-items:start center}#cateriumAuthBootV1776 .cab-wrap{width:100%}#cateriumAuthBootV1776 .cab-brand{margin-bottom:42px}#cateriumAuthBootV1776 .cab-mark{width:50px;height:50px;flex-basis:50px}#cateriumAuthBootV1776 .cab-word{font-size:29px}#cateriumAuthBootV1776 h1{font-size:clamp(38px,12vw,52px)}#cateriumAuthBootV1776 .cab-note{display:none}}
`;document.head.appendChild(style);
const el=document.createElement('div');el.id='cateriumAuthBootV1776';el.innerHTML='<div class="cab-wrap"><div class="cab-brand"><span class="cab-c">C<i></i></span><span class="cab-word">Caterium</span></div><h1>Войти в рабочее пространство</h1><p>Ваши заказы. Ваша команда. Ваш результат.</p><div class="cab-fields"><div class="cab-field"></div><div class="cab-field"></div><div class="cab-btn"></div></div></div><div class="cab-note">Создаём впечатления, которые объединяют</div>';document.documentElement.appendChild(el);
const el=document.createElement('div');el.id='cateriumAuthBootV1776';el.innerHTML='<div class="cab-wrap"><div class="cab-brand"><img class="cab-mark" src="caterium-mark-light.svg" alt=""><span class="cab-word">Caterium</span></div><h1>Войти в рабочее пространство</h1><p>Ваши заказы. Ваша команда. Ваш результат.</p><div class="cab-fields"><div class="cab-field"></div><div class="cab-field"></div><div class="cab-btn"></div></div></div><div class="cab-note">Caterium · вкус в деталях</div>';document.documentElement.appendChild(el);
}
function loadLoginSignatureEarly(){if(window.CateriumLoginSignatureV1776||document.getElementById('cateriumLoginSignatureV1776Script'))return;const s=document.createElement('script');s.id='cateriumLoginSignatureV1776Script';s.src=`core/login-signature-v1776.js?v=${RELEASE}`;s.async=false;document.head.appendChild(s)}
installAuthBoot();loadLoginSignatureEarly();