diff --git a/src/components/layout.rs b/src/components/layout.rs new file mode 100644 index 0000000..54c25de --- /dev/null +++ b/src/components/layout.rs @@ -0,0 +1,13 @@ +use iced::widget::{container, scrollable, Column}; +use iced::Length; +use iced::{Element, Padding}; + +use crate::Message; + +pub fn basic_layout(column: Column) -> Element { + container( + scrollable(column.width(Length::Fixed(512.)).padding(Padding::new(48.))) + .height(Length::Fill), + ) + .into() +} diff --git a/src/components/mod.rs b/src/components/mod.rs index 2903343..167aa16 100644 --- a/src/components/mod.rs +++ b/src/components/mod.rs @@ -30,3 +30,12 @@ pub use caption_text::*; mod federation_item; pub use federation_item::*; + +mod screen_header; +pub use screen_header::*; + +mod rules; +pub use rules::*; + +mod layout; +pub use layout::*; diff --git a/src/components/rules.rs b/src/components/rules.rs new file mode 100644 index 0000000..3ee8e9d --- /dev/null +++ b/src/components/rules.rs @@ -0,0 +1,39 @@ +use crate::components::lighten; +use iced::widget::{horizontal_rule, rule, vertical_rule}; +use iced::{Element, Theme}; + +use crate::Message; + +pub fn hr() -> Element<'static, Message> { + horizontal_rule(1) + .style(|theme: &Theme| { + { + let gray = lighten(theme.palette().background, 0.1); + // TODO: is there an easier way to just override the color? + rule::Style { + color: gray, + width: 1, + radius: (0.).into(), + fill_mode: rule::FillMode::Full, + } + } + }) + .into() +} + +pub fn vr() -> Element<'static, Message> { + vertical_rule(1) + .style(|theme: &Theme| { + { + let gray = lighten(theme.palette().background, 0.1); + // TODO: is there an easier way to just override the color? + rule::Style { + color: gray, + width: 1, + radius: (0.).into(), + fill_mode: rule::FillMode::Full, + } + } + }) + .into() +} diff --git a/src/components/screen_header.rs b/src/components/screen_header.rs new file mode 100644 index 0000000..e8eb19f --- /dev/null +++ b/src/components/screen_header.rs @@ -0,0 +1,36 @@ +use iced::{ + widget::{column, row, text}, + Alignment, Element, Length, +}; + +use crate::{HarborWallet, Message}; + +use super::{hr, map_icon, vr, FederationItem, SvgIcon}; + +pub fn h_screen_header(harbor: &HarborWallet, show_balance: bool) -> Element { + if let Some(item) = harbor.federation_list.first() { + let FederationItem { name, id: _id } = item; + let people_icon = map_icon(SvgIcon::People).width(24).height(24); + let current_federation = row![people_icon, text(name).size(24)] + .align_items(Alignment::Center) + .spacing(16) + .width(Length::Shrink) + .padding(16); + + let balance = row![text(format!("{} sats", harbor.balance_sats)).size(24)] + .align_items(Alignment::Center) + .padding(16); + + let row = row![current_federation].spacing(16); + + column![ + row.push_maybe(show_balance.then_some(vr())) + .push_maybe(show_balance.then_some(balance)) + .height(Length::Shrink), + hr() + ] + .into() + } else { + row![].spacing(16).into() + } +} diff --git a/src/routes/history.rs b/src/routes/history.rs index a5975ce..3e3d155 100644 --- a/src/routes/history.rs +++ b/src/routes/history.rs @@ -1,8 +1,7 @@ -use iced::widget::{column, container, scrollable}; +use iced::widget::column; use iced::Element; -use iced::{Length, Padding}; -use crate::components::{h_header, h_transaction_item}; +use crate::components::{basic_layout, h_header, h_screen_header, h_transaction_item}; use crate::{HarborWallet, Message}; pub fn history(harbor: &HarborWallet) -> Element { @@ -17,12 +16,9 @@ pub fn history(harbor: &HarborWallet) -> Element { let column = column![header, transactions].spacing(48); - container(scrollable( - column - .spacing(48) - .width(Length::Fill) - .max_width(512) - .padding(Padding::new(48.)), - )) + column![ + h_screen_header(harbor, true), + basic_layout(column.spacing(48)), + ] .into() } diff --git a/src/routes/home.rs b/src/routes/home.rs index 1404273..8913d74 100644 --- a/src/routes/home.rs +++ b/src/routes/home.rs @@ -1,6 +1,6 @@ -use crate::components::{h_button, SvgIcon}; +use crate::components::{h_button, h_screen_header, SvgIcon}; use iced::widget::{center, column, container, row, text}; -use iced::{Alignment, Element}; +use iced::{Alignment, Element, Length}; use crate::{HarborWallet, Message}; @@ -14,11 +14,15 @@ pub fn home(harbor: &HarborWallet) -> Element { h_button("Receive", SvgIcon::DownLeft, false).on_press(Message::Navigate(Route::Receive)); let buttons = row![send_button, receive_button].spacing(32); - container(center( - column![balance, buttons] - .spacing(32) - .align_items(Alignment::Center) - .max_width(512), - )) + column![ + h_screen_header(harbor, false), + container(center( + column![balance, buttons] + .spacing(32) + .align_items(Alignment::Center) + .max_width(512) + )) + .height(Length::Fill) + ] .into() } diff --git a/src/routes/mints.rs b/src/routes/mints.rs index b4a5cad..dc4e922 100644 --- a/src/routes/mints.rs +++ b/src/routes/mints.rs @@ -1,8 +1,7 @@ -use iced::widget::{column, container, scrollable, text}; +use iced::widget::{column, text}; use iced::{Color, Element}; -use iced::{Length, Padding}; -use crate::components::{h_button, h_federation_item, h_header, h_input, SvgIcon}; +use crate::components::{basic_layout, h_button, h_federation_item, h_header, h_input, SvgIcon}; use crate::{HarborWallet, Message}; pub fn mints(harbor: &HarborWallet) -> Element { @@ -55,12 +54,5 @@ pub fn mints(harbor: &HarborWallet) -> Element { column.push(federation_list) }; - container(scrollable( - column - .spacing(48) - .width(Length::Fill) - .max_width(512) - .padding(Padding::new(48.)), - )) - .into() + basic_layout(column.spacing(48)) } diff --git a/src/routes/receive.rs b/src/routes/receive.rs index 253cbb2..90d6981 100644 --- a/src/routes/receive.rs +++ b/src/routes/receive.rs @@ -1,9 +1,11 @@ use iced::widget::container::Style; -use iced::widget::{column, container, qr_code, radio, scrollable, text}; -use iced::{Border, Element, Font, Padding}; -use iced::{Color, Length}; +use iced::widget::{column, container, qr_code, radio, text}; +use iced::Color; +use iced::{Border, Element, Font}; -use crate::components::{h_button, h_caption_text, h_header, h_input, SvgIcon}; +use crate::components::{ + basic_layout, h_button, h_caption_text, h_header, h_input, h_screen_header, SvgIcon, +}; use crate::{HarborWallet, Message, ReceiveMethod, ReceiveStatus}; pub fn receive(harbor: &HarborWallet) -> Element { @@ -116,12 +118,9 @@ pub fn receive(harbor: &HarborWallet) -> Element { } }; - container(scrollable( - column - .spacing(48) - .width(Length::Fill) - .max_width(512) - .padding(Padding::new(48.)), - )) + column![ + h_screen_header(harbor, true), + basic_layout(column.spacing(48)), + ] .into() } diff --git a/src/routes/send.rs b/src/routes/send.rs index f7b97b4..cdc166a 100644 --- a/src/routes/send.rs +++ b/src/routes/send.rs @@ -1,8 +1,8 @@ -use iced::widget::{column, container, scrollable, text}; -use iced::{Color, Length}; -use iced::{Element, Padding}; +use iced::widget::{column, text}; +use iced::Color; +use iced::Element; -use crate::components::{h_button, h_header, h_input, SvgIcon}; +use crate::components::{basic_layout, h_button, h_header, h_input, h_screen_header, SvgIcon}; use crate::{HarborWallet, Message, SendStatus}; pub fn send(harbor: &HarborWallet) -> Element { @@ -59,12 +59,9 @@ pub fn send(harbor: &HarborWallet) -> Element { column![header, amount_input, dest_input, send_button] }; - container(scrollable( - column - .spacing(48) - .width(Length::Fill) - .max_width(512) - .padding(Padding::new(48.)), - )) + column![ + h_screen_header(harbor, true), + basic_layout(column.spacing(48)), + ] .into() }