more consistent theming

tank-frontend/src/components/Button.css

@@ -1,7 +1,14 @@
 .Button {
-    border: solid 1px green;
-    border-radius: 12px;
+    border: solid 4px green;
+    padding: 8px;
 
     color: green;
     background: transparent;
 }
+
+.Button:hover, .Button:active {
+    background-color: green;
+    color: black;
+    cursor: pointer;
+}
+

tank-frontend/src/components/Button.tsx

@@ -1,14 +1,16 @@
 import './Button.css';
 import {MouseEventHandler} from "react";
 
-export default function Button({text, onClick, className}: {
+export default function Button({text, onClick, className, disabled}: {
     text: string,
     onClick?: MouseEventHandler<HTMLButtonElement>,
-    className?: string
+    className?: string,
+    disabled?: boolean
 }) {
     return <button
         className={'Button ' + (className ?? '')}
         onClick={onClick}
+        disabled={disabled ?? false}
     >
         {text}
     </button>

tank-frontend/src/components/TextInput.css

@@ -0,0 +1,3 @@
+.TextInput {
+    padding: 8px;
+}

tank-frontend/src/components/TextInput.tsx

@@ -0,0 +1,21 @@
+import {ChangeEventHandler} from "react";
+import './TextInput.css';
+
+export default function TextInput(props: {
+    onChange?: ChangeEventHandler<HTMLInputElement> | undefined;
+    className?: string;
+    value: string;
+    placeholder: string;
+    onEnter?: () => void;
+}) {
+    return <input
+        {...props}
+        type="text"
+        className={'TextInput ' + (props.className?? '')}
+
+        onKeyUp={event => {
+            if (props.onEnter && event.key === 'Enter')
+                props.onEnter();
+        }}
+    />;
+}