Compare commits
1 Commits
2
...
a6711b3e47
| Author | SHA1 | Date | |
|---|---|---|---|
a6711b3e47
|
@@ -8,7 +8,8 @@ input[type="range"] {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
input[type="range"]::-moz-range-thumb, input[type="range"]::-webkit-slider-thumb {
|
||||
input[type="range"]::-moz-range-thumb,
|
||||
input[type="range"]::-webkit-slider-thumb {
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
background: var(--color-gray-400);
|
||||
@@ -23,10 +24,13 @@ input[type="range"]::-webkit-slider-thumb {
|
||||
top: -9px;
|
||||
}
|
||||
|
||||
input[type="range"]::-moz-range-track, input[type="range"]::-webkit-slider-runnable-track {
|
||||
input[type="range"]::-moz-range-track,
|
||||
input[type="range"]::-webkit-slider-runnable-track {
|
||||
background: var(--color-gray-800-muted);
|
||||
height: 0.5rem;
|
||||
filter: drop-shadow(0 calc(0px - var(--spacing)) 0 var(--color-gray-900-muted));
|
||||
filter: drop-shadow(
|
||||
0 calc(0px - var(--spacing)) 0 var(--color-gray-900-muted)
|
||||
);
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,9 +1,7 @@
|
||||
select {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath fill='%239ca3af' d='M300.3 440.8C312.9 451 331.4 450.3 343.1 438.6L471.1 310.6C480.3 301.4 483 287.7 478 275.7C473 263.7 461.4 256 448.5 256L192.5 256C179.6 256 167.9 263.8 162.9 275.8C157.9 287.8 160.7 301.5 169.9 310.6L297.9 438.6L300.3 440.8z'/%3E%3C/svg%3E");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 2rem;
|
||||
background-position: right .5rem center;
|
||||
background-position: right 0.5rem center;
|
||||
}
|
||||
|
||||
@@ -16,7 +16,9 @@ pub(crate) fn Input(
|
||||
rsx! {
|
||||
input {
|
||||
class: format!(
|
||||
"pt-3 pb-2.25 {} bg-gray-800-muted enabled:hover:bg-gray-800 enabled:focus:bg-gray-800 drop-shadow-[0_calc(0px_-_var(--spacing))_0_var(--color-gray-900-muted)] rounded-xl outline-0 {} transition-all duration-150 {}",
|
||||
/* `w-full` is required for the Chromium renderer to allow the input to shrink
|
||||
properly. */
|
||||
"pt-3 pb-2.25 w-full {} bg-gray-800-muted enabled:hover:bg-gray-800 enabled:focus:bg-gray-800 drop-shadow-[0_calc(0px_-_var(--spacing))_0_var(--color-gray-900-muted)] rounded-xl outline-0 {} transition-all duration-150 {}",
|
||||
match r#type.as_str() {
|
||||
"date" => "ps-3.25 pe-3",
|
||||
_ => "px-4"
|
||||
@@ -30,7 +32,6 @@ pub(crate) fn Input(
|
||||
name: name.clone(),
|
||||
r#type,
|
||||
id: id.unwrap_or(format!("input_{}", name)),
|
||||
autofocus,
|
||||
oninput: move |event| {
|
||||
if let Some(oninput) = oninput {
|
||||
oninput.call(event);
|
||||
@@ -41,6 +42,11 @@ pub(crate) fn Input(
|
||||
onchange.call(event);
|
||||
}
|
||||
},
|
||||
onmounted: move |element| async move {
|
||||
if let Some(true) = autofocus {
|
||||
let _ = element.set_focus(true).await;
|
||||
}
|
||||
},
|
||||
..attributes
|
||||
}
|
||||
}
|
||||
|
||||
@@ -64,9 +64,6 @@ pub(crate) fn ProjectForm() -> Element {
|
||||
if let Some(project) = project {
|
||||
let result = delete_project(project.id).await;
|
||||
if result.is_ok() {
|
||||
/* TODO: Might not work on mobile due to
|
||||
https://dioxuslabs.com/learn/0.7/essentials/router/navigation#history-buttons.
|
||||
*/
|
||||
navigator.go_back();
|
||||
}
|
||||
} else {
|
||||
|
||||
@@ -10,7 +10,7 @@ pub(crate) fn ProjectSelect(initial_selected_id: Option<i32>) -> Element {
|
||||
rsx! {
|
||||
select {
|
||||
name: "project_id",
|
||||
class: "px-4 pt-3 pb-2.25 bg-gray-800-muted enabled:hover:bg-gray-800 enabled:active:bg-gray-800 drop-shadow-[0_calc(0px_-_var(--spacing))_0_var(--color-gray-900-muted)] rounded-xl grow cursor-pointer",
|
||||
class: "px-4 pt-3 pb-2.25 bg-gray-800-muted enabled:hover:bg-gray-800 enabled:active:bg-gray-800 drop-shadow-[0_calc(0px_-_var(--spacing))_0_var(--color-gray-900-muted)] rounded-xl grow cursor-pointer transition-all duration-150",
|
||||
id: "input_project_id",
|
||||
option {
|
||||
value: 0,
|
||||
|
||||
@@ -11,7 +11,6 @@ pub(crate) fn ReoccurrenceIntervalInput(
|
||||
class_buttons: Option<&'static str>,
|
||||
) -> Element {
|
||||
rsx! {
|
||||
// TODO: Abstract into SelectButton. Make it sank into the surface by default, like other inputs (abstract those too haha), and rise it up on selection (rationale: it will influence what is on the surface).
|
||||
SelectButton {
|
||||
icon: FaBan,
|
||||
is_selected: reoccurrence_interval().is_none(),
|
||||
|
||||
@@ -172,7 +172,7 @@ pub(crate) fn TaskForm() -> Element {
|
||||
required: true,
|
||||
initial_value: task.as_ref().map(|task| task.title.clone()),
|
||||
r#type: "text",
|
||||
autofocus: true
|
||||
autofocus: task.is_none()
|
||||
}
|
||||
},
|
||||
div {
|
||||
@@ -246,16 +246,16 @@ pub(crate) fn TaskForm() -> Element {
|
||||
r#for: "input_category_calendar_date"
|
||||
},
|
||||
div {
|
||||
class: "grow flex flex-row gap-3",
|
||||
class: "grow grid grid-cols-7 gap-3",
|
||||
Input {
|
||||
class: "grow",
|
||||
class: "grow col-span-4",
|
||||
name: "category_calendar_date",
|
||||
r#type: "date",
|
||||
required: true,
|
||||
initial_value: date.format("%Y-%m-%d").to_string(),
|
||||
},
|
||||
Input {
|
||||
class: "grow",
|
||||
class: "grow col-span-3",
|
||||
name: "category_calendar_time",
|
||||
r#type: "time",
|
||||
initial_value: time.map(|calendar_time|
|
||||
@@ -367,9 +367,6 @@ pub(crate) fn TaskForm() -> Element {
|
||||
edit_task(task.id, new_task).await.map(|_| ())
|
||||
};
|
||||
if result.is_ok() {
|
||||
/* TODO: Might not work on mobile due to
|
||||
https://dioxuslabs.com/learn/0.7/essentials/router/navigation#history-buttons.
|
||||
*/
|
||||
navigator.go_back();
|
||||
}
|
||||
} else {
|
||||
|
||||
Reference in New Issue
Block a user