- Each player starts with a set number of dice, hidden from the other
- players.
+
+ Each player starts with a set number of dice, hidden from the other
+ players.
+
- The first player makes a bid about how many dice of a certain value are
- showing among all players, at a minimum. Ones ()
- are wild. For example, a bid of 5 is a claim
- that between all players, there are at least5{" "}
- or .
+
+ The first player makes a bid about how many dice of a certain value
+ are showing among all players, at a minimum. Ones (
+ ) are wild. For example, a bid of 5{" "}
+ is a claim that between all players, there are{" "}
+ at least5 or .
+
- The next player must either raise the bid or call .
+
+ The next player must either raise the bid or call .
+
+
+
+
+ Calling ends the round. If the bidder's claim is met, the
+ player who called loses one die. If not, then the bidder
+ loses one die. The loosing player starts the next round.
+
+
+ Raising the bid
+
- Calling ends the round. If the bidder's claim is met, the
- player who called loses one die. If not, then the bidder loses
- one die. The loosing player starts the next round.
+ The player raising must
-
Raising the bid
-
The player raising must
-
-
Increase the quantity and/or the value of the dice.
-
Not lower the quantity of dice.
+
+
+ Increase the quantity and/or the value of the dice.
+
+
+ Not lower the quantity of dice.
+
-
Valid raises
+
+ Valid raises
+
@@ -105,7 +131,9 @@ const Rules = () => {
-
Invalid raises
+
+ Invalid raises
+
@@ -118,26 +146,38 @@ const Rules = () => {
-
Bidding wilds
+
+ Bidding wilds
+
- You can also bid the total number of . When doing so,
- you can halve (rounded up) the number of dice of a non-wild bid. You can
- go back to a non-wild bid by doubling and adding one to the quantity of
- dice.
+
+ You can also bid the total number of . When doing so,
+ you can halve (rounded up) the number of dice of a non-wild bid. You
+ can go back to a non-wild bid by doubling and adding one to the
+ quantity of dice.
+
-
Valid raises
-
-
-
-
-
-
-
-
-
End of the game
+
+
+ Valid raises
+
+
+
+
+
+
+
+
+
+
+
+ End of the game
+
- Once you have lost all your dice, you are eliminated. The last player
- left wins.
+
+ Once you have lost all your dice, you are eliminated. The last player
+ left wins.
+
);
diff --git a/ui/src/hooks.ts b/ui/src/hooks.ts
new file mode 100644
index 0000000..5a59265
--- /dev/null
+++ b/ui/src/hooks.ts
@@ -0,0 +1,16 @@
+import { useEffect } from "react";
+
+export const useFonts = () => {
+ // Add the google font. This is a bit hacky but we have no other way to control the
+ // "outer" HTML.
+ useEffect(() => {
+ const parent = document.getElementsByTagName("head")[0];
+ parent.insertAdjacentHTML(
+ "beforeend",
+ `
+
+
+ `,
+ );
+ }, []);
+};
diff --git a/ui/src/index.css b/ui/src/index.css
index e7abebb..4a3e102 100644
--- a/ui/src/index.css
+++ b/ui/src/index.css
@@ -10,6 +10,12 @@ html {
@apply tracking-wide;
}
+html,
+body,
+#root {
+ @apply h-full w-full;
+}
+
:root {
--die-size: min(
/* how much horizontal space is there */ calc(50vw / var(--num-dice)),
@@ -36,7 +42,7 @@ html {
width: min(5rem, 40%);
}
-@layer components {
+@layer base {
button {
cursor: pointer;
@apply rounded-lg p-2 bg-gray-200 border-2 border-gray-500 shadow select-none;
@@ -60,3 +66,42 @@ html {
.manipulation {
touch-action: manipulation;
}
+
+.rules {
+ @apply px-2 sm:px-6 pb-12;
+ font-size: 19px;
+ font-family: sans-serif;
+
+ button {
+ font-family: "Hammersmith One", sans-serif;
+ }
+
+ h1 {
+ @apply text-3xl;
+ @apply text-blue-800;
+ @apply pt-16;
+ @apply font-semibold;
+ }
+
+ h2 {
+ @apply text-2xl;
+ @apply text-blue-900;
+ @apply pt-8;
+ @apply font-medium;
+ }
+
+ h3 {
+ @apply text-lg;
+ @apply text-blue-900;
+ @apply pt-4;
+ @apply font-medium;
+ }
+
+ p,
+ .paragraph {
+ @apply text-gray-700;
+ @apply ml-0.5;
+ @apply pt-4;
+ @apply text-justify;
+ }
+}
diff --git a/ui/src/locales/en/messages.po b/ui/src/locales/en/messages.po
index 2863af8..9fbddf0 100644
--- a/ui/src/locales/en/messages.po
+++ b/ui/src/locales/en/messages.po
@@ -140,6 +140,30 @@ msgstr "<0>You lost one die"
msgid "Bet"
msgstr "Bet"
+#: src/Rules.tsx
+msgid "Bidding wilds"
+msgstr "Bidding wilds"
+
+#: src/Rules.tsx
+msgid "Calling <0/> ends the round. If the bidder's claim is met, the player who called <1/> loses one die. If not, then the bidder loses one die. The loosing player starts the next round."
+msgstr "Calling <0/> ends the round. If the bidder's claim is met, the player who called <1/> loses one die. If not, then the bidder loses one die. The loosing player starts the next round."
+
+#: src/Rules.tsx
+msgid "Each player starts with a set number of dice, hidden from the other players."
+msgstr "Each player rolls a set number of dice, hidden from the other players."
+
+#: src/Rules.tsx
+msgid "End of the game"
+msgstr "End of the game"
+
+#: src/Rules.tsx
+msgid "Increase the quantity and/or the value of the dice."
+msgstr "Increase the quantity and/or the value of the dice."
+
+#: src/Rules.tsx
+msgid "Invalid raises"
+msgstr "Invalid raises"
+
#: src/Board.tsx
msgid "It's your turn!"
msgstr "It's your turn!"
@@ -148,14 +172,51 @@ msgstr "It's your turn!"
msgid "No wilds. Only players with 1 die left can change the value of the dice."
msgstr "No wilds. Only players with 1 die left can change the value of the dice."
+#: src/Rules.tsx
+msgid "Not lower the quantity of dice."
+msgstr "Not lower the quantity of dice."
+
+#: src/Rules.tsx
+msgid "Once you have lost all your dice, you are eliminated. The last player left wins."
+msgstr "Once you have lost all your dice, you are eliminated. The last player left wins."
+
+#: src/Rules.tsx
+msgid "Overview"
+msgstr "Overview"
+
+#: src/Rules.tsx
+msgid "Raising the bid"
+msgstr "Raising the bid"
+
#: src/Board.tsx
msgid "Roll"
msgstr "Roll"
+#: src/Rules.tsx
+msgid "Rules of Dudo"
+msgstr "Rules of Dudo"
+
+#: src/Rules.tsx
+msgid "The first player makes a bid about how many dice of a certain value are showing <0>among all players, at a minimum. Ones (<1/>) are wild. For example, a bid of <2>5 <3/> is a claim that between all players, there are <4>at least <5>5 <6/> or <7/>."
+msgstr "The first player makes a bid about how many dice of a certain value are showing <0>among all players, at a minimum. Ones (<1/>) are wild, meaining they can count as any value. For example, a bid of <2>5 <3/> is a claim that between all players, there are <4>at least <5>5 <6/> or <7/>."
+
+#: src/Rules.tsx
+msgid "The next player must either raise the bid or call <0/>."
+msgstr "The next player must either raise the bid or call <0/>."
+
+#: src/Rules.tsx
+msgid "The player raising must"
+msgstr "The player raising must"
+
#: src/Board.tsx
msgid "Total"
msgstr "Total"
+#: src/Rules.tsx
+#: src/Rules.tsx
+msgid "Valid raises"
+msgstr "Valid raises"
+
#: src/Board.tsx
msgid "Waiting for <0>{username} to roll"
msgstr "Waiting for <0>{username} to roll"
@@ -163,3 +224,7 @@ msgstr "Waiting for <0>{username} to roll"
#: src/Board.tsx
msgid "Waiting for everyone to roll..."
msgstr "Waiting for everyone to roll..."
+
+#: src/Rules.tsx
+msgid "You can also bid the total number of <0/>. When doing so, you can halve (rounded up) the number of dice of a non-wild bid. You can go back to a non-wild bid by doubling and adding one to the quantity of dice."
+msgstr "You can also bid the total number of <0/>. When doing so, you can halve (rounded up) the number of dice of a non-wild bid. You can go back to a non-wild bid by doubling and adding one to the quantity of dice."
diff --git a/ui/src/locales/fr/messages.po b/ui/src/locales/fr/messages.po
index e7ada16..8e1ef71 100644
--- a/ui/src/locales/fr/messages.po
+++ b/ui/src/locales/fr/messages.po
@@ -140,6 +140,30 @@ msgstr "<0>Vous avez perdu un dé"
msgid "Bet"
msgstr "Miser"
+#: src/Rules.tsx
+msgid "Bidding wilds"
+msgstr "Miser les frimes"
+
+#: src/Rules.tsx
+msgid "Calling <0/> ends the round. If the bidder's claim is met, the player who called <1/> loses one die. If not, then the bidder loses one die. The loosing player starts the next round."
+msgstr "Annoncer <0/> met fin à la manche. Si la mise du joueur précédent est confirmée, le joueur qui a appelé <1/> perd un dé. Sinon, c'est le joueur qui a fait une mise erronée qui perd un dé. Le joueur perdant commence le tour suivant."
+
+#: src/Rules.tsx
+msgid "Each player starts with a set number of dice, hidden from the other players."
+msgstr "Chaque joueur roule un nombre déterminé de dés, cachés des autres joueurs."
+
+#: src/Rules.tsx
+msgid "End of the game"
+msgstr "Fin de la partie"
+
+#: src/Rules.tsx
+msgid "Increase the quantity and/or the value of the dice."
+msgstr "Augmenter la quantité et/ou la valeur des dés."
+
+#: src/Rules.tsx
+msgid "Invalid raises"
+msgstr "Mises invalides"
+
#: src/Board.tsx
msgid "It's your turn!"
msgstr "C'est votre tour!"
@@ -148,14 +172,51 @@ msgstr "C'est votre tour!"
msgid "No wilds. Only players with 1 die left can change the value of the dice."
msgstr "Aucune frime. Seuls les joueurs avec 1 dé restant peuvent changer la valeur des dés."
+#: src/Rules.tsx
+msgid "Not lower the quantity of dice."
+msgstr "Ne pas réduire le nombre de dés."
+
+#: src/Rules.tsx
+msgid "Once you have lost all your dice, you are eliminated. The last player left wins."
+msgstr "Un joueur est éliminé du jeu lorsqu'il n'a plus de dés. Le gagnant est le dernier joueur restant."
+
+#: src/Rules.tsx
+msgid "Overview"
+msgstr "Aperçu"
+
+#: src/Rules.tsx
+msgid "Raising the bid"
+msgstr "Augmenter la mise"
+
#: src/Board.tsx
msgid "Roll"
msgstr "Lancer les dés"
+#: src/Rules.tsx
+msgid "Rules of Dudo"
+msgstr "Règles de Dudo"
+
+#: src/Rules.tsx
+msgid "The first player makes a bid about how many dice of a certain value are showing <0>among all players, at a minimum. Ones (<1/>) are wild. For example, a bid of <2>5 <3/> is a claim that between all players, there are <4>at least <5>5 <6/> or <7/>."
+msgstr "Le premier joueur mise sur le nombre (minimum) de dés d'une certaine valeur qui doivent être présents <0>parmi tous les joueurs. Les 1 (<1/>) sont frimés, c'est-à-dire qu'ils peuvent prendre n'importe quelle valeur. Par exemple, une mise de <2>5 <3/> signifie qu'entre tous les joueurs, il y en a <4>au moins <5>5 <6/> ou <7/>."
+
+#: src/Rules.tsx
+msgid "The next player must either raise the bid or call <0/>."
+msgstr "Le joueur suivant doit augmenter la mise ou contester la dernière mise et annoncer <0/>."
+
+#: src/Rules.tsx
+msgid "The player raising must"
+msgstr "Le joueur qui augmente la mise doit"
+
#: src/Board.tsx
msgid "Total"
msgstr "Total"
+#: src/Rules.tsx
+#: src/Rules.tsx
+msgid "Valid raises"
+msgstr "Mises valides"
+
#: src/Board.tsx
msgid "Waiting for <0>{username} to roll"
msgstr "<0>{username} doit lancer les dés"
@@ -163,3 +224,7 @@ msgstr "<0>{username} doit lancer les dés"
#: src/Board.tsx
msgid "Waiting for everyone to roll..."
msgstr "Tous les joueurs doivent lancer les dé..."
+
+#: src/Rules.tsx
+msgid "You can also bid the total number of <0/>. When doing so, you can halve (rounded up) the number of dice of a non-wild bid. You can go back to a non-wild bid by doubling and adding one to the quantity of dice."
+msgstr "Un joueur peut également miser sur le nombre total de <0/>. Ce faisant, il peut diviser par 2 (arrondi à la hausse) le nombre de dés de la mise précédente avec frimes. Vous pouvez revenir à une enchère avec frimes en doublant, plus 1, la quantité de dés."
diff --git a/ui/src/main.tsx b/ui/src/main.tsx
index c082b8b..db4d6f3 100644
--- a/ui/src/main.tsx
+++ b/ui/src/main.tsx
@@ -13,6 +13,12 @@ render({
const { default: Board } = await import("./Board");
return ;
},
+ rules: async () => {
+ // @ts-expect-error the import is there even if TS does not see it!
+ await import("./index.css");
+ const { default: Rules } = await import("./Rules");
+ return ;
+ },
gameDef: game,
matchSettings: { startNumDice: "3" },
messages: { en, fr },
diff --git a/ui/tailwind.config.cjs b/ui/tailwind.config.cjs
index 5330fc3..25fa647 100644
--- a/ui/tailwind.config.cjs
+++ b/ui/tailwind.config.cjs
@@ -4,6 +4,7 @@ const sm = "576px";
const md = "768px";
const units = {
+ 0: '0',
auto: "auto",
0.5: "0.125rem",
1: "0.25rem",