Set up CSS styles around the date range picker

This commit is contained in:
Savanni D'Gerinel 2024-02-19 17:27:02 -05:00
parent d70ca08db2
commit c24a5f515f
4 changed files with 83 additions and 21 deletions

View File

@ -11,13 +11,52 @@
padding: 8px; padding: 8px;
} }
.welcome__footer {}
.historical { .historical {
margin: 32px; margin: 32px;
border-radius: 8px; border-radius: 8px;
} }
.date-range-picker {
margin-bottom: 16px;
}
/*
.date-range-picker > box:not(:last-child) {
margin-bottom: 8px;
}
*/
.date-range-picker__date-field {
margin: 8px;
font-size: x-large;
}
.date-range-picker__search-button {
margin: 8px;
font-size: x-large;
}
.date-range-picker__range-button {
margin: 8px;
font-size: x-large;
}
.date-field > label {
font-size: x-large;
}
.date-field__year {
margin: 0px 4px 0px 0px;
}
.date-field__month {
margin: 0px 4px 0px 4px;
}
.date-field__day {
margin: 0px 0px 0px 4px;
}
.day-summary { .day-summary {
padding: 8px; padding: 8px;
} }

View File

@ -113,11 +113,12 @@ glib::wrapper! {
impl DateField { impl DateField {
pub fn new(date: chrono::NaiveDate) -> Self { pub fn new(date: chrono::NaiveDate) -> Self {
let s: Self = Object::builder().build(); let s: Self = Object::builder().build();
s.add_css_class("date-field");
println!("{}", date);
s.append(&s.imp().year.widget()); s.append(&s.imp().year.widget());
s.append(&gtk::Label::new(Some("-")));
s.append(&s.imp().month.widget()); s.append(&s.imp().month.widget());
s.append(&gtk::Label::new(Some("-")));
s.append(&s.imp().day.widget()); s.append(&s.imp().day.widget());
s.set_date(date); s.set_date(date);
@ -146,7 +147,7 @@ impl DateField {
#[cfg(test)] #[cfg(test)]
mod test { mod test {
use super::*; use super::*;
use crate::gtk_init::gtk_init; // use crate::gtk_init::gtk_init;
// Enabling this test pushes tests on the TextField into an infinite loop. That likely indicates a bad interaction within the TextField itself, and that is going to need to be fixed. // Enabling this test pushes tests on the TextField into an infinite loop. That likely indicates a bad interaction within the TextField itself, and that is going to need to be fixed.
#[test] #[test]

View File

@ -14,14 +14,11 @@ General Public License for more details.
You should have received a copy of the GNU General Public License along with FitnessTrax. If not, see <https://www.gnu.org/licenses/>. You should have received a copy of the GNU General Public License along with FitnessTrax. If not, see <https://www.gnu.org/licenses/>.
*/ */
use crate::{ use crate::{components::DateField, types::DayInterval};
components::{DateField},
types::DayInterval,
};
use chrono::{Duration, Local, Months}; use chrono::{Duration, Local, Months};
use glib::Object; use glib::Object;
use gtk::{prelude::*, subclass::prelude::*}; use gtk::{prelude::*, subclass::prelude::*};
use std::{cell::RefCell}; use std::cell::RefCell;
type OnSearch = dyn Fn(DayInterval) + 'static; type OnSearch = dyn Fn(DayInterval) + 'static;
@ -40,9 +37,14 @@ impl ObjectSubclass for DateRangePickerPrivate {
fn new() -> Self { fn new() -> Self {
let default_date = Local::now().date_naive(); let default_date = Local::now().date_naive();
let start = DateField::new(default_date);
start.add_css_class("date-range-picker__date-field");
let end = DateField::new(default_date);
end.add_css_class("date-range-picker__date-field");
Self { Self {
start: DateField::new(default_date), start,
end: DateField::new(default_date), end,
on_search: RefCell::new(Box::new(|_| {})), on_search: RefCell::new(Box::new(|_| {})),
} }
} }
@ -56,7 +58,6 @@ glib::wrapper! {
pub struct DateRangePicker(ObjectSubclass<DateRangePickerPrivate>) @extends gtk::Box, gtk::Widget, @implements gtk::Orientable; pub struct DateRangePicker(ObjectSubclass<DateRangePickerPrivate>) @extends gtk::Box, gtk::Widget, @implements gtk::Orientable;
} }
impl DateRangePicker { impl DateRangePicker {
pub fn connect_on_search<OnSearch>(&self, f: OnSearch) pub fn connect_on_search<OnSearch>(&self, f: OnSearch)
where where
@ -78,19 +79,25 @@ impl DateRangePicker {
} }
} }
impl Default for DateRangePicker { impl Default for DateRangePicker {
fn default() -> Self { fn default() -> Self {
let s: Self = Object::builder().build(); let s: Self = Object::builder().build();
s.set_orientation(gtk::Orientation::Vertical); s.set_orientation(gtk::Orientation::Vertical);
s.add_css_class("date-range-picker");
let search_button = gtk::Button::with_label("Search"); let search_button = gtk::Button::builder()
.css_classes(["date-range-picker__search-button"])
.label("Search")
.build();
search_button.connect_clicked({ search_button.connect_clicked({
let s = s.clone(); let s = s.clone();
move |_| (s.imp().on_search.borrow())(s.interval()) move |_| (s.imp().on_search.borrow())(s.interval())
}); });
let last_week_button = gtk::Button::builder().label("last week").build(); let last_week_button = gtk::Button::builder()
.css_classes(["date-range-picker__range-button"])
.label("week")
.build();
last_week_button.connect_clicked({ last_week_button.connect_clicked({
let s = s.clone(); let s = s.clone();
move |_| { move |_| {
@ -101,7 +108,10 @@ impl Default for DateRangePicker {
} }
}); });
let two_weeks_button = gtk::Button::builder().label("last two weeks").build(); let two_weeks_button = gtk::Button::builder()
.css_classes(["date-range-picker__range-button"])
.label("two weeks")
.build();
two_weeks_button.connect_clicked({ two_weeks_button.connect_clicked({
let s = s.clone(); let s = s.clone();
move |_| { move |_| {
@ -112,7 +122,10 @@ impl Default for DateRangePicker {
} }
}); });
let last_month_button = gtk::Button::builder().label("last month").build(); let last_month_button = gtk::Button::builder()
.css_classes(["date-range-picker__range-button"])
.label("month")
.build();
last_month_button.connect_clicked({ last_month_button.connect_clicked({
let s = s.clone(); let s = s.clone();
move |_| { move |_| {
@ -123,7 +136,10 @@ impl Default for DateRangePicker {
} }
}); });
let six_months_button = gtk::Button::builder().label("last six months").build(); let six_months_button = gtk::Button::builder()
.css_classes(["date-range-picker__range-button"])
.label("six months")
.build();
six_months_button.connect_clicked({ six_months_button.connect_clicked({
let s = s.clone(); let s = s.clone();
move |_| { move |_| {
@ -134,7 +150,10 @@ impl Default for DateRangePicker {
} }
}); });
let last_year_button = gtk::Button::builder().label("last year").build(); let last_year_button = gtk::Button::builder()
.css_classes(["date-range-picker__range-button"])
.label("year")
.build();
last_year_button.connect_clicked({ last_year_button.connect_clicked({
let s = s.clone(); let s = s.clone();
move |_| { move |_| {

View File

@ -141,7 +141,10 @@ impl HistoricalView {
pub fn set_interval(&self, interval: DayInterval) { pub fn set_interval(&self, interval: DayInterval) {
let mut model = gio::ListStore::new::<Date>(); let mut model = gio::ListStore::new::<Date>();
model.extend(interval.days().map(Date::new)); let mut days = interval.days().map(Date::new).collect::<Vec<Date>>();
days.reverse();
model.extend(days.into_iter());
// model.extend(interval.days().map(Date::new));
self.imp() self.imp()
.list_view .list_view
.set_model(Some(&gtk::NoSelection::new(Some(model)))); .set_model(Some(&gtk::NoSelection::new(Some(model))));