Fix header in mobile

This commit is contained in:
2023-01-09 15:59:52 +01:00
parent 3088faaf3f
commit c3638507ea
2 changed files with 74 additions and 41 deletions
+30 -27
View File
@@ -1,5 +1,5 @@
import { Link } from 'preact-router/match'
import { isAdministrator, User, UserRole } from '../../shared/model'
import { isAdministrator, UserRole } from '../../shared/model'
import { prependBaseUrl } from '../api'
import { useCurrentUser } from '../hooks/useCurrentUser'
@@ -9,7 +9,7 @@ const ROLE_LABEL: Record<UserRole, string> = {
['student']: 'Studente',
}
export const Header = ({}) => {
export const Header = ({ }) => {
const [user] = useCurrentUser()
return (
@@ -18,34 +18,37 @@ export const Header = ({}) => {
<a href={prependBaseUrl('/')}>PHC / Problemi</a>
</div>
<nav>
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/scores')}>
Classifica
</Link>
</div>
{user ? (
<>
{isAdministrator(user.role) && (
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/admin')}>
Pannello Admin
</Link>
</div>
)}
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/profile')}>
@{user.id}
{isAdministrator(user.role) && <> ({ROLE_LABEL[user.role]})</>}
</Link>
</div>
</>
) : (
<div class="nav-left">
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/login')}>
Login
<Link activeClassName="active" href={prependBaseUrl('/scores')}>
Classifica
</Link>
</div>
)}
</div>
<div class="nav-right">
{user ? (
<>
{isAdministrator(user.role) && (
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/admin')}>
Pannello Admin
</Link>
</div>
)}
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/profile')}>
@{user.id}
</Link>
</div>
</>
) : (
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/login')}>
Login
</Link>
</div>
)}
</div>
</nav>
</header>
)