Rebrand app as RanaZe Step 3 Trainer

This commit is contained in:
hz
2026-07-20 00:04:29 -05:00
parent 743399f647
commit d176640cff
25 changed files with 206 additions and 92 deletions
+27 -15
View File
@@ -32,7 +32,7 @@
:root {
color-scheme: light;
--background: #f8faff;
--background-accent: rgba(124, 58, 237, 0.12);
--background-accent: rgba(56, 189, 248, 0.12);
--background-accent-secondary: rgba(37, 99, 235, 0.08);
--dot: rgba(99, 102, 241, 0.26);
--brand-dark: #0b1324;
@@ -46,7 +46,7 @@
:root[data-theme="dark"] {
color-scheme: dark;
--background: #020b1d;
--background-accent: rgba(124, 58, 237, 0.3);
--background-accent: rgba(37, 99, 235, 0.3);
--background-accent-secondary: rgba(37, 99, 235, 0.18);
--dot: rgba(61, 91, 210, 0.68);
--brand-dark: #f8fafc;
@@ -141,19 +141,19 @@
}
.corner-accent--top {
background: radial-gradient(circle at 35% 65%, rgba(124, 58, 237, 0.04), rgba(99, 102, 241, 0.13));
background: radial-gradient(circle at 35% 65%, rgba(56, 189, 248, 0.04), rgba(37, 99, 235, 0.13));
right: max(-150px, -10vw);
top: max(-180px, -13vw);
}
.corner-accent--bottom {
background: radial-gradient(circle at 65% 35%, rgba(124, 58, 237, 0.02), rgba(99, 102, 241, 0.1));
background: radial-gradient(circle at 65% 35%, rgba(56, 189, 248, 0.02), rgba(37, 99, 235, 0.1));
bottom: max(-210px, -16vw);
left: max(-180px, -13vw);
}
:root[data-theme="dark"] .corner-accent--top {
background: radial-gradient(circle at 30% 70%, rgba(124, 58, 237, 0.18), rgba(49, 46, 129, 0.72));
background: radial-gradient(circle at 30% 70%, rgba(56, 189, 248, 0.18), rgba(30, 64, 175, 0.72));
}
:root[data-theme="dark"] .corner-accent--bottom {
@@ -162,6 +162,7 @@
.loader-logo-wrap {
height: clamp(112px, 16vw, 154px);
overflow: hidden;
position: relative;
width: clamp(112px, 16vw, 154px);
}
@@ -170,6 +171,7 @@
display: block;
height: 100%;
object-fit: contain;
transform: scale(2.1);
width: 100%;
}
@@ -181,17 +183,26 @@
margin: 12px 0 0;
}
.wordmark-med {
.wordmark-rana {
color: var(--brand-dark);
}
.wordmark-mind {
background: linear-gradient(90deg, #2563eb 0%, #7c3aed 58%, #d946ef 100%);
.wordmark-ze {
background: linear-gradient(90deg, #2563eb 0%, #38bdf8 100%);
background-clip: text;
color: transparent;
-webkit-background-clip: text;
}
.wordmark-trainer {
color: var(--muted);
display: block;
font-size: 0.27em;
font-weight: 650;
letter-spacing: 0.12em;
margin-top: 14px;
}
.loader-tagline {
color: var(--muted);
font-size: clamp(20px, 2.3vw, 28px);
@@ -216,7 +227,7 @@
}
.progress-value {
background: linear-gradient(90deg, #2563eb 0%, #7c3aed 60%, #a855f7 100%);
background: linear-gradient(90deg, #2563eb 0%, #38bdf8 100%);
border-radius: inherit;
height: 100%;
transform-origin: left center;
@@ -309,13 +320,14 @@
<div class="corner-accent corner-accent--bottom"></div>
<div class="loader">
<div class="loader-logo-wrap">
<img class="loader-logo" src="medmind-loader-icon.png" alt="MedMind">
<img class="loader-logo" src="ranaze-loader-icon.png" alt="RanaZe">
</div>
<div class="loader-wordmark" aria-label="MedMind">
<span class="wordmark-med">Med</span><span class="wordmark-mind">Mind</span>
<div class="loader-wordmark" aria-label="RanaZe: Step 3 Trainer">
<span class="wordmark-rana">Rana</span><span class="wordmark-ze">Ze</span>
<span class="wordmark-trainer">STEP 3 TRAINER</span>
</div>
<p class="loader-tagline">Think like a physician.</p>
<div id="status-progress" class="progress-row" role="progressbar" aria-label="Loading MedMind" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
<p class="loader-tagline">Focused practice. Better clinical decisions.</p>
<div id="status-progress" class="progress-row" role="progressbar" aria-label="Loading RanaZe" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
<div class="progress-track"><div id="status-progress-value" class="progress-value"></div></div>
<span id="status-progress-percent" class="progress-percent">0%</span>
</div>
@@ -357,7 +369,7 @@
? error.message
: (typeof error === 'string' ? error : 'An unknown error occurred.');
statusProgress.style.display = 'none';
statusMessage.textContent = 'MedMind could not finish loading.';
statusMessage.textContent = 'RanaZe could not finish loading.';
statusNotice.textContent = message;
statusNotice.style.display = 'block';
initializing = false;