feat: preloader smooth fade ticker; fix asiago shelf life; kiosk 5-lang wizard (ES/FR + Gemini/Bring steps)
Preloader: - Replace 3D wheel with smooth fade-in ticker queue - Bigger text (clamp 1.1–1.35rem), green/amber/red per check state - Previous items fade upward at decreasing opacity - Wider container (min(96vw,860px)) — no more awkward line-wrapping - JS already used ticker-item/state-ok/warn/error classes (CSS was missing) Shelf life — Asiago sottovuoto fix: - estimateSealedExpiryDaysPHP() and estimateExpiryDays() JS: asiago/fontina/emmental/gruyere/scamorza now grouped with hard cheeses (60d base) vacuum sealed: 60 × 2.5 = 150 days — correct for fridge + sottovuoto - Cleared stale opened_shelf_cache entry for 'Formaggio Asiago fresco' Kiosk wizard: - 5 languages: values-es/ and values-fr/ created (97 strings each) - values/, values-it/, values-de/: complete rewrite with new keys (ble_connecting, ble_connecting_to, summary_scale_ok/warn, Gemini/Bring step strings) stepDone hardcoded Italian → @string refs; screensaver nav → @string/setup_step_back/next - SetupActivity.kt: steps 0-8 fully implemented; ES/FR language selection; auto-skip Gemini/Bring if already configured; buildSummary() localised; finishSetup() sends gemini_api_key + bring_email/password; BLE connecting strings localised; scale summary lines use R.string
This commit is contained in:
+52
-44
@@ -122,8 +122,7 @@ body {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
width: 310px;
|
||||
max-width: 92vw;
|
||||
width: min(92vw, 600px);
|
||||
animation: zwFadeIn 0.2s ease;
|
||||
}
|
||||
.preloader-bar-track {
|
||||
@@ -144,60 +143,69 @@ body {
|
||||
.preloader-bar.bar-warn { background: linear-gradient(90deg, #fbbf24, #f59e0b); }
|
||||
.preloader-check-label { display: none; } /* replaced by check-wheel */
|
||||
|
||||
/* ── Startup check wheel (3-D scroll) ──────────────────────────────── */
|
||||
.check-wheel {
|
||||
/* ── Startup check ticker (smooth fade queue) ───────────────────────── */
|
||||
.preloader-progress-wrap {
|
||||
width: min(96vw, 860px) !important;
|
||||
}
|
||||
.check-ticker {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 108px;
|
||||
perspective: 640px;
|
||||
height: 170px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 6px;
|
||||
}
|
||||
.check-wheel-current {
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: clamp(0.88rem, 2.6vw, 1.08rem);
|
||||
font-weight: 700;
|
||||
padding: 10px 14px;
|
||||
border-radius: 14px;
|
||||
border: 1px solid rgba(52,211,153,0.35);
|
||||
background: rgba(52,211,153,0.08);
|
||||
color: #34d399;
|
||||
transform-style: preserve-3d;
|
||||
animation: checkWheelIn 0.30s ease;
|
||||
letter-spacing: 0.01em;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.check-wheel-current.state-ok { color: #34d399; background: rgba(52,211,153,0.08); border-color: rgba(52,211,153,0.35); }
|
||||
.check-wheel-current.state-warn { color: #fbbf24; background: rgba(251,191,36,0.08); border-color: rgba(251,191,36,0.35); }
|
||||
.check-wheel-current.state-error { color: #f87171; background: rgba(248,113,113,0.08); border-color: rgba(248,113,113,0.35); }
|
||||
.check-wheel-prev {
|
||||
.ticker-item {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
left: 6%; right: 6%;
|
||||
left: 0; right: 0;
|
||||
text-align: center;
|
||||
font-size: clamp(0.67rem, 1.8vw, 0.82rem);
|
||||
font-weight: 600;
|
||||
color: rgba(203,213,225,0.45);
|
||||
opacity: 0.52;
|
||||
transform: rotateX(54deg) scale(0.85);
|
||||
transform-origin: center bottom;
|
||||
padding: 0 12px;
|
||||
line-height: 1.45;
|
||||
pointer-events: none;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
pointer-events: none;
|
||||
font-family: monospace;
|
||||
}
|
||||
@keyframes checkWheelIn {
|
||||
from { transform: translateY(24px) rotateX(-18deg); opacity: 0.35; }
|
||||
to { transform: translateY(0) rotateX(0deg); opacity: 1; }
|
||||
/* Current — fades in from below, bright and large */
|
||||
.ticker-current {
|
||||
bottom: 8px;
|
||||
font-size: clamp(1.1rem, 3.2vw, 1.35rem);
|
||||
font-weight: 700;
|
||||
opacity: 1;
|
||||
color: #4ade80;
|
||||
letter-spacing: 0.01em;
|
||||
animation: tickerFadeIn 0.5s cubic-bezier(0.22, 1, 0.36, 1);
|
||||
}
|
||||
.ticker-current.state-ok { color: #4ade80; }
|
||||
.ticker-current.state-warn { color: #fbbf24; }
|
||||
.ticker-current.state-error { color: #f87171; }
|
||||
/* Previous items — progressively dimmer and smaller, scrolling up */
|
||||
.ticker-prev-1 {
|
||||
bottom: 54px;
|
||||
font-size: clamp(0.92rem, 2.5vw, 1.1rem);
|
||||
font-weight: 600;
|
||||
opacity: 0.48;
|
||||
color: #94a3b8;
|
||||
}
|
||||
.ticker-prev-2 {
|
||||
bottom: 94px;
|
||||
font-size: clamp(0.78rem, 2vw, 0.92rem);
|
||||
font-weight: 500;
|
||||
opacity: 0.22;
|
||||
color: #64748b;
|
||||
}
|
||||
.ticker-prev-3 {
|
||||
bottom: 128px;
|
||||
font-size: clamp(0.66rem, 1.7vw, 0.78rem);
|
||||
font-weight: 400;
|
||||
opacity: 0.09;
|
||||
color: #475569;
|
||||
}
|
||||
@keyframes tickerFadeIn {
|
||||
from { opacity: 0; transform: translateY(22px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
.preloader-warnings {
|
||||
max-width: 310px;
|
||||
max-width: min(92vw, 600px);
|
||||
width: 100%;
|
||||
animation: zwFadeIn 0.3s ease;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user