Improve professional appearance: logo, favicon, and remove emoji icons
All checks were successful
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 34s
Build and Push Docker Images / Build Frontend (Next.js) (push) Successful in 1m12s
Build and Push Docker Images / Trigger Portainer Update (push) Successful in 1s

1. Added original favicon
   - Copied favicon.svg from original frontend
   - Added favicon reference to layout metadata
   - Professional icon with brand colors

2. Updated logo in navigation
   - Replaced emoji with proper SVG logo from original design
   - Uses circular target design with crosshairs
   - Matches brand identity with coral accent color

3. Removed emoji icons throughout app for professional look
   - Removed 📍 (location pin) from school locations
   - Removed 🏫 (school building) from school types
   - Removed 🔢 from URN labels and section headings
   - Kept meaningful symbols (✓, +) in buttons only
   - Updated map popup button color to brand coral (#e07256)

Components updated:
- Navigation: Professional SVG logo
- HomeView: Clean location banner
- SchoolDetailView: No decorative emojis in metadata
- ComparisonView: Text-only school information
- SchoolSearchModal: Clean school listings
- LeafletMapInner: Professional map popups

Result: More polished, professional appearance suitable for
educational data platform

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Tudor
2026-02-02 22:34:14 +00:00
parent 2e62853b70
commit 19e5199443
8 changed files with 29 additions and 13 deletions

View File

@@ -25,7 +25,13 @@ export function Navigation() {
<header className={styles.header}>
<div className={styles.container}>
<Link href="/" className={styles.logo}>
<span className={styles.logoIcon}>🏫</span>
<div className={styles.logoIcon}>
<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="20" cy="20" r="18" stroke="currentColor" strokeWidth="2"/>
<path d="M20 6L20 34M8 14L32 14M6 20L34 20M8 26L32 26" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round"/>
<circle cx="20" cy="20" r="3" fill="currentColor"/>
</svg>
</div>
<span className={styles.logoText}>SchoolCompare</span>
</Link>