Add "1-0" style score notation to the round page

See #84
johnridesabike · Dec 31, 2023 · 77207ac · 77207ac
1 parent 7e468bd
commit 77207ac
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,7 @@
 ## Latest
 
 - Enable sorting on more player lists.
+- Add "1-0" style score notation to the tournament round page.
 
 ## 2023-03-22
 

diff --git a/src/PageTournament/PageRound.res b/src/PageTournament/PageRound.res
@@ -194,6 +194,19 @@ module MatchRow = {
           {blackPlayer->Player.fullName->React.string}
         </td>
       </Utils.TestId>
+      <td className="pageround__matchresult__score monospace">
+        {Scoring.Score.fromResultWhite(m.result)
+        ->Scoring.Score.toFloat
+        ->Numeral.make
+        ->Numeral.format("1/2")
+        ->React.string}
+        {"-"->React.string}
+        {Scoring.Score.fromResultBlack(m.result)
+        ->Scoring.Score.toFloat
+        ->Numeral.make
+        ->Numeral.format("1/2")
+        ->React.string}
+      </td>
       <td className={"pageround__matchresult data__input row__controls"}>
         <Utils.TestId testId={`match-${Int.toString(pos)}-select`}>
           <select
@@ -319,7 +332,7 @@ module RoundTable = {
             {React.string("Round ")}
             {React.int(roundId + 1)}
           </caption>
-          <thead>
+          <thead className="pageround__table-head">
             <tr>
               <th className="pageround__row-id" scope="col"> {React.string("#")} </th>
               <th scope="col">
@@ -334,7 +347,9 @@ module RoundTable = {
                 </Externals.VisuallyHidden>
               </th>
               <th className="row__player" scope="col"> {React.string("Black")} </th>
-              <th className="row__result" scope="col"> {React.string("Match result")} </th>
+              <th className="row__result" scope="col" colSpan=2>
+                {React.string("Match result")}
+              </th>
               {if isCompact {
                 React.null
               } else {
@@ -358,7 +373,7 @@ module RoundTable = {
             setSelectedMatch
             scoreData
             tournament
-            className="pageround__td"
+            className="pageround__tr"
             avoidPairs
           />
         )->React.array}

diff --git a/src/style.css b/src/style.css
@@ -895,7 +895,11 @@ li.player.missing {
   border-color: var(--grey-40);
 }
 
-.pageround__td {
+.pageround__table-head {
+  text-align: left;
+}
+
+.pageround__tr {
   padding: 8px 4px;
 }