Fix minor errors in HTML and CSS

This commit is contained in:
Florine W. Dekker 2022-11-26 15:10:10 +01:00
parent 69972cd3f1
commit d20147101c
Signed by: FWDekker
GPG Key ID: D3DCFAA8A4560BE0
6 changed files with 34 additions and 26 deletions

View File

@ -1,7 +1,7 @@
{
"name": "fwdekker/death-notifier",
"description": "Get notified when a famous person dies.",
"version": "0.14.5", "_comment_version": "Also update version in `package.json`!",
"version": "0.14.7", "_comment_version": "Also update version in `package.json`!",
"type": "project",
"license": "MIT",
"homepage": "https://git.fwdekker.com/tools/death-notifier",

BIN
composer.lock generated

Binary file not shown.

BIN
package-lock.json generated

Binary file not shown.

View File

@ -1,6 +1,6 @@
{
"name": "death-notifier",
"version": "0.14.6", "_comment_version": "Also update version in `composer.json`!",
"version": "0.14.7", "_comment_version": "Also update version in `composer.json`!",
"description": "Get notified when a famous person dies.",
"author": "Florine W. Dekker",
"browser": "dist/bundle.js",
@ -27,8 +27,8 @@
"grunt-text-replace": "^0.4.0",
"grunt-webpack": "^5.0.0",
"ts-loader": "^9.4.1",
"typescript": "^4.8.4",
"typescript": "^4.9.3",
"webpack": "^5.75.0",
"webpack-cli": "^4.10.0"
"webpack-cli": "^5.0.0"
}
}

View File

@ -9,15 +9,17 @@ a.red-link {
color: var(--fandom-redlink);
}
.flex-columns {
display: flex;
align-items: flex-start;
/*noinspection CssUnresolvedCustomProperty*/
grid-column-gap: calc(var(--block-spacing-horizontal) * 3);
/* Messages */
#global-message,
#shared-status-card {
margin-bottom: 0;
}
.flex-columns > * {
flex: 1;
/* Welcome */
#welcome-part {
align-items: start;
}
@ -32,12 +34,14 @@ a.red-link {
#trackings-wrapper {
max-height: 54rem;
/*noinspection CssUnresolvedCustomProperty*/
margin-bottom: var(--typography-spacing-vertical);
border-bottom: .1rem solid #e1e1e1;
overflow-y: scroll;
/* Shows scrolling shadows. Adapted from https://css-tricks.com/books/greatest-css-tricks/scroll-shadows/ */
/*noinspection CssUnresolvedCustomProperty*/
background: linear-gradient(white 30%, rgba(255, 255, 255, 0)) no-repeat local center calc(var(--spacing) + 1.6em),
linear-gradient(rgba(255, 255, 255, 0), white 70%) no-repeat local center bottom,
radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0)) no-repeat scroll center calc(var(--spacing) + 1.6em),

View File

@ -12,7 +12,7 @@
<meta name="fwd:nav:highlight-path" content="/Tools/Death-Notifier/" />
<meta name="fwd:footer:target" content="#footer" />
<meta name="fwd:footer:vcs-url" content="https://git.fwdekker.com/tools/death-notifier/" />
<meta name="fwd:footer:version" content="%%VERSION_NUMBER%%" />
<meta name="fwd:footer:version" content="v%%VERSION_NUMBER%%" />
<meta name="fwd:validation:load-forms" />
<title>Death Notifier | FWDekker</title>
@ -46,7 +46,6 @@
<article id="global-message" class="status-card hidden">
<output></output>
<a class="close" href="#" aria-label="Close"></a>
</article>
<article id="shared-status-card" class="status-card hidden">
<output></output>
@ -56,7 +55,7 @@
<a href="./">Click here to return to the main page</a>
</p>
<div id="welcome-part" class="flex-columns">
<div id="welcome-part" class="grid">
<article>
<header>
<hgroup>
@ -73,11 +72,12 @@
<fieldset>
<label for="login-email">Email</label>
<input id="login-email" type="email" name="email" autocomplete="on" />
<input id="login-email" type="email" name="email" autocomplete="email" />
<small id="login-email-hint" data-hint-for="login-email"></small>
<label for="login-password">Password</label>
<input id="login-password" type="password" name="password" />
<input id="login-password" type="password" name="password"
autocomplete="current-password" />
<small id="login-password-hint" data-hint-for="login-password"></small>
<input type="checkbox" role="switch" id="login-password-toggle" class="password-toggle"
@ -117,11 +117,12 @@
<fieldset>
<label for="register-email">Email</label>
<input id="register-email" type="email" name="email" autocomplete="on" />
<input id="register-email" type="email" name="email" autocomplete="email" />
<small id="register-email-hint" data-hint-for="register-email"></small>
<label for="register-password">Password</label>
<input id="register-password" type="password" name="password" />
<input id="register-password" type="password" name="password"
autocomplete="new-password" />
<small id="register-password-hint" data-hint-for="register-password"
data-hint="Use at least 8 characters."></small>
@ -138,7 +139,7 @@
</div>
</article>
</div>
<div id="send-forgot-password-part" class="flex-columns hidden">
<div id="send-forgot-password-part" class="grid hidden">
<article>
<header>
<hgroup>
@ -155,7 +156,7 @@
<fieldset>
<label for="send-password-reset-email">Email</label>
<input id="send-password-reset-email" type="email" name="email" autocomplete="on" />
<input id="send-password-reset-email" type="email" name="email" autocomplete="email" />
<small id="send-password-reset-email-hint"
data-hint-for="send-password-reset-email"></small>
</fieldset>
@ -169,7 +170,7 @@
</article>
<div></div>
</div>
<div id="reset-password-part" class="flex-columns hidden">
<div id="reset-password-part" class="grid hidden">
<article>
<header>
<hgroup>
@ -192,7 +193,8 @@
<small id="reset-password-email-hint" data-hint-for="reset-password-email"></small>
<label for="reset-password-password">Password</label>
<input id="reset-password-password" type="password" name="password" />
<input id="reset-password-password" type="password" name="password"
autocomplete="new-password" />
<small id="reset-password-password-hint" data-hint-for="reset-password-password"
data-hint="Use at least 8 characters."></small>
@ -246,7 +248,7 @@
<fieldset>
<!-- TODO: Show random suggestions on who to track -->
<label for="add-tracking-name">Track another article</label>
<input id="add-tracking-name" type="text" name="person_name" autocomplete="on" />
<input id="add-tracking-name" type="text" name="person_name" autocomplete="name" />
<small id="add-tracking-name-hint" data-hint-for="add-tracking-name"></small>
<button id="add-tracking-submit">Add</button>
@ -291,7 +293,7 @@
<fieldset>
<label for="update-email-email">Email address</label>
<input id="update-email-email" type="email" name="email" autocomplete="on" />
<input id="update-email-email" type="email" name="email" autocomplete="email" />
<small id="update-email-email-hint" data-hint-for="update-email-email"></small>
<button id="updateEmailButton">Change email</button>
@ -338,7 +340,8 @@
<fieldset>
<label for="update-password-password-old">Old password</label>
<input id="update-password-password-old" type="password" name="password" />
<input id="update-password-password-old" type="password" name="password"
autocomplete="current-password" />
<small id="update-password-password-old-hint"
data-hint-for="update-password-password-old"></small>
@ -350,7 +353,8 @@
<fieldset>
<label for="update-password-password-new">New password</label>
<input id="update-password-password-new" type="password" name="password" />
<input id="update-password-password-new" type="password" name="password"
autocomplete="new-password" />
<small id="update-password-password-new-hint" data-hint-for="update-password-password-new"
data-hint="Use at least 8 characters."></small>