Make remember checkboxes more subtle and checked by default
- Remember checkboxes now default to checked for better user experience - Reduced visual prominence with smaller size, lighter colors, and lower opacity - Users get convenience by default while still being able to opt out 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -20,13 +20,9 @@ pub fn Login(props: &LoginProps) -> Html {
|
||||
let error_message = use_state(|| Option::<String>::None);
|
||||
let is_loading = use_state(|| false);
|
||||
|
||||
// Remember checkboxes state
|
||||
let remember_server = use_state(|| {
|
||||
LocalStorage::get::<String>("remembered_server_url").is_ok()
|
||||
});
|
||||
let remember_username = use_state(|| {
|
||||
LocalStorage::get::<String>("remembered_username").is_ok()
|
||||
});
|
||||
// Remember checkboxes state - default to checked
|
||||
let remember_server = use_state(|| true);
|
||||
let remember_username = use_state(|| true);
|
||||
|
||||
let server_url_ref = use_node_ref();
|
||||
let username_ref = use_node_ref();
|
||||
|
||||
@@ -292,22 +292,25 @@ body {
|
||||
.remember-checkbox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-top: 0.5rem;
|
||||
gap: 0.375rem;
|
||||
margin-top: 0.375rem;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.remember-checkbox input[type="checkbox"] {
|
||||
width: auto;
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
transform: scale(0.85);
|
||||
}
|
||||
|
||||
.remember-checkbox label {
|
||||
margin: 0;
|
||||
font-size: 0.875rem;
|
||||
color: #666;
|
||||
font-size: 0.75rem;
|
||||
color: #888;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.login-button, .register-button {
|
||||
|
||||
Reference in New Issue
Block a user