From 4c08f4ae350f423896e9e6b8fe9ef0aa8ae66bde Mon Sep 17 00:00:00 2001 From: edouard Date: Tue, 9 May 2023 21:29:09 +0200 Subject: [PATCH] Add grey brand logo to installer and launcher --- gui/src/installer/view.rs | 143 +++++++++++++++++++++----------------- gui/src/launcher.rs | 119 ++++++++++++++++--------------- gui/ui/src/image.rs | 6 ++ 3 files changed, 149 insertions(+), 119 deletions(-) diff --git a/gui/src/installer/view.rs b/gui/src/installer/view.rs index 71862925..7a92976f 100644 --- a/gui/src/installer/view.rs +++ b/gui/src/installer/view.rs @@ -76,73 +76,92 @@ const NETWORKS: [Network; 4] = [ ]; pub fn welcome<'a>() -> Element<'a, Message> { - Container::new(Container::new( + Container::new( Column::new() + .push(Container::new(image::liana_brand_grey().width(Length::Units(200))).padding(100)) .push( - Row::new() - .align_items(Alignment::End) - .spacing(20) - .push( - Container::new( - Column::new() + Container::new( + Column::new() + .push( + Row::new() + .align_items(Alignment::End) .spacing(20) - .align_items(Alignment::Center) - .push(image::create_new_wallet_icon().width(Length::Units(100))) - .push(p1_regular("Create a new wallet").style(color::GREY_3)) .push( - button::secondary(None, "Select") - .width(Length::Units(200)) - .on_press(Message::CreateWallet), + Container::new( + Column::new() + .spacing(20) + .align_items(Alignment::Center) + .push( + image::create_new_wallet_icon() + .width(Length::Units(100)), + ) + .push( + p1_regular("Create a new wallet") + .style(color::GREY_3), + ) + .push( + button::secondary(None, "Select") + .width(Length::Units(200)) + .on_press(Message::CreateWallet), + ) + .align_items(Alignment::Center), + ) + .padding(20), ) - .align_items(Alignment::Center), + .push( + Container::new( + Column::new() + .spacing(20) + .align_items(Alignment::Center) + .push( + image::participate_in_new_wallet_icon() + .width(Length::Units(200)), + ) + .push( + p1_regular("Participate in new wallet") + .style(color::GREY_3), + ) + .push( + button::secondary(None, "Select") + .width(Length::Units(200)) + .on_press(Message::ParticipateWallet), + ) + .align_items(Alignment::Center), + ) + .padding(20), + ) + .push( + Container::new( + Column::new() + .spacing(20) + .align_items(Alignment::Center) + .push( + image::restore_wallet_icon() + .width(Length::Units(100)), + ) + .push( + p1_regular("Restore a wallet").style(color::GREY_3), + ) + .push( + button::secondary(None, "Select") + .width(Length::Units(200)) + .on_press(Message::ImportWallet), + ) + .align_items(Alignment::Center), + ) + .padding(20), + ), ) - .padding(20), - ) - .push( - Container::new( - Column::new() - .spacing(20) - .align_items(Alignment::Center) - .push( - image::participate_in_new_wallet_icon() - .width(Length::Units(200)), - ) - .push(p1_regular("Participate in new wallet").style(color::GREY_3)) - .push( - button::secondary(None, "Select") - .width(Length::Units(200)) - .on_press(Message::ParticipateWallet), - ) - .align_items(Alignment::Center), - ) - .padding(20), - ) - .push( - Container::new( - Column::new() - .spacing(20) - .align_items(Alignment::Center) - .push(image::restore_wallet_icon().width(Length::Units(100))) - .push(p1_regular("Restore a wallet").style(color::GREY_3)) - .push( - button::secondary(None, "Select") - .width(Length::Units(200)) - .on_press(Message::ImportWallet), - ) - .align_items(Alignment::Center), - ) - .padding(20), - ), - ) - .width(Length::Fill) - .height(Length::Fill) - .spacing(50) - .align_items(Alignment::Center), - )) - .center_y() - .center_x() - .height(Length::Fill) - .width(Length::Fill) + .push(Space::with_height(Length::Units(100))) + .spacing(50) + .align_items(Alignment::Center), + ) + .center_y() + .center_x() + .width(Length::Fill) + .height(Length::Fill), + ), + ) .into() } @@ -274,8 +293,6 @@ pub fn define_descriptor<'a>( ) .push_maybe(error.map(|e| card::error("Failed to create descriptor", e.to_string()))) .push(Space::with_height(Length::Units(20))) - .width(Length::Fill) - .height(Length::Fill) .spacing(50), false, ) diff --git a/gui/src/launcher.rs b/gui/src/launcher.rs index 94a6ab26..c8b0b8df 100644 --- a/gui/src/launcher.rs +++ b/gui/src/launcher.rs @@ -1,11 +1,11 @@ use std::path::PathBuf; -use iced::{Alignment, Command, Length, Subscription}; +use iced::{widget::Space, Alignment, Command, Length, Subscription}; use liana::{config::ConfigError, miniscript::bitcoin::Network}; use liana_ui::{ component::{badge, card, text::*}, - icon, theme, + icon, image, theme, util::*, widget::*, }; @@ -76,69 +76,76 @@ impl Launcher { pub fn view(&self) -> Element { Into::>::into( - Container::new( - Column::new() - .spacing(30) - .push(text("Welcome back").size(50).bold()) - .push_maybe(self.error.as_ref().map(|e| card::simple(text(e)))) - .push( - self.choices - .iter() - .fold( - Column::new() - .push(text("Select network:").small().bold()) - .spacing(10), - |col, choice| { - col.push( + Column::new() + .push( + Container::new(image::liana_brand_grey().width(Length::Units(200))) + .padding(100), + ) + .push( + Container::new( + Column::new() + .spacing(30) + .push(text("Welcome back").size(50).bold()) + .push_maybe(self.error.as_ref().map(|e| card::simple(text(e)))) + .push( + self.choices + .iter() + .fold( + Column::new() + .push(text("Select network:").small().bold()) + .spacing(10), + |col, choice| { + col.push( + Button::new( + Row::new() + .spacing(20) + .align_items(Alignment::Center) + .push( + badge::Badge::new(icon::bitcoin_icon()) + .style(match choice { + Network::Bitcoin => { + theme::Badge::Bitcoin + } + _ => theme::Badge::Standard, + }), + ) + .push(text(match choice { + Network::Bitcoin => "Bitcoin Mainnet", + Network::Testnet => "Bitcoin Testnet", + Network::Signet => "Bitcoin Signet", + Network::Regtest => "Bitcoin Regtest", + })), + ) + .on_press(ViewMessage::Check(*choice)) + .padding(10) + .width(Length::Fill) + .style(theme::Button::Border), + ) + }, + ) + .push( Button::new( Row::new() .spacing(20) .align_items(Alignment::Center) - .push( - badge::Badge::new(icon::bitcoin_icon()).style( - match choice { - Network::Bitcoin => { - theme::Badge::Bitcoin - } - _ => theme::Badge::Standard, - }, - ), - ) - .push(text(match choice { - Network::Bitcoin => "Bitcoin Mainnet", - Network::Testnet => "Bitcoin Testnet", - Network::Signet => "Bitcoin Signet", - Network::Regtest => "Bitcoin Regtest", - })), + .push(badge::Badge::new(icon::plus_icon())) + .push(text("Install Liana on another network")), ) - .on_press(ViewMessage::Check(*choice)) + .on_press(ViewMessage::StartInstall) .padding(10) .width(Length::Fill) - .style(theme::Button::Border), - ) - }, + .style(theme::Button::TransparentBorder), + ), ) - .push( - Button::new( - Row::new() - .spacing(20) - .align_items(Alignment::Center) - .push(badge::Badge::new(icon::plus_icon())) - .push(text("Install Liana on another network")), - ) - .on_press(ViewMessage::StartInstall) - .padding(10) - .width(Length::Fill) - .style(theme::Button::TransparentBorder), - ), + .max_width(500) + .align_items(Alignment::Center), ) - .max_width(500) - .align_items(Alignment::Center), - ) - .width(Length::Fill) - .height(Length::Fill) - .center_x() - .center_y(), + .width(Length::Fill) + .height(Length::Fill) + .center_x() + .center_y(), + ) + .push(Space::with_height(Length::Units(100))), ) .map(Message::View) } diff --git a/gui/ui/src/image.rs b/gui/ui/src/image.rs index ec1ca8ae..635466b0 100644 --- a/gui/ui/src/image.rs +++ b/gui/ui/src/image.rs @@ -3,6 +3,7 @@ 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"); +const LIANA_BRAND_GREY: &[u8] = include_bytes!("../static/logos/LIANA_BRAND_Gray.svg"); pub fn liana_app_icon() -> icon::Icon { icon::Icon::from_file_data(LIANA_APP_ICON, None).unwrap() @@ -13,6 +14,11 @@ pub fn liana_grey_logo() -> Svg { Svg::new(h) } +pub fn liana_brand_grey() -> Svg { + let h = Handle::from_memory(LIANA_BRAND_GREY.to_vec()); + Svg::new(h) +} + const CREATE_NEW_WALLET_ICON: &[u8] = include_bytes!("../static/icons/blueprint.svg"); pub fn create_new_wallet_icon() -> Svg {