Replace hotel emoji on login screen with Lucide Hotel icon; add sidebar scrollbar styles

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
jtricerolph 2026-07-14 08:17:51 +00:00
parent 567e5bf73e
commit f36fd83196
3 changed files with 20 additions and 2 deletions

View file

@ -75,7 +75,7 @@ export function Sidebar({ user, activeSlug, onCollapse }: Props) {
)}
</div>
<nav style={{ flex: 1, overflowY: 'auto', padding: '0.5rem 0' }}>
<nav className="nav-scroll" style={{ flex: 1, overflowY: 'auto', padding: '0.5rem 0' }}>
{/* Dashboard */}
<NavLink to="/" end style={({ isActive }) => navItem(isActive && !activeSlug)}>

View file

@ -37,3 +37,18 @@ body {
button { cursor: pointer; font-family: inherit; }
a { color: inherit; text-decoration: none; }
/* Sidebar scrollbar */
.nav-scroll::-webkit-scrollbar,
.sidebar::-webkit-scrollbar,
.sidebar-nav::-webkit-scrollbar { width: 4px; }
.nav-scroll::-webkit-scrollbar-track,
.sidebar::-webkit-scrollbar-track,
.sidebar-nav::-webkit-scrollbar-track { background: transparent; }
.nav-scroll::-webkit-scrollbar-thumb,
.sidebar::-webkit-scrollbar-thumb,
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(201,168,76,0.35); border-radius: 2px; }
.nav-scroll::-webkit-scrollbar-thumb:hover,
.sidebar::-webkit-scrollbar-thumb:hover,
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: rgba(201,168,76,0.65); }
.nav-scroll, .sidebar, .sidebar-nav { scrollbar-width: thin; scrollbar-color: rgba(201,168,76,0.35) transparent; }

View file

@ -1,5 +1,6 @@
import { useState } from 'react'
import { useNavigate, useLocation } from 'react-router-dom'
import { Hotel } from 'lucide-react'
export function Login() {
const [email, setEmail] = useState('')
@ -34,7 +35,9 @@ export function Login() {
justifyContent: 'center', padding: '1.5rem', background: 'var(--navy-dark)' }}>
<div style={{ width: '100%', maxWidth: '360px' }}>
<div style={{ textAlign: 'center', marginBottom: '2rem' }}>
<div style={{ fontSize: '2rem', marginBottom: '0.5rem' }}>🏨</div>
<div style={{ marginBottom: '0.5rem', color: 'var(--gold)' }}>
<Hotel size={40} strokeWidth={1.75} />
</div>
<h1 style={{ fontSize: '1.5rem', color: 'var(--gold)', letterSpacing: '0.05em' }}>MANAGE</h1>
<p style={{ color: 'var(--text-muted)', fontSize: '0.85rem', marginTop: '0.25rem' }}>
{import.meta.env.VITE_HOTEL_NAME}