Update theme

nummi/main/static/main/css/form.css

@@ -5,10 +5,20 @@ form {
 	margin: var(--gap) 0;
 }
 
-form label,
+form > label,
-form input,
+form > input[type="text"],
-form select {
+form > input[type="number"],
-	line-height: 2em;
+form > select,
+form > textarea {
+	font-size: inherit;
+	line-height: inherit;
+	font-family: inherit;
+}
+form > input[type="text"],
+form > input[type="number"],
+form > textarea {
+	border: none;
+	border-bottom: 1px solid var(--text);
 }
 
 form > .buttons {
@@ -16,6 +26,26 @@ form > .buttons {
 	text-align: right;
 }
 form > .buttons input {
-	padding: 0 1em;
+	padding: .5em 1em;
 	margin-left: 1em;
+	font-size: inherit;
+	line-height: inherit;
+	font-family: inherit;
+	border: 0;
+	background: var(--bg);
+	cursor: pointer;
+	border-radius: 2px;
+}
+form > .buttons input:hover {
+	text-decoration: underline;
+}
+form > .buttons input[type="submit"] {
+	background: var(--green);
+}
+form > .buttons input[type="reset"] {
+	color: var(--red);
+}
+form > .buttons input.del {
+	background: var(--red);
+	color: var(--text-inv);
 }

nummi/main/static/main/css/main.css

@@ -4,27 +4,39 @@
 	box-sizing: border-box;
 }
 
-body {
-	font-family: "Inter var experimental", "Inter var", "Inter", sans-serif;
-	margin: 0;
-	padding: 2em;
-}
-
 :root {
+	--theme: #006633;
+	--theme-0: #00f279;
+	--theme-1: #00b359;
+	--theme-2: #007339;
+	--theme-3: var(--theme);
+	--theme-4: #004d26;
+
+	--text-theme: var(--text-inv);
+
 	--bg: #ffffff;
 	--text: #000000de;
 
-	--bg-inv: #800d29;
+	--bg-inv: var(--theme-4);
 	--text-inv: #ffffffde;
 
 	--bg-01: #dedede;
 
-	--text-link: #066180de;
+	--text-link: #0a35ccde;
 
 	--gap: 1em;
 
-	--red: #cc0033;
+	--red: #bf1500;
-	--green: #149dcc;
+	--green: var(--theme-2);
+}
+
+body {
+	font-family: "Inter var experimental", "Inter var", "Inter", sans-serif;
+	margin: 0;
+	padding: 2em;
+
+	background: var(--bg);
+	color: var(--text);
 }
 
 h1 {

nummi/main/static/main/css/nav.css

@@ -9,8 +9,8 @@ body {
 }
 
 nav {
-	background: var(--bg-inv);
+	background: var(--theme);
-	color: var(--text-inv);
+	color: var(--text-theme);
 	position: absolute;
 	top: 0;
 	left: 0;

nummi/main/templates/main/transaction.html

@@ -18,7 +18,7 @@
 	{{ field }}
 	{% endfor %}
 	<div class="buttons">
-		<a href="{% url 'del_transaction' transaction.id %}"><input type="button" value="Delete" /></a>
+		<a href="{% url 'del_transaction' transaction.id %}"><input type="button" value="Delete" class="del" /></a>
 		<input type="reset" />
 		<input type="submit" value="Save Transaction" />
 	</div>