phc
/
problemi
6
3
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'dev' of https://git.phc.dm.unipi.it/phc/problemi into dev

Browse Source
pull/1/head
Antonio De Lucreziis 2 years ago
parent d016aee867 c3638507ea
commit 4e417266c4
2 changed files with 69 additions and 36 deletions
Show Stats Download Patch File Download Diff File

49
client/components/Header.tsx
Unescape Escape View File

@ -1,5 +1,5 @@
import { Link } from 'preact-router/match' import { Link } from 'preact-router/match'
import { isAdministrator, User, UserRole } from '../../shared/model' import { isAdministrator, UserRole } from '../../shared/model'
import { prependBaseUrl } from '../api' import { prependBaseUrl } from '../api'
import { useCurrentUser } from '../hooks/useCurrentUser' import { useCurrentUser } from '../hooks/useCurrentUser'
@ -9,7 +9,7 @@ const ROLE_LABEL: Record<UserRole, string> = {
['student']: 'Studente', ['student']: 'Studente',
} }
export const Header = ({}) => { export const Header = ({ }) => {
const [user] = useCurrentUser() const [user] = useCurrentUser()
return ( return (
@ -18,34 +18,37 @@ export const Header = ({}) => {
<a href={prependBaseUrl('/')}>PHC / Problemi</a> <a href={prependBaseUrl('/')}>PHC / Problemi</a>
</div> </div>
<nav> <nav>
<div class="nav-item"> <div class="nav-left">
<Link activeClassName="active" href={prependBaseUrl('/scores')}> <div class="nav-item">
Classifica <Link activeClassName="active" href={prependBaseUrl('/scores')}>
</Link> Classifica
</Link>
</div>
</div> </div>
{user ? ( <div class="nav-right">
<> {user ? (
{isAdministrator(user.role) && ( <>
{isAdministrator(user.role) && (
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/admin')}>
Pannello Admin
</Link>
</div>
)}
<div class="nav-item"> <div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/admin')}> <Link activeClassName="active" href={prependBaseUrl('/profile')}>
Pannello Admin @{user.id}
</Link> </Link>
</div> </div>
)} </>
) : (
<div class="nav-item"> <div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/profile')}> <Link activeClassName="active" href={prependBaseUrl('/login')}>
@{user.id} Login
{isAdministrator(user.role) && <> ({ROLE_LABEL[user.role]})</>}
</Link> </Link>
</div> </div>
</> )}
) : ( </div>
<div class="nav-item">
<Link activeClassName="active" href={prependBaseUrl('/login')}>
Login
</Link>
</div>
)}
</nav> </nav>
</header> </header>
) )

56
client/styles/main.scss
Unescape Escape View File

@ -223,7 +223,7 @@ p {
margin: 0; margin: 0;
} }
p + p { p+p {
margin-top: 0.5rem; margin-top: 0.5rem;
} }
@ -318,6 +318,7 @@ main {
grid-template-columns: auto auto; grid-template-columns: auto auto;
gap: 1rem; gap: 1rem;
} }
.info-box { .info-box {
padding: 1rem; padding: 1rem;
font-size: 28px; font-size: 28px;
@ -415,12 +416,15 @@ main.page-scores {
&:first-child { &:first-child {
border-top-left-radius: 0.5rem; border-top-left-radius: 0.5rem;
} }
&:nth-child(3) { &:nth-child(3) {
border-top-right-radius: 0.5rem; border-top-right-radius: 0.5rem;
} }
&:nth-last-child(3) { &:nth-last-child(3) {
border-bottom-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem;
} }
&:last-child { &:last-child {
border-bottom-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem;
} }
@ -445,6 +449,7 @@ main.page-scores {
&:nth-child(3n + 1) { &:nth-child(3n + 1) {
text-align: left; text-align: left;
} }
&:nth-child(3n + 2), &:nth-child(3n + 2),
&:nth-child(3n + 3) { &:nth-child(3n + 3) {
text-align: center; text-align: center;
@ -471,10 +476,11 @@ main.page-scores {
} }
&:hover { &:hover {
&:nth-child(3n + 1) + .cell + .cell::after { &:nth-child(3n + 1)+.cell+.cell::after {
background: #00000006; background: #00000006;
} }
&:nth-child(3n + 2) + .cell::after {
&:nth-child(3n + 2)+.cell::after {
background: #00000006; background: #00000006;
} }
} }
@ -535,13 +541,26 @@ header {
nav { nav {
position: absolute; position: absolute;
right: 2rem; width: 100%;
height: 100%;
display: flex; .nav-left {
gap: 1rem; gap: 1rem;
display: flex;
height: 100%;
align-items: center;
position: absolute;
left: 2rem;
}
height: 100%; .nav-right {
align-items: center; gap: 1rem;
display: flex;
height: 100%;
align-items: center;
position: absolute;
right: 2rem;
}
.nav-item { .nav-item {
font-size: 20px; font-size: 20px;
@ -778,7 +797,8 @@ header {
} }
// On mobile // On mobile
@media screen and (max-width: $device-s-width), (pointer: coarse) { @media screen and (max-width: $device-s-width),
(pointer: coarse) {
main { main {
padding: 2rem 1rem 6rem; padding: 2rem 1rem 6rem;
@ -799,12 +819,21 @@ header {
nav { nav {
position: relative; position: relative;
right: unset;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
gap: 1rem;
.nav-left, .nav-right {
left: unset;
right: unset;
position: relative;
flex-direction: column;
}
} }
} }
.problem { .problem {
@ -845,7 +874,8 @@ header {
} }
} }
@media screen and (max-width: $device-m-width), (pointer: coarse) { @media screen and (max-width: $device-m-width),
(pointer: coarse) {
.markdown-editor { .markdown-editor {
grid-template-columns: auto; grid-template-columns: auto;
grid-template-rows: auto auto; grid-template-rows: auto auto;
@ -855,4 +885,4 @@ header {
justify-self: center; justify-self: center;
} }
} }
} }
Write Preview
Loading…
Cancel
Save