Replace blue M icon with app logo in nav bar

This commit is contained in:
Xisheng-Zhao
2026-06-08 17:16:38 +08:00
parent 8a0b1703c1
commit 6df3b0d53e
3 changed files with 5 additions and 7 deletions
+2 -1
View File
@@ -1,3 +1,4 @@
import logoImg from "./assets/logo.png";
import { useState, useEffect, useRef, useCallback, useMemo } from "react"; import { useState, useEffect, useRef, useCallback, useMemo } from "react";
import { motion, AnimatePresence, useMotionValue, useTransform, useReducedMotion } from "motion/react"; import { motion, AnimatePresence, useMotionValue, useTransform, useReducedMotion } from "motion/react";
import inboxImg from "./assets/screenshots/01-inbox.jpg"; import inboxImg from "./assets/screenshots/01-inbox.jpg";
@@ -389,7 +390,7 @@ export default function App() {
<div className="hero-bg" /> <div className="hero-bg" />
<motion.nav className="topbar" {...fade(reduced, 0)}> <motion.nav className="topbar" {...fade(reduced, 0)}>
<div className="brand"> <div className="brand">
<div className="brand-mark">M</div> <img src={logoImg} alt="Multi-Casual" className="brand-mark" />
<span>{t.nav.brand}</span> <span>{t.nav.brand}</span>
</div> </div>
<div className="nav-links"> <div className="nav-links">
Binary file not shown.

After

Width:  |  Height:  |  Size: 140 KiB

+3 -6
View File
@@ -77,12 +77,9 @@ a { color: inherit; text-decoration: none; }
.brand-mark { .brand-mark {
width: 34px; width: 34px;
height: 34px; height: 34px;
border-radius: 12px; border-radius: 10px;
display: grid; object-fit: cover;
place-items: center; display: block;
color: white;
background: var(--blue);
box-shadow: 0 8px 18px rgba(22, 71, 255, 0.32);
} }
.nav-links a { .nav-links a {