Repaint theme blue with larger typography
Swap the cherry-red primary for the logo's blue, bump body 13→15px and h1 32→40px, and add semantic tokens (--bg-*, --accent-*, --text-*) so future palette shifts are a single-file edit. Cherry-red survives only for danger states and the brand cherry mark. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -16,22 +16,22 @@
|
||||
.mark {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
gap: 10px;
|
||||
font-family: var(--font-display);
|
||||
color: var(--cream);
|
||||
letter-spacing: 2px;
|
||||
letter-spacing: var(--tracking-display);
|
||||
line-height: 1;
|
||||
animation: cherry-fizz 6s ease-in-out infinite;
|
||||
}
|
||||
.mark-sm .word { font-size: 12px; letter-spacing: 1.5px; }
|
||||
.mark-md .word { font-size: 16px; }
|
||||
.mark-lg .word { font-size: 26px; letter-spacing: 3px; }
|
||||
.mark-sm .word { font-size: 14px; letter-spacing: 1.5px; }
|
||||
.mark-md .word { font-size: 18px; }
|
||||
.mark-lg .word { font-size: 32px; letter-spacing: 3px; }
|
||||
|
||||
.bolt {
|
||||
fill: var(--spark-500);
|
||||
filter: drop-shadow(0 0 4px rgba(34, 224, 255, 0.7));
|
||||
filter: drop-shadow(0 0 5px rgba(124, 212, 255, 0.75));
|
||||
}
|
||||
.mark-sm .bolt { width: 10px; height: 16px; }
|
||||
.mark-md .bolt { width: 12px; height: 20px; }
|
||||
.mark-lg .bolt { width: 18px; height: 30px; }
|
||||
.mark-sm .bolt { width: 12px; height: 20px; }
|
||||
.mark-md .bolt { width: 14px; height: 24px; }
|
||||
.mark-lg .bolt { width: 22px; height: 36px; }
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user