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

fix: table style and empty scoreboard page

Browse Source
pull/1/head
Antonio De Lucreziis 2 years ago
parent 515280621d
commit 0955f18e04
2 changed files with 53 additions and 46 deletions
Show Stats Download Patch File Download Diff File

94
client/pages/ScoresPage.tsx
Unescape Escape View File

@ -50,55 +50,61 @@ export const ScoresPage = () => {
<Header /> <Header />
<main class="page-scores"> <main class="page-scores">
<div class="subtitle">Classifica</div> <div class="subtitle">Classifica</div>
<div class="scrollable"> {orderedStats.length > 0 ? (
<div class="table"> <div class="scrollable">
<div class="cell header"> <div class="table">
<span>Studente</span> <div class="cell header">
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('student'))}> <span>Studente</span>
<span class="material-symbols-outlined icon"> <span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('student'))}>
{sortStateColumn === 'student' <span class="material-symbols-outlined icon">
? sortStateOrder === 'ascending' {sortStateColumn === 'student'
? 'expand_more' ? sortStateOrder === 'ascending'
: 'expand_less' ? 'expand_more'
: 'unfold_more'} : 'expand_less'
: 'unfold_more'}
</span>
</span> </span>
</span> </div>
</div> <div class="cell header">
<div class="cell header"> <span>Soluzioni Inviate</span>
<span>Soluzioni Inviate</span> <span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('sent'))}>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('sent'))}> <span class="material-symbols-outlined icon">
<span class="material-symbols-outlined icon"> {sortStateColumn === 'sent'
{sortStateColumn === 'sent' ? sortStateOrder === 'ascending'
? sortStateOrder === 'ascending' ? 'expand_more'
? 'expand_more' : 'expand_less'
: 'expand_less' : 'unfold_more'}
: 'unfold_more'} </span>
</span> </span>
</span> </div>
</div> <div class="cell header">
<div class="cell header"> <span>Soluzioni Corrette</span>
<span>Soluzioni Corrette</span> <span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('correct'))}>
<span onClick={() => setSortState(transitionMap[sortStateColumn][sortStateOrder]('correct'))}> <span class="material-symbols-outlined icon">
<span class="material-symbols-outlined icon"> {sortStateColumn === 'correct'
{sortStateColumn === 'correct' ? sortStateOrder === 'ascending'
? sortStateOrder === 'ascending' ? 'expand_more'
? 'expand_more' : 'expand_less'
: 'expand_less' : 'unfold_more'}
: 'unfold_more'} </span>
</span> </span>
</span> </div>
{orderedStats.map(([user, s]) => (
<>
<div class="cell">
<a href={prependBaseUrl(`/u/${user}`)}>@{user}</a>
</div>
<div class="cell">{s.sentSolutionsCount}</div>
<div class="cell last-col">{s.correctSolutionsCount}</div>
</>
))}
</div> </div>
{orderedStats.map(([user, s]) => (
<>
<div class="cell">
<a href={prependBaseUrl(`/u/${user}`)}>@{user}</a>
</div>
<div class="cell">{s.sentSolutionsCount}</div>
<div class="cell last-col">{s.correctSolutionsCount}</div>
</>
))}
</div> </div>
</div> ) : (
<>
<p>Nessuno ha ancora inviato soluzioni</p>
</>
)}
</main> </main>
</> </>
) )

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

@ -290,7 +290,6 @@ $heading-scale: 1.25;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
} }
} }
.text-body { .text-body {
@ -479,9 +478,11 @@ main.page-scores {
&:first-child { &:first-child {
border-top-left-radius: 0.5rem; border-top-left-radius: 0.5rem;
} }
&:last-child { &:last-child {
border-top-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem;
} }
&.last-col { &.last-col {
border-right: none; border-right: none;
} }

Write Preview
Loading…
Cancel
Save