diff --git a/gui/Cargo.lock b/gui/Cargo.lock index 19852f0b..cfdc1be0 100644 --- a/gui/Cargo.lock +++ b/gui/Cargo.lock @@ -236,6 +236,12 @@ version = "0.6.3" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "349f9b6a179ed607305526ca489b34ad0a41aed5f7980fa90eb03160b69598fb" +[[package]] +name = "bit_field" +version = "0.10.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "dc827186963e592360843fb5ba4b973e145841266c1357f7180c43526f2e5b61" + [[package]] name = "bitcoin" version = "0.29.2" @@ -463,6 +469,12 @@ dependencies = [ "unicode-width", ] +[[package]] +name = "color_quant" +version = "1.1.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "3d7b894f5411737b7867f4827955924d7c254fc9f4d91a6aad6b097804b1018b" + [[package]] name = "const_panic" version = "0.2.7" @@ -606,6 +618,12 @@ dependencies = [ "winapi", ] +[[package]] +name = "crunchy" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7a81dae078cea95a014a339291cec439d2f232ebe854a9d672b796c6afafa9b7" + [[package]] name = "cty" version = "0.2.2" @@ -859,6 +877,22 @@ dependencies = [ "pkg-config", ] +[[package]] +name = "exr" +version = "1.6.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bdd2162b720141a91a054640662d3edce3d50a944a50ffca5313cd951abb35b4" +dependencies = [ + "bit_field", + "flume", + "half", + "lebe", + "miniz_oxide", + "rayon-core", + "smallvec", + "zune-inflate", +] + [[package]] name = "fallible-iterator" version = "0.2.0" @@ -914,6 +948,19 @@ dependencies = [ "num-traits", ] +[[package]] +name = "flume" +version = "0.10.14" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "1657b4441c3403d9f7b3409e47575237dac27b1b5726df654a6ecbf92f0f7577" +dependencies = [ + "futures-core", + "futures-sink", + "nanorand", + "pin-project", + "spin", +] + [[package]] name = "fnv" version = "1.0.7" @@ -1111,8 +1158,20 @@ source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "c05aeb6a22b8f62540c194aac980f2115af067bfe15a0734d7277a768d396b31" dependencies = [ "cfg-if", + "js-sys", "libc", "wasi 0.11.0+wasi-snapshot-preview1", + "wasm-bindgen", +] + +[[package]] +name = "gif" +version = "0.12.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "80792593675e051cf94a4b111980da2ba60d4a83e43e0048c5693baab3977045" +dependencies = [ + "color_quant", + "weezl", ] [[package]] @@ -1314,6 +1373,15 @@ dependencies = [ "svg_fmt", ] +[[package]] +name = "half" +version = "2.2.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "02b4af3693f1b705df946e9fe5631932443781d0aabb423b62fcd4d73f6d2fd0" +dependencies = [ + "crunchy", +] + [[package]] name = "hashbrown" version = "0.8.2" @@ -1428,6 +1496,7 @@ dependencies = [ "iced_native", "iced_wgpu", "iced_winit", + "image", "thiserror", ] @@ -1495,6 +1564,8 @@ dependencies = [ "glam", "iced_native", "iced_style", + "image", + "kamadak-exif", "log", "lyon", "qrcode", @@ -1584,6 +1655,25 @@ version = "1.0.1" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "b9e0384b61958566e926dc50660321d12159025e767c18e043daf26b70104c39" +[[package]] +name = "image" +version = "0.24.6" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "527909aa81e20ac3a44803521443a765550f09b5130c2c2fa1ea59c2f8f50a3a" +dependencies = [ + "bytemuck", + "byteorder", + "color_quant", + "exr", + "gif", + "jpeg-decoder 0.3.0", + "num-rational", + "num-traits", + "png", + "qoi", + "tiff", +] + [[package]] name = "indexmap" version = "1.9.3" @@ -1624,6 +1714,15 @@ version = "0.1.22" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "229d53d58899083193af11e15917b5640cd40b29ff475a1fe4ef725deb02d0f2" +[[package]] +name = "jpeg-decoder" +version = "0.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "bc0000e42512c92e31c2252315bda326620a4e034105e900c98ec492fa077b3e" +dependencies = [ + "rayon", +] + [[package]] name = "js-sys" version = "0.3.61" @@ -1645,6 +1744,15 @@ dependencies = [ "serde_json", ] +[[package]] +name = "kamadak-exif" +version = "0.5.5" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ef4fc70d0ab7e5b6bafa30216a6b48705ea964cdfc29c050f2412295eba58077" +dependencies = [ + "mutate_once", +] + [[package]] name = "khronos-egl" version = "4.1.0" @@ -1677,6 +1785,12 @@ version = "1.4.0" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "e2abad23fbc42b3700f2f279844dc832adb2b2eb069b2df918f455c4e18cc646" +[[package]] +name = "lebe" +version = "0.5.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "03087c2bad5e1034e8cace5926dec053fb3790248370865f5117a7d0213354c8" + [[package]] name = "ledger-apdu" version = "0.10.0" @@ -2064,6 +2178,12 @@ dependencies = [ "winapi", ] +[[package]] +name = "mutate_once" +version = "0.1.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "16cf681a23b4d0a43fc35024c176437f9dcd818db34e0f42ab456a0ee5ad497b" + [[package]] name = "naga" version = "0.10.0" @@ -2084,6 +2204,15 @@ dependencies = [ "unicode-xid", ] +[[package]] +name = "nanorand" +version = "0.7.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "6a51313c5820b0b02bd422f4b44776fbf47961755c74ce64afc73bfad10226c3" +dependencies = [ + "getrandom", +] + [[package]] name = "ndk" version = "0.7.0" @@ -2230,6 +2359,17 @@ dependencies = [ "num-traits", ] +[[package]] +name = "num-rational" +version = "0.4.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "0638a1c9d0a3c0914158145bc76cff373a75a627e6ecbfb71cbe6f453a5a19b0" +dependencies = [ + "autocfg", + "num-integer", + "num-traits", +] + [[package]] name = "num-traits" version = "0.2.15" @@ -2508,6 +2648,26 @@ version = "0.4.2" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "db8bcd96cb740d03149cbad5518db9fd87126a10ab519c011893b1754134c468" +[[package]] +name = "pin-project" +version = "1.0.12" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ad29a609b6bcd67fee905812e544992d216af9d755757c05ed2d0e15a74c6ecc" +dependencies = [ + "pin-project-internal", +] + +[[package]] +name = "pin-project-internal" +version = "1.0.12" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "069bdb1e05adc7a8990dce9cc75370895fbe4e3d58b9b73bf1aee56359344a55" +dependencies = [ + "proc-macro2", + "quote", + "syn 1.0.109", +] + [[package]] name = "pin-project-lite" version = "0.2.9" @@ -2593,6 +2753,15 @@ version = "1.0.7" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "74605f360ce573babfe43964cbe520294dcb081afbf8c108fc6e23036b4da2df" +[[package]] +name = "qoi" +version = "0.4.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7f6d64c71eb498fe9eae14ce4ec935c555749aef511cca85b5568910d6e48001" +dependencies = [ + "bytemuck", +] + [[package]] name = "qrcode" version = "0.12.0" @@ -2758,7 +2927,7 @@ version = "0.18.0" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "608c6e8aa6fb2c13bc06e4184d7c7b2cc1b7c138f88a539da8be55c3c033d7f4" dependencies = [ - "jpeg-decoder", + "jpeg-decoder 0.1.22", "log", "pico-args", "png", @@ -2991,6 +3160,12 @@ dependencies = [ "libc", ] +[[package]] +name = "simd-adler32" +version = "0.3.5" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "238abfbb77c1915110ad968465608b68e869e0772622c9656714e73e5a1a522f" + [[package]] name = "simplecss" version = "0.2.1" @@ -3091,6 +3266,15 @@ dependencies = [ "winapi", ] +[[package]] +name = "spin" +version = "0.9.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "6980e8d7511241f8acf4aebddbb1ff938df5eebe98691418c4468d0b72a96a67" +dependencies = [ + "lock_api", +] + [[package]] name = "spirv" version = "0.2.0+1.5.4" @@ -3211,6 +3395,17 @@ dependencies = [ "once_cell", ] +[[package]] +name = "tiff" +version = "0.8.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "7449334f9ff2baf290d55d73983a7d6fa15e01198faef72af07e2a8db851e471" +dependencies = [ + "flate2", + "jpeg-decoder 0.3.0", + "weezl", +] + [[package]] name = "time" version = "0.1.45" @@ -3731,6 +3926,12 @@ dependencies = [ "wasm-bindgen", ] +[[package]] +name = "weezl" +version = "0.1.7" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "9193164d4de03a926d909d3bc7c30543cecb35400c02114792c2cae20d5e2dbb" + [[package]] name = "wgpu" version = "0.14.2" @@ -4172,3 +4373,12 @@ name = "xmlwriter" version = "0.1.0" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "ec7a2a501ed189703dba8b08142f057e887dfc4b2cc4db2d343ac6376ba3e0b9" + +[[package]] +name = "zune-inflate" +version = "0.2.53" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "440a08fd59c6442e4b846ea9b10386c38307eae728b216e1ab2c305d1c9daaf8" +dependencies = [ + "simd-adler32", +] diff --git a/gui/Cargo.toml b/gui/Cargo.toml index 8b2f61dc..952c5a60 100644 --- a/gui/Cargo.toml +++ b/gui/Cargo.toml @@ -20,7 +20,7 @@ liana_ui = { path = "ui" } backtrace = "0.3" base64 = "0.13" -iced = { version = "0.7", default-features= false, features = ["tokio", "glow", "svg", "qr_code"] } +iced = { version = "0.7", default-features= false, features = ["tokio", "glow", "svg", "qr_code", "image"] } iced_native = "0.8" iced_lazy = { version = "0.4"} diff --git a/gui/liana-gui.desktop b/gui/liana-gui.desktop new file mode 100644 index 00000000..57f69ed4 --- /dev/null +++ b/gui/liana-gui.desktop @@ -0,0 +1,4 @@ +[Desktop Entry] +Name=Liana +Exec=liana-gui +Type=Application diff --git a/gui/src/app/view/coins.rs b/gui/src/app/view/coins.rs index 2eee7199..83bfe0c6 100644 --- a/gui/src/app/view/coins.rs +++ b/gui/src/app/view/coins.rs @@ -76,11 +76,11 @@ fn coin_list_view( Some(Container::new( Row::new() .spacing(5) - .push(text(" 0").small().style(color::legacy::ALERT)) + .push(text(" 0").small().style(color::RED)) .push( icon::hourglass_done_icon() .small() - .style(color::legacy::ALERT), + .style(color::RED), ) .align_items(Alignment::Center), )) @@ -91,12 +91,12 @@ fn coin_list_view( .push( text(format!(" {}", seq)) .small() - .style(color::legacy::WARNING), + .style(color::ORANGE), ) .push( icon::hourglass_icon() .small() - .style(color::legacy::WARNING), + .style(color::ORANGE), ) .align_items(Alignment::Center), )) @@ -143,7 +143,7 @@ fn coin_list_view( text("One of the recovery path is available") .bold() .small() - .style(color::legacy::ALERT), + .style(color::RED), )) } else { Some(Container::new( diff --git a/gui/src/app/view/home.rs b/gui/src/app/view/home.rs index 19dd6c22..35ad9ade 100644 --- a/gui/src/app/view/home.rs +++ b/gui/src/app/view/home.rs @@ -35,11 +35,7 @@ pub fn home_view<'a>( Row::new() .spacing(15) .align_items(Alignment::Center) - .push( - icon::hourglass_icon() - .size(30) - .style(color::legacy::WARNING), - ) + .push(icon::hourglass_icon().size(30).style(color::ORANGE)) .push( Row::new() .spacing(5) @@ -57,7 +53,7 @@ pub fn home_view<'a>( Row::new() .spacing(15) .align_items(Alignment::Center) - .push(icon::hourglass_done_icon().style(color::legacy::ALERT)) + .push(icon::hourglass_done_icon().style(color::RED)) .push( Row::new() .spacing(5) diff --git a/gui/src/app/view/hw.rs b/gui/src/app/view/hw.rs index 9a7585f8..312aaca9 100644 --- a/gui/src/app/view/hw.rs +++ b/gui/src/app/view/hw.rs @@ -44,7 +44,7 @@ pub fn hw_list_view( hw::unsupported_hardware_wallet(&kind.to_string(), version.as_ref()) } }) - .style(theme::Button::Secondary) + .style(theme::Button::Border) .width(Length::Fill); if !processing { if let HardwareWallet::Supported { registered, .. } = hw { @@ -91,7 +91,7 @@ pub fn hw_list_view_for_registration( hw::unsupported_hardware_wallet(&kind.to_string(), version.as_ref()) } }) - .style(theme::Button::Secondary) + .style(theme::Button::Border) .width(Length::Fill); if !processing && hw.is_supported() { bttn = bttn.on_press(Message::SelectHardwareWallet(i)); diff --git a/gui/src/app/view/mod.rs b/gui/src/app/view/mod.rs index bd620e92..0e13cca0 100644 --- a/gui/src/app/view/mod.rs +++ b/gui/src/app/view/mod.rs @@ -16,7 +16,7 @@ use warning::warn; use iced::{widget::scrollable, Length}; use liana_ui::{ - component::{button, separation, text::*}, + component::{button, text::*}, icon::{coin_icon, cross_icon, home_icon, receive_icon, send_icon, settings_icon}, theme, util::Collection, @@ -27,11 +27,11 @@ use crate::app::{cache::Cache, error::Error, menu::Menu}; pub fn sidebar<'a>(menu: &Menu, cache: &'a Cache) -> Container<'a, Message> { let home_button = if *menu == Menu::Home { - button::primary(Some(home_icon()), "Home") + button::menu_active(Some(home_icon()), "Home") .on_press(Message::Reload) .width(iced::Length::Units(200)) } else { - button::transparent(Some(home_icon()), "Home") + button::menu(Some(home_icon()), "Home") .on_press(Message::Menu(Menu::Home)) .width(iced::Length::Units(200)) }; @@ -62,17 +62,17 @@ pub fn sidebar<'a>(menu: &Menu, cache: &'a Cache) -> Container<'a, Message> { .small() .bold(), ) - .style(theme::Container::Pill(theme::Pill::InversePrimary)), + .style(theme::Container::Pill(theme::Pill::Primary)), ) .spacing(10) .width(iced::Length::Fill) .align_items(iced::Alignment::Center), ) .width(iced::Length::Fill) - .padding(5) + .padding(10) .center_x(), ) - .style(theme::Button::Primary) + .style(theme::Button::Menu(true)) .on_press(Message::Reload) .width(iced::Length::Units(200)) } else { @@ -108,10 +108,10 @@ pub fn sidebar<'a>(menu: &Menu, cache: &'a Cache) -> Container<'a, Message> { .align_items(iced::Alignment::Center), ) .width(iced::Length::Fill) - .padding(5) + .padding(10) .center_x(), ) - .style(theme::Button::Transparent) + .style(theme::Button::Menu(false)) .on_press(Message::Menu(Menu::Coins)) .width(iced::Length::Units(200)) }; @@ -137,7 +137,7 @@ pub fn sidebar<'a>(menu: &Menu, cache: &'a Cache) -> Container<'a, Message> { .small() .bold(), ) - .style(theme::Pill::InversePrimary), + .style(theme::Pill::Primary), ) }) .spacing(10) @@ -145,10 +145,10 @@ pub fn sidebar<'a>(menu: &Menu, cache: &'a Cache) -> Container<'a, Message> { .align_items(iced::Alignment::Center), ) .width(iced::Length::Fill) - .padding(5) + .padding(10) .center_x(), ) - .style(theme::Button::Primary) + .style(theme::Button::Menu(true)) .on_press(Message::Reload) .width(iced::Length::Units(200)) } else { @@ -180,30 +180,30 @@ pub fn sidebar<'a>(menu: &Menu, cache: &'a Cache) -> Container<'a, Message> { .align_items(iced::Alignment::Center), ) .width(iced::Length::Fill) - .padding(5) + .padding(10) .center_x(), ) - .style(theme::Button::Transparent) + .style(theme::Button::Menu(false)) .on_press(Message::Menu(Menu::Spend)) .width(iced::Length::Units(200)) }; let receive_button = if *menu == Menu::Receive { - button::primary(Some(receive_icon()), "Receive") + button::menu_active(Some(receive_icon()), "Receive") .on_press(Message::Reload) .width(iced::Length::Units(200)) } else { - button::transparent(Some(receive_icon()), "Receive") + button::menu(Some(receive_icon()), "Receive") .on_press(Message::Menu(Menu::Receive)) .width(iced::Length::Units(200)) }; let settings_button = if *menu == Menu::Settings { - button::primary(Some(settings_icon()), "Settings") + button::menu_active(Some(settings_icon()), "Settings") .on_press(Message::Menu(Menu::Settings)) .width(iced::Length::Units(200)) } else { - button::transparent(Some(settings_icon()), "Settings") + button::menu(Some(settings_icon()), "Settings") .on_press(Message::Menu(Menu::Settings)) .width(iced::Length::Units(200)) }; @@ -214,10 +214,12 @@ pub fn sidebar<'a>(menu: &Menu, cache: &'a Cache) -> Container<'a, Message> { .push( Column::new() .push( - Column::new() - .push(Container::new(text("Liana").bold()).padding(10)) - .push(separation().width(Length::Units(200))) - .spacing(10), + Container::new( + liana_ui::image::liana_grey_logo() + .height(Length::Units(150)) + .width(Length::Units(60)), + ) + .padding(15), ) .push(home_button) .push(coins_button) diff --git a/gui/src/app/view/settings.rs b/gui/src/app/view/settings.rs index f2a1c835..82c9d18c 100644 --- a/gui/src/app/view/settings.rs +++ b/gui/src/app/view/settings.rs @@ -53,7 +53,7 @@ pub fn list(cache: &Cache) -> Element { .width(Length::Fill), ) .width(Length::Fill) - .style(theme::Button::Secondary) + .style(theme::Button::TransparentBorder) .on_press(Message::Settings(SettingsMessage::EditBitcoindSettings)) ) .width(Length::Fill) @@ -71,7 +71,7 @@ pub fn list(cache: &Cache) -> Element { .width(Length::Fill), ) .width(Length::Fill) - .style(theme::Button::Secondary) + .style(theme::Button::TransparentBorder) .on_press(Message::Settings(SettingsMessage::EditWalletSettings)) ) .width(Length::Fill) @@ -90,7 +90,7 @@ pub fn list(cache: &Cache) -> Element { .width(Length::Fill), ) .width(Length::Fill) - .style(theme::Button::Secondary) + .style(theme::Button::TransparentBorder) .on_press(Message::Menu(Menu::Recovery)) ) .width(Length::Fill) @@ -108,7 +108,7 @@ pub fn list(cache: &Cache) -> Element { .width(Length::Fill), ) .width(Length::Fill) - .style(theme::Button::Secondary) + .style(theme::Button::TransparentBorder) .on_press(Message::Settings(SettingsMessage::AboutSection)) ) .width(Length::Fill) @@ -397,15 +397,15 @@ pub fn is_running_label<'a, T: 'a>(is_running: Option) -> Container<'a, T> if running { Container::new( Row::new() - .push(icon::dot_icon().size(5).style(color::legacy::SUCCESS)) - .push(text("Running").small().style(color::legacy::SUCCESS)) + .push(icon::dot_icon().size(5).style(color::GREEN)) + .push(text("Running").small().style(color::GREEN)) .align_items(Alignment::Center), ) } else { Container::new( Row::new() - .push(icon::dot_icon().size(5).style(color::legacy::ALERT)) - .push(text("Not running").small().style(color::legacy::ALERT)) + .push(icon::dot_icon().size(5).style(color::RED)) + .push(text("Not running").small().style(color::RED)) .align_items(Alignment::Center), ) } @@ -430,7 +430,7 @@ pub fn rescan<'a>( .push(badge::Badge::new(icon::block_icon())) .push(text("Rescan blockchain").bold().width(Length::Fill)) .push_maybe(if success { - Some(text("Rescan was successful").style(color::legacy::SUCCESS)) + Some(text("Rescan was successful").style(color::GREEN)) } else { None }) @@ -563,7 +563,7 @@ pub fn wallet_settings<'a>( .spacing(10) .push(Column::new().width(Length::Fill)) .push( - button::border(Some(icon::clipboard_icon()), "Copy") + button::secondary(Some(icon::clipboard_icon()), "Copy") .on_press(Message::Clipboard(descriptor.to_owned())), ) .push( @@ -609,10 +609,8 @@ pub fn wallet_settings<'a>( Some( Row::new() .align_items(Alignment::Center) - .push( - icon::circle_check_icon().style(color::legacy::SUCCESS), - ) - .push(text("Updated").style(color::legacy::SUCCESS)), + .push(icon::circle_check_icon().style(color::GREEN)) + .push(text("Updated").style(color::GREEN)), ) } else { None @@ -645,7 +643,7 @@ pub fn register_wallet_modal<'a>( .push( Row::new() .push(text("Select device:").bold().width(Length::Fill)) - .push(button::border(None, "Refresh").on_press(Message::Reload)) + .push(button::secondary(None, "Refresh").on_press(Message::Reload)) .align_items(Alignment::Center), ) .spacing(10) diff --git a/gui/src/app/view/spend/detail.rs b/gui/src/app/view/spend/detail.rs index 5755b0ac..72e09685 100644 --- a/gui/src/app/view/spend/detail.rs +++ b/gui/src/app/view/spend/detail.rs @@ -249,11 +249,11 @@ fn spend_overview_view<'a>( Row::new() .spacing(5) .push( - button::border(Some(icon::clipboard_icon()), "Copy") + button::secondary(Some(icon::clipboard_icon()), "Copy") .on_press(Message::Clipboard(tx.psbt.to_string())), ) .push( - button::border(Some(icon::import_icon()), "Update") + button::secondary(Some(icon::import_icon()), "Update") .on_press(Message::Spend(SpendTxMessage::EditPsbt)), ), ) @@ -292,8 +292,8 @@ pub fn signatures<'a>( Row::new() .spacing(5) .align_items(Alignment::Center) - .push(icon::circle_check_icon().style(color::legacy::SUCCESS)) - .push(text("Ready").bold().style(color::legacy::SUCCESS)) + .push(icon::circle_check_icon().style(color::GREEN)) + .push(text("Ready").bold().style(color::GREEN)) .push(text(", signed by")) .push( sigs.signed_pubkeys @@ -429,7 +429,7 @@ pub fn path_view<'a>( Row::new() .align_items(Alignment::Center) .push(if sigs.sigs_count >= sigs.threshold { - icon::circle_check_icon().style(color::legacy::SUCCESS) + icon::circle_check_icon().style(color::GREEN) } else { icon::circle_cross_icon() }) @@ -728,7 +728,7 @@ pub fn sign_action<'a>( .bold() .width(Length::Fill), ) - .push(button::border(None, "Refresh").on_press(Message::Reload)) + .push(button::secondary(None, "Refresh").on_press(Message::Reload)) .align_items(Alignment::Center), ) .spacing(10) @@ -754,7 +754,7 @@ pub fn sign_action<'a>( }) .on_press(Message::Spend(SpendTxMessage::SelectHotSigner)) .padding(10) - .style(theme::Button::Secondary) + .style(theme::Button::Border) .width(Length::Fill) })) .width(Length::Fill), @@ -820,7 +820,7 @@ pub fn update_spend_success_view<'a>() -> Element<'a, Message> { Column::new() .push( card::simple(Container::new( - text("Spend transaction is updated").style(color::legacy::SUCCESS), + text("Spend transaction is updated").style(color::GREEN), )) .padding(50), ) diff --git a/gui/src/app/view/spend/mod.rs b/gui/src/app/view/spend/mod.rs index ccd7315a..9e08a39c 100644 --- a/gui/src/app/view/spend/mod.rs +++ b/gui/src/app/view/spend/mod.rs @@ -55,10 +55,7 @@ pub fn import_spend_view<'a>( pub fn import_spend_success_view<'a>() -> Element<'a, Message> { Column::new() .push( - card::simple(Container::new( - text("PSBT is imported").style(color::legacy::SUCCESS), - )) - .padding(50), + card::simple(Container::new(text("PSBT is imported").style(color::GREEN))).padding(50), ) .width(Length::Units(400)) .align_items(Alignment::Center) @@ -72,7 +69,7 @@ pub fn spend_view<'a>(spend_txs: &[SpendTx]) -> Element<'a, Message> { .spacing(10) .push(Column::new().width(Length::Fill)) .push( - button::border(Some(icon::import_icon()), "Import") + button::secondary(Some(icon::import_icon()), "Import") .on_press(Message::ImportSpend(ImportSpendMessage::Import)), ) .push( diff --git a/gui/src/app/view/spend/step.rs b/gui/src/app/view/spend/step.rs index c32d821e..50905f98 100644 --- a/gui/src/app/view/spend/step.rs +++ b/gui/src/app/view/spend/step.rs @@ -63,10 +63,7 @@ pub fn choose_recipients_view<'a>( .width(Length::Fill), ) .push_maybe(if duplicate { - Some( - text("Two recipient addresses are the same") - .style(color::legacy::WARNING), - ) + Some(text("Two recipient addresses are the same").style(color::ORANGE)) } else { None }) @@ -217,12 +214,8 @@ fn coin_list_view<'a>( Some(Container::new( Row::new() .spacing(5) - .push(text(" 0").small().style(color::legacy::ALERT)) - .push( - icon::hourglass_done_icon() - .small() - .style(color::legacy::ALERT), - ) + .push(text(" 0").small().style(color::RED)) + .push(icon::hourglass_done_icon().small().style(color::RED)) .align_items(Alignment::Center), )) } else if seq < timelock as u32 * 10 / 100 { @@ -230,15 +223,9 @@ fn coin_list_view<'a>( Row::new() .spacing(5) .push( - text(format!(" {}", seq)) - .small() - .style(color::legacy::WARNING), - ) - .push( - icon::hourglass_icon() - .small() - .style(color::legacy::WARNING), + text(format!(" {}", seq)).small().style(color::ORANGE), ) + .push(icon::hourglass_icon().small().style(color::ORANGE)) .align_items(Alignment::Center), )) } else { diff --git a/gui/src/app/view/util.rs b/gui/src/app/view/util.rs index fb1440de..b9b997d6 100644 --- a/gui/src/app/view/util.rs +++ b/gui/src/app/view/util.rs @@ -47,7 +47,7 @@ fn split_digits<'a, T: 'a>(mut s: String, size: u16) -> impl Into if s.starts_with(prefix) { let right = s.split_off(prefix.len()); return Row::new() - .push(text(s).size(size).style(color::DARK_GREY)) + .push(text(s).size(size).style(color::GREY_2)) .push_maybe(if right.is_empty() { None } else { diff --git a/gui/src/installer/view.rs b/gui/src/installer/view.rs index cbdd78ac..476fbdf4 100644 --- a/gui/src/installer/view.rs +++ b/gui/src/installer/view.rs @@ -166,10 +166,7 @@ pub fn define_descriptor<'a>( .push_maybe(if network_valid { None } else { - Some( - text("A data directory already exists for this network") - .style(color::legacy::ALERT), - ) + Some(text("A data directory already exists for this network").style(color::RED)) }) .padding(50); @@ -257,7 +254,7 @@ pub fn define_descriptor<'a>( .push( Row::new() .spacing(10) - .push(button::border(None, "Add a recovery path").on_press( + .push(button::secondary(None, "Add a recovery path").on_press( Message::DefineDescriptor(message::DefineDescriptor::AddRecoveryPath), )) .push(if !valid { @@ -354,10 +351,7 @@ pub fn import_descriptor<'a>( .push_maybe(if network_valid { None } else { - Some( - text("A data directory already exists for this network") - .style(color::legacy::ALERT), - ) + Some(text("A data directory already exists for this network").style(color::RED)) }); let col_descriptor = Column::new() .push(text("Descriptor:").bold()) @@ -445,7 +439,7 @@ pub fn signer_xpubs(xpubs: &Vec) -> Element { ) .push( Container::new( - button::border(Some(icon::clipboard_icon()), "Copy") + button::secondary(Some(icon::clipboard_icon()), "Copy") .on_press(Message::Clibpboard(xpub.clone())) .width(Length::Shrink), ) @@ -457,7 +451,7 @@ pub fn signer_xpubs(xpubs: &Vec) -> Element { .push_maybe(if !xpubs.is_empty() { Some( Container::new( - button::border(Some(icon::plus_icon()), "New public key") + button::secondary(Some(icon::plus_icon()), "New public key") .on_press(Message::UseHotSigner), ) .padding(10), @@ -528,7 +522,7 @@ pub fn hardware_wallet_xpubs<'a>( ) .push( Container::new( - button::border(Some(icon::clipboard_icon()), "Copy") + button::secondary(Some(icon::clipboard_icon()), "Copy") .on_press(Message::Clibpboard(xpub.clone())) .width(Length::Shrink), ) @@ -540,10 +534,10 @@ pub fn hardware_wallet_xpubs<'a>( .push_maybe(if !xpubs.is_empty() { Some( Container::new(if !processing { - button::border(Some(icon::plus_icon()), "New public key") + button::secondary(Some(icon::plus_icon()), "New public key") .on_press(Message::Select(i)) } else { - button::border(Some(icon::plus_icon()), "New public key") + button::secondary(Some(icon::plus_icon()), "New public key") }) .padding(10), ) @@ -581,10 +575,7 @@ pub fn participate_xpub<'a>( .push_maybe(if network_valid { None } else { - Some( - text("A data directory already exists for this network") - .style(color::legacy::ALERT), - ) + Some(text("A data directory already exists for this network").style(color::RED)) }); layout( @@ -608,7 +599,7 @@ pub fn participate_xpub<'a>( .width(Length::Fill), ) .push( - button::border(Some(icon::reload_icon()), "Refresh") + button::secondary(Some(icon::reload_icon()), "Refresh") .on_press(Message::Reload), ), ) @@ -659,7 +650,7 @@ pub fn register_descriptor<'a>( .push(text(descriptor.clone()).small()) .push( Row::new().push(Column::new().width(Length::Fill)).push( - button::transparent_border(Some(icon::clipboard_icon()), "Copy") + button::secondary(Some(icon::clipboard_icon()), "Copy") .on_press(Message::Clibpboard(descriptor)), ), ) @@ -681,7 +672,7 @@ pub fn register_descriptor<'a>( .width(Length::Fill), ) .push( - button::border(Some(icon::reload_icon()), "Refresh") + button::secondary(Some(icon::reload_icon()), "Refresh") .on_press(Message::Reload), ), ) @@ -770,7 +761,7 @@ pub fn backup_descriptor<'a>( .push(text(descriptor.clone()).small()) .push( Row::new().push(Column::new().width(Length::Fill)).push( - button::transparent_border(Some(icon::clipboard_icon()), "Copy") + button::secondary(Some(icon::clipboard_icon()), "Copy") .on_press(Message::Clibpboard(descriptor)), ), ) @@ -848,16 +839,16 @@ pub fn define_bitcoin<'a>( Row::new() .spacing(10) .align_items(Alignment::Center) - .push(icon::circle_check_icon().style(color::legacy::SUCCESS)) - .push(text("Connection checked").style(color::legacy::SUCCESS)), + .push(icon::circle_check_icon().style(color::GREEN)) + .push(text("Connection checked").style(color::GREEN)), ) } else { Container::new( Row::new() .spacing(10) .align_items(Alignment::Center) - .push(icon::circle_cross_icon().style(color::legacy::ALERT)) - .push(text("Connection failed").style(color::legacy::ALERT)), + .push(icon::circle_cross_icon().style(color::RED)) + .push(text("Connection failed").style(color::RED)), ) } }) @@ -868,7 +859,7 @@ pub fn define_bitcoin<'a>( Row::new() .spacing(10) .push(Container::new( - button::border(None, "Check connection") + button::secondary(None, "Check connection") .on_press(Message::DefineBitcoind( message::DefineBitcoind::PingBitcoind, )) @@ -1066,7 +1057,7 @@ pub fn defined_sequence<'a>( Some( text("No two recovery paths may become available at the very same date.") .small() - .style(color::legacy::ALERT), + .style(color::RED), ) } else { None @@ -1104,7 +1095,7 @@ pub fn defined_sequence<'a>( .align_y(alignment::Vertical::Center), ) .push( - button::border(Some(icon::pencil_icon()), "Edit") + button::secondary(Some(icon::pencil_icon()), "Edit") .on_press(message::DefinePath::EditSequence), ) .spacing(15), @@ -1134,18 +1125,14 @@ pub fn undefined_descriptor_key<'a>() -> Element<'a, message::DefineKey> { Column::new() .spacing(15) .align_items(Alignment::Center) - .push( - icon::key_icon() - .style(color::DARK_GREY) - .size(30) - .width(Length::Units(50)), - ), + .push(icon::key_icon().size(30).width(Length::Units(50))), ) .height(Length::Fill) .align_y(alignment::Vertical::Center), ) .push( - button::border(Some(icon::pencil_icon()), "Set").on_press(message::DefineKey::Edit), + button::secondary(Some(icon::pencil_icon()), "Set") + .on_press(message::DefineKey::Edit), ) .push(Space::with_height(Length::Units(5))), ) @@ -1190,7 +1177,7 @@ pub fn defined_descriptor_key( ) .push( icon::circle_check_icon() - .style(color::legacy::SUCCESS) + .style(color::GREEN) .size(20) .width(Length::Units(50)), ), @@ -1200,7 +1187,9 @@ pub fn defined_descriptor_key( ) .height(Length::Fill), ) - .push(button::border(Some(icon::pencil_icon()), "Edit").on_press(message::DefineKey::Edit)) + .push( + button::secondary(Some(icon::pencil_icon()), "Edit").on_press(message::DefineKey::Edit), + ) .push(Space::with_height(Length::Units(5))); if !valid { @@ -1215,7 +1204,7 @@ pub fn defined_descriptor_key( .push( text("Key is for a different network") .small() - .style(color::legacy::ALERT), + .style(color::RED), ) .into() } else if duplicate_key { @@ -1227,7 +1216,7 @@ pub fn defined_descriptor_key( .height(Length::Units(150)) .width(Length::Units(150)), ) - .push(text("Duplicate key").small().style(color::legacy::ALERT)) + .push(text("Duplicate key").small().style(color::RED)) .into() } else if duplicate_name { Column::new() @@ -1238,7 +1227,7 @@ pub fn defined_descriptor_key( .height(Length::Units(150)) .width(Length::Units(150)), ) - .push(text("Duplicate name").small().style(color::legacy::ALERT)) + .push(text("Duplicate name").small().style(color::RED)) .into() } else { card::simple(col) @@ -1278,7 +1267,7 @@ pub fn edit_key_modal<'a>( .width(Length::Fill), ) .push( - button::border(Some(icon::reload_icon()), "Refresh") + button::secondary(Some(icon::reload_icon()), "Refresh") .on_press(Message::Reload), ), ) @@ -1306,7 +1295,7 @@ pub fn edit_key_modal<'a>( }) .width(Length::Fill) .on_press(Message::UseHotSigner) - .style(theme::Button::Secondary), + .style(theme::Button::Border), ) .width(Length::Fill), ) @@ -1354,11 +1343,15 @@ pub fn edit_key_modal<'a>( ) .push(text(&form_name.value)), ) - .push(button::border(Some(icon::pencil_icon()), "Edit").on_press( - Message::DefineDescriptor(message::DefineDescriptor::KeyModal( - message::ImportKeyModal::EditName, - )), - )), + .push( + button::secondary(Some(icon::pencil_icon()), "Edit").on_press( + Message::DefineDescriptor( + message::DefineDescriptor::KeyModal( + message::ImportKeyModal::EditName, + ), + ), + ), + ), ) } else if !form_xpub.value.is_empty() && form_xpub.valid { Column::new() @@ -1519,7 +1512,7 @@ fn hw_list_view( hw::unsupported_hardware_wallet(&kind.to_string(), version.as_ref()) } }) - .style(theme::Button::Secondary) + .style(theme::Button::Border) .width(Length::Fill); if !processing && hw.is_supported() { bttn = bttn.on_press(Message::Select(i)); @@ -1629,10 +1622,7 @@ pub fn recover_mnemonic<'a>( .width(Length::Units(100)), ) .push_maybe(if *valid { - Some( - icon::circle_check_icon() - .style(color::legacy::SUCCESS), - ) + Some(icon::circle_check_icon().style(color::GREEN)) } else { None }), @@ -1640,9 +1630,7 @@ pub fn recover_mnemonic<'a>( }, )) .push(Space::with_height(Length::Units(50))) - .push_maybe( - error.map(|e| card::invalid(text(e).style(color::legacy::ALERT))), - ), + .push_maybe(error.map(|e| card::invalid(text(e).style(color::RED)))), ) } else { None @@ -1651,7 +1639,7 @@ pub fn recover_mnemonic<'a>( Row::new() .spacing(10) .push( - button::border(None, "Import mnemonic") + button::secondary(None, "Import mnemonic") .on_press(Message::ImportMnemonic(true)) .width(Length::Units(200)), ) @@ -1664,7 +1652,7 @@ pub fn recover_mnemonic<'a>( Row::new() .spacing(10) .push( - button::border(None, "Cancel") + button::secondary(None, "Cancel") .on_press(Message::ImportMnemonic(false)) .width(Length::Units(200)), ) diff --git a/gui/src/launcher.rs b/gui/src/launcher.rs index d92452ab..94a6ab26 100644 --- a/gui/src/launcher.rs +++ b/gui/src/launcher.rs @@ -114,7 +114,7 @@ impl Launcher { .on_press(ViewMessage::Check(*choice)) .padding(10) .width(Length::Fill) - .style(theme::Button::Secondary), + .style(theme::Button::Border), ) }, ) diff --git a/gui/src/main.rs b/gui/src/main.rs index dd8cabc0..a6f93647 100644 --- a/gui/src/main.rs +++ b/gui/src/main.rs @@ -9,7 +9,7 @@ extern crate serde; extern crate serde_json; use liana::{config::Config as DaemonConfig, miniscript::bitcoin}; -use liana_ui::{component::text, font, theme, widget::Element}; +use liana_ui::{component::text, font, image, theme, widget::Element}; use liana_gui::{ app::{ @@ -386,6 +386,8 @@ fn main() -> Result<(), Box> { setup_panic_hook(); let mut settings = Settings::with_flags(config); + settings.id = Some("liana-gui".to_string()); + settings.window.icon = Some(image::liana_app_icon()); settings.default_text_size = text::P1_SIZE; settings.default_font = Some(font::REGULAR_BYTES); settings.exit_on_close_request = false; diff --git a/gui/ui/Cargo.toml b/gui/ui/Cargo.toml index fc68b0d7..227e7220 100644 --- a/gui/ui/Cargo.toml +++ b/gui/ui/Cargo.toml @@ -6,6 +6,6 @@ edition = "2021" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html [dependencies] -iced = "0.7" +iced = { version = "0.7", features = ["svg", "image"] } iced_native = "0.8" iced_lazy = { version = "0.4"} diff --git a/gui/ui/examples/design-system/src/main.rs b/gui/ui/examples/design-system/src/main.rs index 56231b2b..f30d19ec 100644 --- a/gui/ui/examples/design-system/src/main.rs +++ b/gui/ui/examples/design-system/src/main.rs @@ -1,8 +1,8 @@ mod section; -use iced::widget::{button, column, container, row, text, Space}; +use iced::widget::{button, column, container, row, scrollable, text, Space}; use iced::{executor, Application, Command, Length, Settings, Subscription}; -use liana_ui::{component::text::*, theme, widget::*}; +use liana_ui::{component::text::*, image, theme, widget::*}; pub fn main() -> iced::Result { let mut settings = Settings::with_flags(Config {}); @@ -100,6 +100,7 @@ impl Application for DesignSystem { fn view(&self) -> Element { let sidebar = container( column![ + image::liana_grey_logo(), Space::with_height(Length::Units(100)), self.sections.iter().enumerate().fold( Column::new().spacing(10), @@ -107,13 +108,9 @@ impl Application for DesignSystem { button( container(text(section.title())) .width(Length::Fill) - .padding(5) + .padding(10) ) - .style(if i == self.current { - theme::Button::Primary - } else { - theme::Button::Transparent - }) + .style(theme::Button::Menu(i == self.current)) .on_press(Message::Section(i)) .width(Length::Units(200)) ) @@ -128,10 +125,10 @@ impl Application for DesignSystem { container(row![ sidebar.width(Length::Units(200)), Space::with_width(Length::Units(150)), - column![ + scrollable(column![ Space::with_height(Length::Units(150)), container(self.sections[self.current].view()).width(Length::Fill) - ] + ]), ]) .width(Length::Fill) .height(Length::Fill) diff --git a/gui/ui/examples/design-system/src/section.rs b/gui/ui/examples/design-system/src/section.rs index 058f0484..00c1a247 100644 --- a/gui/ui/examples/design-system/src/section.rs +++ b/gui/ui/examples/design-system/src/section.rs @@ -46,9 +46,14 @@ impl Section for Colors { color_row(color::BLACK, "BLACK (0,0,0)"), color_row(color::LIGHT_BLACK, "LIGHT_BLACK #141414 original design"), color_row(color::GREEN, "GREEN #00FF66 original design"), - color_row(color::DARK_GREY, "DARK_GREY #555555"), - color_row(color::GREY, "GREY #CCCCCC original design"), - color_row(color::LIGHT_GREY, "LIGHT_GREY #E6E6E6 original design"), + color_row(color::GREY_7, "GREY #3F3F3F"), + color_row(color::GREY_6, "GREY #202020"), + color_row(color::GREY_5, "GREY #272727"), + color_row(color::GREY_4, "GREY #424242"), + color_row(color::GREY_3, "GREY #717171"), + color_row(color::GREY_2, "GREY #CCCCCC"), + color_row(color::GREY_1, "GREY #E6E6E6"), + color_row(color::WHITE, "WHITE #FFFFFF"), color_row(color::RED, "RED #F04359"), color_row(color::ORANGE, "ORANGE #FFa700") ] @@ -134,7 +139,9 @@ impl Section for Buttons { button_row(theme::Button::Primary, "Primary"), button_row(theme::Button::Secondary, "Secondary"), button_row(theme::Button::Destructive, "Destructive"), - button_row(theme::Button::Transparent, "Transparent") + button_row(theme::Button::Transparent, "Transparent"), + button_row(theme::Button::TransparentBorder, "Transparent Border"), + button_row(theme::Button::Border, "Border"), ] .spacing(20) ] @@ -177,7 +184,7 @@ impl Section for HardwareWallets { .width(Length::Units(500)) ) .on_press(Message::Ignore) - .style(theme::Button::Secondary), + .style(theme::Button::Border), button( hw::supported_hardware_wallet( "ledger", @@ -188,7 +195,7 @@ impl Section for HardwareWallets { .width(Length::Units(500)) ) .on_press(Message::Ignore) - .style(theme::Button::Secondary), + .style(theme::Button::Border), button( hw::unregistered_hardware_wallet( "ledger", @@ -199,13 +206,13 @@ impl Section for HardwareWallets { .width(Length::Units(500)) ) .on_press(Message::Ignore) - .style(theme::Button::Secondary), + .style(theme::Button::Border), button( hw::unsupported_hardware_wallet("ledger", Some("v2.1.0")) .width(Length::Units(500)) ) .on_press(Message::Ignore) - .style(theme::Button::Secondary), + .style(theme::Button::Border), button( hw::processing_hardware_wallet( "ledger", @@ -216,7 +223,7 @@ impl Section for HardwareWallets { .width(Length::Units(500)) ) .on_press(Message::Ignore) - .style(theme::Button::Secondary), + .style(theme::Button::Border), button( hw::sign_success_hardware_wallet( "ledger", @@ -227,7 +234,7 @@ impl Section for HardwareWallets { .width(Length::Units(500)) ) .on_press(Message::Ignore) - .style(theme::Button::Secondary), + .style(theme::Button::Border), button( hw::registration_success_hardware_wallet( "ledger", @@ -238,7 +245,7 @@ impl Section for HardwareWallets { .width(Length::Units(500)) ) .on_press(Message::Ignore) - .style(theme::Button::Secondary), + .style(theme::Button::Border), ] .spacing(20) ] diff --git a/gui/ui/src/color.rs b/gui/ui/src/color.rs index bfb37d71..e9e8b669 100644 --- a/gui/ui/src/color.rs +++ b/gui/ui/src/color.rs @@ -1,126 +1,56 @@ use iced::Color; - pub const BLACK: Color = iced::Color::BLACK; - pub const LIGHT_BLACK: Color = Color::from_rgb( 0x14 as f32 / 255.0, 0x14 as f32 / 255.0, 0x14 as f32 / 255.0, ); - +pub const GREY_7: Color = Color::from_rgb( + 0x3F as f32 / 255.0, + 0x3F as f32 / 255.0, + 0x3F as f32 / 255.0, +); +pub const GREY_6: Color = Color::from_rgb( + 0x20 as f32 / 255.0, + 0x20 as f32 / 255.0, + 0x20 as f32 / 255.0, +); +pub const GREY_5: Color = Color::from_rgb( + 0x27 as f32 / 255.0, + 0x27 as f32 / 255.0, + 0x27 as f32 / 255.0, +); +pub const GREY_4: Color = Color::from_rgb( + 0x42 as f32 / 255.0, + 0x42 as f32 / 255.0, + 0x42 as f32 / 255.0, +); +pub const GREY_3: Color = Color::from_rgb( + 0x71 as f32 / 255.0, + 0x71 as f32 / 255.0, + 0x71 as f32 / 255.0, +); +pub const GREY_2: Color = Color::from_rgb( + 0xCC as f32 / 255.0, + 0xCC as f32 / 255.0, + 0xCC as f32 / 255.0, +); +pub const GREY_1: Color = Color::from_rgb( + 0xE6 as f32 / 255.0, + 0xE6 as f32 / 255.0, + 0xE6 as f32 / 255.0, +); +pub const WHITE: Color = iced::Color::WHITE; pub const GREEN: Color = Color::from_rgb( 0x00 as f32 / 255.0, 0xFF as f32 / 255.0, 0x66 as f32 / 255.0, ); - -pub const DARK_GREY: Color = Color::from_rgb( - 0x55 as f32 / 255.0, - 0x55 as f32 / 255.0, - 0x55 as f32 / 255.0, -); - -pub const GREY: Color = Color::from_rgb( - 0xCC as f32 / 255.0, - 0xCC as f32 / 255.0, - 0xCC as f32 / 255.0, -); - -pub const LIGHT_GREY: Color = Color::from_rgb( - 0xE6 as f32 / 255.0, - 0xE6 as f32 / 255.0, - 0xE6 as f32 / 255.0, -); - pub const RED: Color = Color::from_rgb( - 0xF0 as f32 / 255.0, - 0x43 as f32 / 255.0, - 0x59 as f32 / 255.0, + 0xE2 as f32 / 255.0, + 0x4E as f32 / 255.0, + 0x1B as f32 / 255.0, ); pub const ORANGE: Color = Color::from_rgb(0xFF as f32 / 255.0, 0xa7 as f32 / 255.0, 0x0 as f32 / 255.0); - -pub mod legacy { - use iced::Color; - - pub const BACKGROUND: Color = Color::from_rgb( - 0xF6 as f32 / 255.0, - 0xF7 as f32 / 255.0, - 0xF8 as f32 / 255.0, - ); - - pub const BORDER_GREY: Color = Color::from_rgb( - 0xd0 as f32 / 255.0, - 0xd7 as f32 / 255.0, - 0xde as f32 / 255.0, - ); - - pub const FOREGROUND: Color = Color::WHITE; - - pub const PRIMARY: Color = Color::BLACK; - - pub const SECONDARY: Color = DARK_GREY; - - pub const SUCCESS: Color = Color::from_rgb( - 0x29 as f32 / 255.0, - 0xBC as f32 / 255.0, - 0x97 as f32 / 255.0, - ); - - #[allow(dead_code)] - pub const SUCCESS_LIGHT: Color = Color::from_rgba( - 0x29 as f32 / 255.0, - 0xBC as f32 / 255.0, - 0x97 as f32 / 255.0, - 0.5f32, - ); - - pub const ALERT: Color = Color::from_rgb( - 0xF0 as f32 / 255.0, - 0x43 as f32 / 255.0, - 0x59 as f32 / 255.0, - ); - - pub const ALERT_LIGHT: Color = Color::from_rgba( - 0xF0 as f32 / 255.0, - 0x43 as f32 / 255.0, - 0x59 as f32 / 255.0, - 0.5f32, - ); - - pub const WARNING: Color = - Color::from_rgb(0xFF as f32 / 255.0, 0xa7 as f32 / 255.0, 0x0 as f32 / 255.0); - - pub const WARNING_LIGHT: Color = Color::from_rgba( - 0xFF as f32 / 255.0, - 0xa7 as f32 / 255.0, - 0x0 as f32 / 255.0, - 0.5f32, - ); - - pub const CANCEL: Color = Color::from_rgb( - 0x34 as f32 / 255.0, - 0x37 as f32 / 255.0, - 0x3D as f32 / 255.0, - ); - - pub const INFO: Color = Color::from_rgb( - 0x2A as f32 / 255.0, - 0x98 as f32 / 255.0, - 0xBD as f32 / 255.0, - ); - - pub const INFO_LIGHT: Color = Color::from_rgba( - 0x2A as f32 / 255.0, - 0x98 as f32 / 255.0, - 0xBD as f32 / 255.0, - 0.5f32, - ); - - pub const DARK_GREY: Color = Color::from_rgb( - 0x8c as f32 / 255.0, - 0x97 as f32 / 255.0, - 0xa6 as f32 / 255.0, - ); -} diff --git a/gui/ui/src/component/button.rs b/gui/ui/src/component/button.rs index 75503444..391a3318 100644 --- a/gui/ui/src/component/button.rs +++ b/gui/ui/src/component/button.rs @@ -4,6 +4,14 @@ use iced::{Alignment, Length}; use super::text::text; +pub fn menu<'a, T: 'a>(icon: Option>, t: &'static str) -> Button<'a, T> { + button::Button::new(content(icon, t).padding(10)).style(theme::Button::Menu(false)) +} + +pub fn menu_active<'a, T: 'a>(icon: Option>, t: &'static str) -> Button<'a, T> { + button::Button::new(content(icon, t).padding(10)).style(theme::Button::Menu(true)) +} + pub fn alert<'a, T: 'a>(icon: Option>, t: &'static str) -> Button<'a, T> { button::Button::new(content(icon, t)).style(theme::Button::Destructive) } @@ -16,10 +24,14 @@ pub fn transparent<'a, T: 'a>(icon: Option>, t: &'static str) -> Button button::Button::new(content(icon, t)).style(theme::Button::Transparent) } -pub fn border<'a, T: 'a>(icon: Option>, t: &'static str) -> Button<'a, T> { +pub fn secondary<'a, T: 'a>(icon: Option>, t: &'static str) -> Button<'a, T> { button::Button::new(content(icon, t)).style(theme::Button::Secondary) } +pub fn border<'a, T: 'a>(icon: Option>, t: &'static str) -> Button<'a, T> { + button::Button::new(content(icon, t)).style(theme::Button::Border) +} + pub fn transparent_border<'a, T: 'a>(icon: Option>, t: &'static str) -> Button<'a, T> { button(content(icon, t)).style(theme::Button::TransparentBorder) } diff --git a/gui/ui/src/component/card.rs b/gui/ui/src/component/card.rs index 965bed73..7877a05f 100644 --- a/gui/ui/src/component/card.rs +++ b/gui/ui/src/component/card.rs @@ -32,8 +32,8 @@ pub fn error<'a, T: 'a>(message: &'static str, error: String) -> Container<'a, T Row::new() .spacing(20) .align_items(iced::Alignment::Center) - .push(icon::warning_icon().style(color::legacy::ALERT)) - .push(text(message).style(color::legacy::ALERT)), + .push(icon::warning_icon().style(color::RED)) + .push(text(message).style(color::RED)), error, iced::widget::tooltip::Position::Bottom, ) diff --git a/gui/ui/src/component/form.rs b/gui/ui/src/component/form.rs index cd67b10c..7c339f4a 100644 --- a/gui/ui/src/component/form.rs +++ b/gui/ui/src/component/form.rs @@ -74,7 +74,7 @@ impl<'a, Message: 'a + Clone> From> for Element<'a, Message> { }) .push_maybe(if !form.valid { form.warning - .map(|message| text::caption(message).style(color::legacy::ALERT)) + .map(|message| text::caption(message).style(color::RED)) } else { None }) diff --git a/gui/ui/src/component/hw.rs b/gui/ui/src/component/hw.rs index 475f7f29..67acd4f4 100644 --- a/gui/ui/src/component/hw.rs +++ b/gui/ui/src/component/hw.rs @@ -121,9 +121,7 @@ pub fn selected_hardware_wallet<'a, T: 'a, K: Display, V: Display, F: Display>( ]) .width(Length::Fill) .into(), - icon::circle_check_icon() - .style(color::legacy::SUCCESS) - .into(), + icon::circle_check_icon().style(color::GREEN).into(), ]) .align_items(Alignment::Center), ) @@ -153,12 +151,8 @@ pub fn sign_success_hardware_wallet<'a, T: 'a, K: Display, V: Display, F: Displa .width(Length::Fill) .into(), row(vec![ - icon::circle_check_icon() - .style(color::legacy::SUCCESS) - .into(), - text::p1_regular("Signed") - .style(color::legacy::SUCCESS) - .into(), + icon::circle_check_icon().style(color::GREEN).into(), + text::p1_regular("Signed").style(color::GREEN).into(), ]) .align_items(Alignment::Center) .spacing(5) @@ -192,12 +186,8 @@ pub fn registration_success_hardware_wallet<'a, T: 'a, K: Display, V: Display, F .width(Length::Fill) .into(), row(vec![ - icon::circle_check_icon() - .style(color::legacy::SUCCESS) - .into(), - text::p1_regular("Registered") - .style(color::legacy::SUCCESS) - .into(), + icon::circle_check_icon().style(color::GREEN).into(), + text::p1_regular("Registered").style(color::GREEN).into(), ]) .align_items(Alignment::Center) .spacing(5) @@ -260,12 +250,8 @@ pub fn sign_success_hot_signer<'a, T: 'a, F: Display>( .width(Length::Fill) .into(), row(vec![ - icon::circle_check_icon() - .style(color::legacy::SUCCESS) - .into(), - text::p1_regular("Signed") - .style(color::legacy::SUCCESS) - .into(), + icon::circle_check_icon().style(color::GREEN).into(), + text::p1_regular("Signed").style(color::GREEN).into(), ]) .align_items(Alignment::Center) .spacing(5) @@ -298,9 +284,7 @@ pub fn selected_hot_signer<'a, T: 'a, F: Display>( ]) .width(Length::Fill) .into(), - icon::circle_check_icon() - .style(color::legacy::SUCCESS) - .into(), + icon::circle_check_icon().style(color::GREEN).into(), ]) .align_items(Alignment::Center), ) diff --git a/gui/ui/src/component/notification.rs b/gui/ui/src/component/notification.rs index 071a4044..9a2cef65 100644 --- a/gui/ui/src/component/notification.rs +++ b/gui/ui/src/component/notification.rs @@ -1,4 +1,5 @@ use crate::{ + color, component::{collapse, text}, icon, theme, widget::*, @@ -12,14 +13,16 @@ pub fn warning<'a, T: 'a + Clone>(message: String, error: String) -> Container<' Button::new( Row::new() .push( - Container::new(text::p1_bold(message_clone.to_string())) - .width(Length::Fill), + Container::new( + text::p1_bold(message_clone.to_string()).style(color::WHITE), + ) + .width(Length::Fill), ) .push( Row::new() .align_items(Alignment::Center) .spacing(10) - .push(text::p1_bold("Learn more")) + .push(text::p1_bold("Learn more").style(color::WHITE)) .push(icon::collapse_icon()), ), ) @@ -28,12 +31,15 @@ pub fn warning<'a, T: 'a + Clone>(message: String, error: String) -> Container<' move || { Button::new( Row::new() - .push(Container::new(text::p1_bold(message.to_owned())).width(Length::Fill)) + .push( + Container::new(text::p1_bold(message.to_owned()).style(color::WHITE)) + .width(Length::Fill), + ) .push( Row::new() .align_items(Alignment::Center) .spacing(10) - .push(text::p1_bold("Learn more")) + .push(text::p1_bold("Learn more").style(color::WHITE)) .push(icon::collapsed_icon()), ), ) diff --git a/gui/ui/src/image.rs b/gui/ui/src/image.rs new file mode 100644 index 00000000..55783f6a --- /dev/null +++ b/gui/ui/src/image.rs @@ -0,0 +1,14 @@ +use crate::widget::Svg; +use iced::{widget::svg::Handle, window::icon}; + +const LIANA_APP_ICON: &[u8] = include_bytes!("../static/logos/liana-app-icon.png"); +const LIANA_LOGO_GREY: &[u8] = include_bytes!("../static/logos/LIANA_SYMBOL_Gray.svg"); + +pub fn liana_app_icon() -> icon::Icon { + icon::Icon::from_file_data(LIANA_APP_ICON, None).unwrap() +} + +pub fn liana_grey_logo() -> Svg { + let h = Handle::from_memory(LIANA_LOGO_GREY.to_vec()); + Svg::new(h) +} diff --git a/gui/ui/src/lib.rs b/gui/ui/src/lib.rs index ac38dd55..213df10f 100644 --- a/gui/ui/src/lib.rs +++ b/gui/ui/src/lib.rs @@ -2,6 +2,7 @@ pub mod color; pub mod component; pub mod font; pub mod icon; +pub mod image; pub mod theme; pub mod util; @@ -20,4 +21,5 @@ pub mod widget { pub type ProgressBar = iced::widget::ProgressBar; pub type PickList<'a, Message> = iced::widget::PickList<'a, Message, Renderer>; pub type Scrollable<'a, Message> = iced::widget::Scrollable<'a, Message, Renderer>; + pub type Svg = iced::widget::Svg; } diff --git a/gui/ui/src/theme.rs b/gui/ui/src/theme.rs index 27cead64..6ca688a0 100644 --- a/gui/ui/src/theme.rs +++ b/gui/ui/src/theme.rs @@ -1,7 +1,7 @@ use iced::{ application, widget::{ - button, checkbox, container, pick_list, progress_bar, radio, scrollable, slider, text, + button, checkbox, container, pick_list, progress_bar, radio, scrollable, slider, svg, text, text_input, }, }; @@ -10,10 +10,9 @@ use super::color; #[derive(Debug, Copy, Clone, Eq, PartialEq, Default)] pub enum Theme { + #[default] Dark, Light, - #[default] - Legacy, } impl application::StyleSheet for Theme { @@ -22,16 +21,12 @@ impl application::StyleSheet for Theme { fn appearance(&self, _style: &Self::Style) -> application::Appearance { match self { Theme::Light => application::Appearance { - background_color: color::LIGHT_GREY, + background_color: color::GREY_2, text_color: color::LIGHT_BLACK, }, Theme::Dark => application::Appearance { background_color: color::LIGHT_BLACK, - text_color: color::LIGHT_GREY, - }, - Theme::Legacy => application::Appearance { - background_color: color::legacy::BACKGROUND, - text_color: color::BLACK, + text_color: color::WHITE, }, } } @@ -47,12 +42,12 @@ impl iced::overlay::menu::StyleSheet for Theme { fn appearance(&self, _style: &Self::Style) -> iced::overlay::menu::Appearance { iced::overlay::menu::Appearance { - text_color: color::BLACK, - background: color::LIGHT_GREY.into(), - border_width: 1.0, - border_radius: 0.0, - border_color: color::LIGHT_GREY, - selected_text_color: color::BLACK, + text_color: color::GREY_2, + background: color::GREY_6.into(), + border_width: 0.0, + border_radius: 25.0, + border_color: color::GREY_2, + selected_text_color: color::LIGHT_BLACK, selected_background: color::GREEN.into(), } } @@ -110,11 +105,11 @@ impl container::StyleSheet for Theme { ..container::Appearance::default() }, Container::Background => container::Appearance { - background: color::LIGHT_GREY.into(), + background: color::GREY_2.into(), ..container::Appearance::default() }, Container::Foreground => container::Appearance { - background: color::GREY.into(), + background: color::GREY_2.into(), ..container::Appearance::default() }, Container::Border => container::Appearance { @@ -147,34 +142,7 @@ impl container::StyleSheet for Theme { Container::Border => container::Appearance { background: iced::Color::TRANSPARENT.into(), border_width: 1.0, - border_color: color::LIGHT_GREY, - ..container::Appearance::default() - }, - Container::Card(c) => c.appearance(self), - Container::Badge(c) => c.appearance(self), - Container::Pill(c) => c.appearance(self), - Container::Custom(c) => container::Appearance { - background: (*c).into(), - ..container::Appearance::default() - }, - }, - Theme::Legacy => match style { - Container::Transparent => container::Appearance { - background: iced::Color::TRANSPARENT.into(), - ..container::Appearance::default() - }, - Container::Background => container::Appearance { - background: color::legacy::BACKGROUND.into(), - ..container::Appearance::default() - }, - Container::Foreground => container::Appearance { - background: color::legacy::FOREGROUND.into(), - ..container::Appearance::default() - }, - Container::Border => container::Appearance { - background: iced::Color::TRANSPARENT.into(), - border_width: 1.0, - border_color: color::legacy::BORDER_GREY, + border_color: color::GREY_3, ..container::Appearance::default() }, Container::Card(c) => c.appearance(self), @@ -222,25 +190,25 @@ impl Card { match theme { Theme::Light => match self { Card::Simple => container::Appearance { - background: color::GREY.into(), + background: color::GREY_2.into(), ..container::Appearance::default() }, Card::Border => container::Appearance { background: iced::Color::TRANSPARENT.into(), border_radius: 10.0, - border_color: color::GREY, + border_color: color::GREY_2, border_width: 1.0, ..container::Appearance::default() }, Card::Invalid => container::Appearance { - background: color::GREY.into(), + background: color::GREY_2.into(), text_color: color::BLACK.into(), border_width: 1.0, border_color: color::RED, ..container::Appearance::default() }, Card::Error => container::Appearance { - background: color::GREY.into(), + background: color::GREY_2.into(), text_color: color::RED.into(), border_width: 1.0, border_color: color::RED, @@ -248,28 +216,29 @@ impl Card { }, Card::Warning => container::Appearance { background: color::ORANGE.into(), - text_color: color::GREY.into(), + text_color: color::GREY_2.into(), ..container::Appearance::default() }, }, Theme::Dark => match self { Card::Simple => container::Appearance { - background: color::LIGHT_BLACK.into(), + background: color::GREY_6.into(), + border_radius: 25.0, ..container::Appearance::default() }, Card::Border => container::Appearance { background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_color: color::LIGHT_GREY, + border_radius: 25.0, + border_color: color::GREY_5, border_width: 1.0, ..container::Appearance::default() }, Card::Invalid => container::Appearance { background: color::LIGHT_BLACK.into(), - text_color: color::BLACK.into(), + text_color: color::RED.into(), border_width: 1.0, + border_radius: 25.0, border_color: color::RED, - ..container::Appearance::default() }, Card::Error => container::Appearance { background: color::LIGHT_BLACK.into(), @@ -280,44 +249,7 @@ impl Card { }, Card::Warning => container::Appearance { background: color::ORANGE.into(), - text_color: color::GREY.into(), - ..container::Appearance::default() - }, - }, - Theme::Legacy => match self { - Card::Simple => container::Appearance { - background: color::legacy::FOREGROUND.into(), - border_radius: 10.0, - border_color: color::legacy::BORDER_GREY, - border_width: 1.0, - ..container::Appearance::default() - }, - Card::Border => container::Appearance { - background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_color: color::legacy::BORDER_GREY, - border_width: 1.0, - ..container::Appearance::default() - }, - Card::Invalid => container::Appearance { - background: color::legacy::FOREGROUND.into(), - text_color: iced::Color::BLACK.into(), - border_width: 1.0, - border_radius: 10.0, - border_color: color::legacy::ALERT, - }, - Card::Error => container::Appearance { - background: color::legacy::FOREGROUND.into(), - text_color: color::legacy::ALERT.into(), - border_width: 1.0, - border_radius: 10.0, - border_color: color::legacy::ALERT, - }, - Card::Warning => container::Appearance { - border_radius: 0.0, - text_color: iced::Color::BLACK.into(), - background: color::legacy::WARNING.into(), - border_color: color::legacy::WARNING, + text_color: color::WHITE.into(), ..container::Appearance::default() }, }, @@ -337,12 +269,12 @@ impl Badge { match self { Self::Standard => container::Appearance { border_radius: 40.0, - background: color::legacy::BACKGROUND.into(), + background: color::GREY_4.into(), ..container::Appearance::default() }, Self::Bitcoin => container::Appearance { border_radius: 40.0, - background: color::legacy::WARNING.into(), + background: color::ORANGE.into(), text_color: iced::Color::WHITE.into(), ..container::Appearance::default() }, @@ -354,7 +286,6 @@ impl Badge { pub enum Pill { #[default] Simple, - InversePrimary, Primary, Success, } @@ -363,27 +294,21 @@ impl Pill { fn appearance(&self, _theme: &Theme) -> iced::widget::container::Appearance { match self { Self::Primary => container::Appearance { - background: color::legacy::PRIMARY.into(), - border_radius: 10.0, - text_color: iced::Color::WHITE.into(), - ..container::Appearance::default() - }, - Self::InversePrimary => container::Appearance { - background: color::legacy::FOREGROUND.into(), - border_radius: 10.0, - text_color: color::legacy::PRIMARY.into(), + background: color::GREEN.into(), + border_radius: 25.0, + text_color: color::LIGHT_BLACK.into(), ..container::Appearance::default() }, Self::Success => container::Appearance { - background: color::legacy::SUCCESS.into(), - border_radius: 10.0, - text_color: iced::Color::WHITE.into(), + background: color::GREEN.into(), + border_radius: 25.0, + text_color: color::LIGHT_BLACK.into(), ..container::Appearance::default() }, Self::Simple => container::Appearance { - background: color::legacy::BACKGROUND.into(), - border_radius: 10.0, - text_color: iced::Color::BLACK.into(), + background: color::GREEN.into(), + border_radius: 25.0, + text_color: color::LIGHT_BLACK.into(), ..container::Appearance::default() }, } @@ -424,10 +349,10 @@ impl scrollable::StyleSheet for Theme { scrollable::Scrollbar { background: None, border_width: 0.0, - border_color: color::legacy::BORDER_GREY, + border_color: color::GREY_7, border_radius: 10.0, scroller: scrollable::Scroller { - color: color::legacy::BORDER_GREY, + color: color::GREY_7, border_radius: 10.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, @@ -453,21 +378,21 @@ impl pick_list::StyleSheet for Theme { fn active(&self, style: &Self::Style) -> pick_list::Appearance { match style { PickList::Simple => pick_list::Appearance { - placeholder_color: color::legacy::FOREGROUND, - handle_color: color::legacy::FOREGROUND, - background: color::legacy::FOREGROUND.into(), + placeholder_color: color::GREY_6, + handle_color: color::GREY_6, + background: color::GREEN.into(), border_width: 1.0, - border_color: color::legacy::BORDER_GREY, - border_radius: 10.0, + border_color: color::GREY_7, + border_radius: 25.0, text_color: iced::Color::BLACK, }, PickList::Invalid => pick_list::Appearance { - placeholder_color: color::legacy::FOREGROUND, - handle_color: color::legacy::FOREGROUND, - background: color::legacy::FOREGROUND.into(), + placeholder_color: color::GREY_6, + handle_color: color::GREY_6, + background: color::GREY_6.into(), border_width: 1.0, - border_color: color::legacy::ALERT, - border_radius: 10.0, + border_color: color::RED, + border_radius: 25.0, text_color: iced::Color::BLACK, }, } @@ -488,7 +413,7 @@ impl checkbox::StyleSheet for Theme { checkbox::Appearance { background: iced::Color::TRANSPARENT.into(), border_width: 1.0, - border_color: color::GREY, + border_color: color::GREY_7, checkmark_color: color::GREEN, text_color: None, border_radius: 0.0, @@ -509,6 +434,8 @@ pub enum Button { Destructive, Transparent, TransparentBorder, + Border, + Menu(bool), } impl button::StyleSheet for Theme { @@ -516,168 +443,89 @@ impl button::StyleSheet for Theme { fn active(&self, style: &Self::Style) -> button::Appearance { match self { - Theme::Light => match style { - Button::Primary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::LIGHT_BLACK.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, - }, - Button::Secondary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_width: 1.0, - border_color: color::DARK_GREY, - text_color: color::LIGHT_BLACK, - }, - Button::Destructive => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::RED.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, - }, - Button::Transparent | Button::TransparentBorder => button::Appearance { - shadow_offset: iced::Vector::default(), - background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_BLACK, - }, - }, + Theme::Light => button::Appearance::default(), Theme::Dark => match style { Button::Primary => button::Appearance { shadow_offset: iced::Vector::default(), - background: color::GREY.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_BLACK, - }, - Button::Secondary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::LIGHT_BLACK.into(), - border_radius: 10.0, + background: iced::Color::TRANSPARENT.into(), + border_radius: 25.0, border_width: 1.0, - border_color: color::LIGHT_GREY, - text_color: color::LIGHT_GREY, + border_color: color::GREY_7, + text_color: color::GREY_2, + }, + Button::Secondary | Button::Border => button::Appearance { + shadow_offset: iced::Vector::default(), + background: iced::Color::TRANSPARENT.into(), + border_radius: 25.0, + border_width: 1.0, + border_color: color::GREY_7, + text_color: color::GREY_2, }, Button::Destructive => button::Appearance { shadow_offset: iced::Vector::default(), - background: color::RED.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_BLACK, + background: iced::Color::TRANSPARENT.into(), + border_radius: 25.0, + border_width: 1.0, + border_color: color::RED, + text_color: color::RED, }, - Button::Transparent | Button::TransparentBorder => button::Appearance { + Button::Transparent => button::Appearance { shadow_offset: iced::Vector::default(), background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, + border_radius: 25.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, + text_color: color::GREY_2, }, - }, - Theme::Legacy => match style { - Button::Primary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::legacy::PRIMARY.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::legacy::FOREGROUND, - }, - Button::Destructive => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::legacy::FOREGROUND.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: color::legacy::ALERT, - text_color: color::legacy::ALERT, - }, - Button::Transparent | Button::TransparentBorder => button::Appearance { + Button::TransparentBorder => button::Appearance { shadow_offset: iced::Vector::default(), background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, + border_radius: 25.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, - text_color: iced::Color::BLACK, - }, - Button::Secondary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_width: 1.2, - border_color: color::legacy::BORDER_GREY, - text_color: iced::Color::BLACK, + text_color: color::WHITE, }, + Button::Menu(active) => { + if *active { + button::Appearance { + shadow_offset: iced::Vector::default(), + background: color::LIGHT_BLACK.into(), + border_radius: 25.0, + border_width: 0.0, + border_color: iced::Color::TRANSPARENT, + text_color: color::WHITE, + } + } else { + button::Appearance { + shadow_offset: iced::Vector::default(), + background: iced::Color::TRANSPARENT.into(), + border_radius: 25.0, + border_width: 0.0, + border_color: iced::Color::TRANSPARENT, + text_color: color::WHITE, + } + } + } }, } } fn hovered(&self, style: &Self::Style) -> button::Appearance { match self { - Theme::Light => match style { - Button::Primary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::LIGHT_BLACK.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, - }, - Button::Secondary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::LIGHT_BLACK.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, - }, - Button::Destructive => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::RED.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, - }, - Button::Transparent => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::DARK_GREY.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, - }, - Button::TransparentBorder => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::DARK_GREY.into(), - border_radius: 10.0, - border_width: 1.0, - border_color: color::LIGHT_BLACK, - text_color: color::LIGHT_GREY, - }, - }, + Theme::Light => button::Appearance::default(), Theme::Dark => match style { Button::Primary => button::Appearance { shadow_offset: iced::Vector::default(), - background: color::GREY.into(), - border_radius: 10.0, + background: color::GREEN.into(), + border_radius: 25.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, text_color: color::LIGHT_BLACK, }, Button::Secondary => button::Appearance { shadow_offset: iced::Vector::default(), - background: color::GREY.into(), - border_radius: 10.0, + background: color::GREEN.into(), + border_radius: 25.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, text_color: color::LIGHT_BLACK, @@ -685,68 +533,34 @@ impl button::StyleSheet for Theme { Button::Destructive => button::Appearance { shadow_offset: iced::Vector::default(), background: color::RED.into(), - border_radius: 10.0, + border_radius: 25.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, text_color: color::LIGHT_BLACK, }, Button::Transparent => button::Appearance { shadow_offset: iced::Vector::default(), - background: color::DARK_GREY.into(), - border_radius: 10.0, + background: color::GREY_7.into(), + border_radius: 25.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, - text_color: color::LIGHT_GREY, + text_color: color::GREY_2, }, - Button::TransparentBorder => button::Appearance { + Button::TransparentBorder | Button::Border => button::Appearance { shadow_offset: iced::Vector::default(), - background: color::DARK_GREY.into(), - border_radius: 10.0, + background: iced::Color::TRANSPARENT.into(), + border_radius: 25.0, border_width: 1.0, - border_color: color::LIGHT_GREY, - text_color: color::LIGHT_GREY, + border_color: color::GREEN, + text_color: color::WHITE, }, - }, - Theme::Legacy => match style { - Button::Primary => button::Appearance { + Button::Menu(_) => button::Appearance { shadow_offset: iced::Vector::default(), - background: color::legacy::PRIMARY.into(), - border_radius: 10.0, + background: color::LIGHT_BLACK.into(), + border_radius: 25.0, border_width: 0.0, border_color: iced::Color::TRANSPARENT, - text_color: color::legacy::FOREGROUND, - }, - Button::Destructive => button::Appearance { - shadow_offset: iced::Vector::default(), - background: color::legacy::FOREGROUND.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: color::legacy::ALERT, - text_color: color::legacy::ALERT, - }, - Button::Transparent => button::Appearance { - shadow_offset: iced::Vector::default(), - background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_width: 0.0, - border_color: iced::Color::TRANSPARENT, - text_color: iced::Color::BLACK, - }, - Button::TransparentBorder => button::Appearance { - shadow_offset: iced::Vector::default(), - background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_width: 1.0, - border_color: iced::Color::BLACK, - text_color: iced::Color::BLACK, - }, - Button::Secondary => button::Appearance { - shadow_offset: iced::Vector::default(), - background: iced::Color::TRANSPARENT.into(), - border_radius: 10.0, - border_width: 1.0, - border_color: iced::Color::BLACK, - text_color: iced::Color::BLACK, + text_color: color::WHITE, }, }, } @@ -765,16 +579,16 @@ impl text_input::StyleSheet for Theme { fn active(&self, style: &Self::Style) -> text_input::Appearance { match style { Form::Simple => text_input::Appearance { - background: iced::Background::Color(color::legacy::FOREGROUND), - border_radius: 5.0, + background: iced::Background::Color(iced::Color::TRANSPARENT), + border_radius: 25.0, border_width: 1.0, - border_color: color::legacy::DARK_GREY, + border_color: color::GREY_7, }, Form::Invalid => text_input::Appearance { - background: iced::Background::Color(color::legacy::FOREGROUND), - border_radius: 5.0, + background: iced::Background::Color(iced::Color::TRANSPARENT), + border_radius: 25.0, border_width: 1.0, - border_color: color::legacy::ALERT, + border_color: color::RED, }, } } @@ -786,15 +600,15 @@ impl text_input::StyleSheet for Theme { } fn placeholder_color(&self, _style: &Self::Style) -> iced::Color { - iced::Color::from_rgb(0.7, 0.7, 0.7) + color::GREY_7 } fn value_color(&self, _style: &Self::Style) -> iced::Color { - iced::Color::from_rgb(0.3, 0.3, 0.3) + color::GREY_2 } fn selection_color(&self, _style: &Self::Style) -> iced::Color { - iced::Color::from_rgb(0.8, 0.8, 1.0) + color::GREEN } } @@ -808,7 +622,7 @@ impl progress_bar::StyleSheet for Theme { type Style = ProgressBar; fn appearance(&self, _style: &Self::Style) -> progress_bar::Appearance { progress_bar::Appearance { - background: color::GREY.into(), + background: color::GREY_6.into(), bar: color::GREEN.into(), border_radius: 10.0, } @@ -829,7 +643,7 @@ impl slider::StyleSheet for Theme { width: 8, border_radius: 4.0, }, - color: color::legacy::FOREGROUND, + color: color::BLACK, border_color: color::GREEN, border_width: 1.0, }; @@ -869,3 +683,16 @@ impl slider::StyleSheet for Theme { } } } + +#[derive(Debug, Copy, Clone, Default)] +pub enum Svg { + #[default] + Simple, +} + +impl svg::StyleSheet for Theme { + type Style = ProgressBar; + fn appearance(&self, _style: &Self::Style) -> svg::Appearance { + svg::Appearance::default() + } +} diff --git a/gui/ui/static/logos/LIANA_BRAND_Black.svg b/gui/ui/static/logos/LIANA_BRAND_Black.svg new file mode 100644 index 00000000..f1676e08 --- /dev/null +++ b/gui/ui/static/logos/LIANA_BRAND_Black.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_BRAND_Gray.svg b/gui/ui/static/logos/LIANA_BRAND_Gray.svg new file mode 100644 index 00000000..19bc042e --- /dev/null +++ b/gui/ui/static/logos/LIANA_BRAND_Gray.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_BRAND_Green.svg b/gui/ui/static/logos/LIANA_BRAND_Green.svg new file mode 100644 index 00000000..d08f57e0 --- /dev/null +++ b/gui/ui/static/logos/LIANA_BRAND_Green.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_BRAND_Off-White.svg b/gui/ui/static/logos/LIANA_BRAND_Off-White.svg new file mode 100644 index 00000000..058c0c02 --- /dev/null +++ b/gui/ui/static/logos/LIANA_BRAND_Off-White.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_LOGOTYPE_Black.svg b/gui/ui/static/logos/LIANA_LOGOTYPE_Black.svg new file mode 100644 index 00000000..39ce4885 --- /dev/null +++ b/gui/ui/static/logos/LIANA_LOGOTYPE_Black.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_LOGOTYPE_Gray.svg b/gui/ui/static/logos/LIANA_LOGOTYPE_Gray.svg new file mode 100644 index 00000000..19e18b1c --- /dev/null +++ b/gui/ui/static/logos/LIANA_LOGOTYPE_Gray.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_LOGOTYPE_Green.svg b/gui/ui/static/logos/LIANA_LOGOTYPE_Green.svg new file mode 100644 index 00000000..8fd59a6d --- /dev/null +++ b/gui/ui/static/logos/LIANA_LOGOTYPE_Green.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_LOGOTYPE_Off-White.svg b/gui/ui/static/logos/LIANA_LOGOTYPE_Off-White.svg new file mode 100644 index 00000000..ae966500 --- /dev/null +++ b/gui/ui/static/logos/LIANA_LOGOTYPE_Off-White.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL-O_Black.svg b/gui/ui/static/logos/LIANA_SYMBOL-O_Black.svg new file mode 100644 index 00000000..7a728f81 --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL-O_Black.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL-O_Gray.svg b/gui/ui/static/logos/LIANA_SYMBOL-O_Gray.svg new file mode 100644 index 00000000..1f79965a --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL-O_Gray.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL-O_Green.svg b/gui/ui/static/logos/LIANA_SYMBOL-O_Green.svg new file mode 100644 index 00000000..f9a538f3 --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL-O_Green.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL-O_Off-White.svg b/gui/ui/static/logos/LIANA_SYMBOL-O_Off-White.svg new file mode 100644 index 00000000..3a0ce274 --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL-O_Off-White.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL_Black.svg b/gui/ui/static/logos/LIANA_SYMBOL_Black.svg new file mode 100644 index 00000000..4dc59023 --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL_Black.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL_Gray.svg b/gui/ui/static/logos/LIANA_SYMBOL_Gray.svg new file mode 100644 index 00000000..eefa8bb4 --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL_Gray.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL_Green.svg b/gui/ui/static/logos/LIANA_SYMBOL_Green.svg new file mode 100644 index 00000000..c6d2b319 --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL_Green.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/LIANA_SYMBOL_Off-White.svg b/gui/ui/static/logos/LIANA_SYMBOL_Off-White.svg new file mode 100644 index 00000000..0bbb2140 --- /dev/null +++ b/gui/ui/static/logos/LIANA_SYMBOL_Off-White.svg @@ -0,0 +1,12 @@ + + + + + + + + \ No newline at end of file diff --git a/gui/ui/static/logos/liana-app-icon.png b/gui/ui/static/logos/liana-app-icon.png new file mode 100644 index 00000000..bfa47574 Binary files /dev/null and b/gui/ui/static/logos/liana-app-icon.png differ diff --git a/gui/ui/static/logos/liana-app-icon.svg b/gui/ui/static/logos/liana-app-icon.svg new file mode 100644 index 00000000..753f6bef --- /dev/null +++ b/gui/ui/static/logos/liana-app-icon.svg @@ -0,0 +1,5 @@ + + + + +