sky form inputs: form-control look (gold border, pill, page-bg fill, focus glow); login email label matches sky-field label style
.sky-field input now mirrors .form-control's priUser fill / secUser border & text / pill border-radius / terUser focus glow — same look as the login email input. Readonly inputs (lat/lon) keep opacity:0.6. .input-group label (the "enter email for login" line above the email input) now adopts .sky-field label styling: 0.6rem uppercase, 0.1em letter-spacing, quaUser at 0.8 — so the login form's label/input pair reads as the same component as the sky-field rows. Code architected by Disco DeDisco <discodedisco@outlook.com> Git commit message Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -89,9 +89,17 @@ body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
gap: 0.25rem;
|
||||
z-index: 50;
|
||||
|
||||
// Match .sky-field label — small, gold, uppercase, tracked.
|
||||
label {
|
||||
font-size: 0.6rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.1em;
|
||||
color: rgba(var(--quaUser), 0.8);
|
||||
}
|
||||
|
||||
.form-control {
|
||||
width: 24rem;
|
||||
text-align: center;
|
||||
|
||||
@@ -191,9 +191,28 @@ html.sky-open .sky-modal-wrap {
|
||||
color: rgba(var(--quaUser), 0.8);
|
||||
}
|
||||
|
||||
// Match the .form-control look used by the login email input —
|
||||
// priUser fill, secUser gold border + text, pill rounding, terUser focus glow.
|
||||
input {
|
||||
width: 100%;
|
||||
// inherits global input styles
|
||||
background-color: rgba(var(--priUser), 1);
|
||||
color: rgba(var(--secUser), 1);
|
||||
border: 0.1rem solid rgba(var(--secUser), 0.5);
|
||||
--_pad-v: 0.5rem;
|
||||
padding: var(--_pad-v) 0.75rem;
|
||||
border-radius: calc((var(--_pad-v) * 2 + 1em) / 3);
|
||||
font-family: inherit;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
border-color: rgba(var(--terUser), 0.75);
|
||||
box-shadow: 0 0 0.75rem rgba(var(--terUser), 0.5);
|
||||
}
|
||||
|
||||
&[readonly] {
|
||||
opacity: 0.6;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
|
||||
small {
|
||||
|
||||
Reference in New Issue
Block a user