forked from andyburke/autonomous.contact
fix: fix label styling
fix: handle primary color not being there
This commit is contained in:
parent
f03ca66a07
commit
e1bb07a138
3 changed files with 9 additions and 9 deletions
|
|
@ -216,7 +216,7 @@ form div {
|
|||
margin-bottom: 1.5em;
|
||||
}
|
||||
|
||||
form label {
|
||||
form label.placeholder {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
font-size: large;
|
||||
|
|
@ -230,8 +230,8 @@ form label {
|
|||
font-size 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
form input:focus ~ label,
|
||||
form input:valid ~ label {
|
||||
form input:focus ~ label.placeholder,
|
||||
form input:valid ~ label.placeholder {
|
||||
top: -1.6rem;
|
||||
font-size: small;
|
||||
border: 1px solid rgba(128, 128, 128, 0.2);
|
||||
|
|
|
|||
|
|
@ -199,7 +199,7 @@
|
|||
user_bound_element[target] = value ?? default_value;
|
||||
}
|
||||
|
||||
const primary_color_setting = user.meta.primary_color;
|
||||
const primary_color_setting = user?.meta?.primary_color;
|
||||
if (primary_color_setting) {
|
||||
const root = document.querySelector(":root");
|
||||
root.style.setProperty("--base-color", primary_color_setting);
|
||||
|
|
@ -376,7 +376,7 @@
|
|||
data-user-field-target="value"
|
||||
data-user-field-default=""
|
||||
/>
|
||||
<label for="user-color-setting-primary">Primary Color</label>
|
||||
<label class="placeholder" for="user-color-setting-primary">Primary Color</label>
|
||||
</div>
|
||||
</details>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -67,11 +67,11 @@
|
|||
</script>
|
||||
<div>
|
||||
<input id="login-username" type="text" name="username" required />
|
||||
<label for="login-username">username</label>
|
||||
<label class="placeholder" for="login-username">username</label>
|
||||
</div>
|
||||
<div>
|
||||
<input id="login-password" type="password" name="password" required />
|
||||
<label for="login-password">password</label>
|
||||
<label class="placeholder" for="login-password">password</label>
|
||||
</div>
|
||||
<div>
|
||||
<button id="login-submit" type="submit" class="primary">Log In</button>
|
||||
|
|
@ -107,11 +107,11 @@
|
|||
</script>
|
||||
<div>
|
||||
<input id="signup-username" type="text" name="username" required />
|
||||
<label for="signup-username">username</label>
|
||||
<label class="placeholder" for="signup-username">username</label>
|
||||
</div>
|
||||
<div>
|
||||
<input id="signup-password" type="password" name="password" required />
|
||||
<label for="signup-password">password</label>
|
||||
<label class="placeholder" for="signup-password">password</label>
|
||||
</div>
|
||||
<button id="signup-submit" type="submit" class="primary">Sign Up</button>
|
||||
</form>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue