Main Menu UI Overhaul (#2829)

## Description:

Overhauls the Main Menu UI, visit https://menu.openfront.dev to see
everything.

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

## Please put your Discord username so you can be contacted if a bug or
regression is found:

w.o.n

src/client/components/baseComponents/Button.ts

@@ -11,6 +11,7 @@ export class OButton extends LitElement {
   @property({ type: Boolean }) block = false;
   @property({ type: Boolean }) blockDesktop = false;
   @property({ type: Boolean }) disable = false;
+  @property({ type: Boolean }) fill = false;
 
   createRenderRoot() {
     return this;
@@ -20,11 +21,18 @@ export class OButton extends LitElement {
     return html`
       <button
         class=${classMap({
-          "c-button": true,
-          "c-button--block": this.block,
-          "c-button--blockDesktop": this.blockDesktop,
-          "c-button--secondary": this.secondary,
-          "c-button--disabled": this.disable,
+          "bg-blue-600 hover:bg-blue-700 text-white font-bold uppercase tracking-wider px-4 py-3 rounded-xl transition-all duration-300 transform hover:-translate-y-px outline-none border border-transparent text-center text-base lg:text-lg":
+            true,
+          "dark:bg-blue-500 dark:hover:bg-blue-600": true,
+          "w-full block": this.block,
+          "h-full w-full flex items-center justify-center": this.fill,
+          "lg:w-auto lg:inline-block":
+            !this.block && !this.blockDesktop && !this.fill,
+          "lg:w-1/2 lg:mx-auto lg:block": this.blockDesktop,
+          "bg-blue-100 text-gray-900 hover:bg-blue-200 dark:bg-gray-700 dark:text-gray-100 dark:hover:bg-gray-600":
+            this.secondary,
+          "disabled:opacity-70 disabled:cursor-not-allowed disabled:transform-none disabled:bg-gray-600 dark:disabled:bg-gray-600":
+            this.disable,
         })}
         ?disabled=${this.disable}
       >