Misc CSS fixes

This commit is contained in:
Evan Goode 2025-04-13 19:49:36 -04:00
parent 6231951026
commit dd346df889
4 changed files with 46 additions and 23 deletions

View File

@ -11,6 +11,10 @@
--font-family: monospace; --font-family: monospace;
} }
* {
box-sizing: border-box;
}
html, html,
body { body {
margin: 0; margin: 0;
@ -39,18 +43,22 @@ table {
border-collapse: collapse; border-collapse: collapse;
} }
td:not(:first-child) { thead {
padding-left: 0.5rem; font-weight: bold;
}
td:not(:last-child) {
padding-right: 0.5rem;
}
thead tr > td, tbody tr:not(:last-child) > td {
padding-bottom: 0.5rem;
} }
td:last-child { td:last-child {
text-align: right; text-align: right;
} }
thead {
font-weight: bold;
}
a { a {
color: var(--accent-lighter); color: var(--accent-lighter);
} }
@ -135,8 +143,22 @@ input[type="password"] {
border: var(--input-border-width) solid var(--accent); border: var(--input-border-width) solid var(--accent);
} }
input.long {
width: 22em;
}
@media (max-width: 600px) {
input[type="text"]:not([hidden]),
input[type="number"]:not([hidden]),
input[type="password"]:not([hidden]),
input.long:not([hidden]) {
display: block;
width: 100%;
}
}
input[type="number"] { input[type="number"] {
width: 3rem; width: 5rem;
} }
input[type="checkbox"]:not(:disabled), input[type="checkbox"]:not(:disabled),
@ -144,10 +166,6 @@ input[type="radio"]:not(:disabled) {
cursor: pointer; cursor: pointer;
} }
input.long {
width: 22em;
}
input[type="text"]::placeholder, input[type="text"]::placeholder,
input[type="password"]::placeholder { input[type="password"]::placeholder {
color: white; color: white;
@ -157,9 +175,8 @@ input[type="password"]::placeholder {
button, button,
input[type="submit"], input[type="submit"],
input[type="file"]::file-selector-button { input[type="file"]::file-selector-button {
margin: 0.5em 0;
font-family: var(--font-family); font-family: var(--font-family);
margin: 0.3em var(--button-shadow-size);
margin-left: var(--button-shadow-size);
background-color: var(--accent); background-color: var(--accent);
display: inline-block; display: inline-block;
color: white; color: white;
@ -173,6 +190,10 @@ input[type="file"]::file-selector-button {
0 0 0 var(--button-highlight-size) black; 0 0 0 var(--button-highlight-size) black;
} }
input[type="file"]::file-selector-button {
margin-right: 0.5em;
}
button:hover:not(:disabled), button:hover:not(:disabled),
input[type="submit"]:hover:not(:disabled), input[type="submit"]:hover:not(:disabled),
input[type="file"]::file-selector-button:hover:not(:disabled) { input[type="file"]::file-selector-button:hover:not(:disabled) {
@ -233,8 +254,8 @@ fieldset {
#content { #content {
max-width: 800px; max-width: 800px;
padding: 1em;
margin: auto; margin: auto;
padding: 1rem;
} }
pre { pre {

View File

@ -23,7 +23,7 @@
<thead> <thead>
<tr> <tr>
<td style="width: 50%">Link</td> <td style="width: 50%">Link</td>
<td>Date Generated</td> <td>Date&nbsp;Generated</td>
<td></td> <td></td>
</tr> </tr>
</thead> </thead>
@ -36,7 +36,7 @@
> >
</td> </td>
<td> <td>
{{ $invite.CreatedAt.Format "Mon Jan _2 15:04:05 MST 2006" }} {{ $invite.CreatedAt.Format "Jan _2 15:04:05 MST 2006" }}
</td> </td>
<td> <td>
<form <form
@ -91,10 +91,10 @@
<tr> <tr>
<td colspan="2">User</td> <td colspan="2">User</td>
<td>Players</td> <td>Players</td>
<td>Max # players*</td> <td>Max&nbsp;#&nbsp;players*</td>
<td>Admin</td> <td>Admin</td>
<td>Locked</td> <td>Locked</td>
<td>Delete Account</td> <td>Delete&nbsp;Account</td>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@ -122,7 +122,7 @@
<a href="{{ $.App.FrontEndURL }}/web/player/{{ $player.UUID }}">{{ $player.Name }}</a> <a href="{{ $.App.FrontEndURL }}/web/player/{{ $player.UUID }}">{{ $player.Name }}</a>
{{ end }} {{ end }}
{{ else if gt (len $user.Players) 1 }} {{ else if gt (len $user.Players) 1 }}
{{ len $user.Players }} players {{ len $user.Players }}&nbsp;players
{{ end }} {{ end }}
</td> </td>
<td> <td>

View File

@ -22,7 +22,9 @@
</head> </head>
<body> <body>
<div id="background"></div> <div id="background"></div>
<main id="content">{{ block "content" . }}{{ end }}</main> <main id="content">
{{ block "content" . }}{{ end }}
</main>
<script type="module"> <script type="module">
for (const el of document.querySelectorAll(".noscript-hidden")) { for (const el of document.querySelectorAll(".noscript-hidden")) {
el.classList.remove("noscript-hidden"); el.classList.remove("noscript-hidden");

View File

@ -45,7 +45,7 @@
<td colspan="2">Player</td> <td colspan="2">Player</td>
<td>UUID</td> <td>UUID</td>
{{ if or .App.Config.AllowAddingDeletingPlayers .User.IsAdmin }} {{ if or .App.Config.AllowAddingDeletingPlayers .User.IsAdmin }}
<td>Delete Player</td> <td>Delete&nbsp;Player</td>
{{ end }} {{ end }}
</tr> </tr>
</thead> </thead>
@ -563,7 +563,7 @@
</form> </form>
<p> <p>
<details> <details>
<summary>Delete account</summary> <summary>Delete Account</summary>
<form <form
action="{{ .App.FrontEndURL }}/web/delete-user" action="{{ .App.FrontEndURL }}/web/delete-user"
method="post" method="post"
@ -579,7 +579,7 @@
{{ .App.FrontEndURL }} {{ .App.FrontEndURL }}
{{ end }}" {{ end }}"
/> />
<input type="submit" value="Delete account" /> <input type="submit" value="Delete Account" />
</form> </form>
</details> </details>
</p> </p>