1
0
mirror of https://github.com/trezor/trezor-firmware.git synced 2025-03-12 14:16:06 +00:00

refactor(eckhart): update fonts and disabled button style

This commit is contained in:
Lukas Bielesch 2025-03-04 16:02:33 +01:00 committed by obrusvit
parent 3da8d679ac
commit 9bec18733e
4 changed files with 41 additions and 9 deletions

View File

@ -80,7 +80,7 @@ pub fn new_confirm_reset(recovery: bool) -> Result<SwipeFlow, error::Error> {
let content_menu = VerticalMenuScreen::new( let content_menu = VerticalMenuScreen::new(
VerticalMenu::empty().item( VerticalMenu::empty().item(
Button::with_text(TR::buttons__cancel.into()) Button::with_text(TR::buttons__cancel.into())
.styled(theme::menu_item_title_red()) .styled(theme::menu_item_title_orange())
.with_text_align(Alignment::Start) .with_text_align(Alignment::Start)
.with_content_offset(Offset::x(12)), .with_content_offset(Offset::x(12)),
), ),

View File

@ -77,7 +77,7 @@ pub fn new_prompt_backup() -> Result<SwipeFlow, error::Error> {
let content_menu = VerticalMenuScreen::new( let content_menu = VerticalMenuScreen::new(
VerticalMenu::empty().item( VerticalMenu::empty().item(
Button::with_text(TR::backup__title_skip.into()) Button::with_text(TR::backup__title_skip.into())
.styled(theme::menu_item_title_red()) .styled(theme::menu_item_title_orange())
.with_text_align(Alignment::Start) .with_text_align(Alignment::Start)
.with_content_offset(Offset::x(12)), .with_content_offset(Offset::x(12)),
), ),

View File

@ -1,4 +1,10 @@
use crate::{time::Duration, ui::component::text::TextStyle}; use crate::{
time::Duration,
ui::component::text::{
layout::{Chunks, LineBreaking, PageBreaking},
TextStyle,
},
};
use super::{ use super::{
super::{ super::{
@ -61,16 +67,42 @@ pub const TEXT_MONO_MEDIUM: TextStyle = TextStyle::new(
/// Roboto Mono Light - 30 (Address, data) /// Roboto Mono Light - 30 (Address, data)
pub const TEXT_MONO_LIGHT: TextStyle = TextStyle::new( pub const TEXT_MONO_LIGHT: TextStyle = TextStyle::new(
fonts::FONT_MONO_LIGHT_30, fonts::FONT_MONO_LIGHT_30,
GREY_LIGHT,
BG,
GREY_LIGHT,
GREY_LIGHT,
);
pub const TEXT_MEDIUM_EXTRA_LIGHT: TextStyle = TextStyle::new(
fonts::FONT_SATOSHI_MEDIUM_26,
GREY_EXTRA_LIGHT, GREY_EXTRA_LIGHT,
BG, BG,
GREY_EXTRA_LIGHT, GREY_EXTRA_LIGHT,
GREY_EXTRA_LIGHT, GREY_EXTRA_LIGHT,
); );
pub const TEXT_SMALL_LIGHT: TextStyle = TextStyle::new(
fonts::FONT_SATOSHI_REGULAR_22,
GREY_LIGHT,
BG,
GREY_LIGHT,
GREY_LIGHT,
)
.with_line_spacing(-4);
/// Makes sure that the displayed text (usually address) will get divided into
/// smaller chunks.
pub const TEXT_MONO_ADDRESS_CHUNKS: TextStyle = TEXT_MONO_LIGHT
.with_chunks(Chunks::new(4, 8))
.with_line_spacing(24);
pub const TEXT_MONO_ADDRESS: TextStyle = TEXT_MONO_LIGHT
.with_line_breaking(LineBreaking::BreakWordsNoHyphen)
.with_page_breaking(PageBreaking::CutAndInsertEllipsis);
/// Decide the text style of chunkified text according to its length. /// Decide the text style of chunkified text according to its length.
pub fn get_chunkified_text_style(_character_length: usize) -> &'static TextStyle { pub fn get_chunkified_text_style(_character_length: usize) -> &'static TextStyle {
// TODO: implement properly for Eckhart, see Delizia implemenation &TEXT_MONO_ADDRESS_CHUNKS
&TEXT_MONO_MEDIUM
} }
// Macro for styles differing only in text color // Macro for styles differing only in text color
@ -243,8 +275,8 @@ pub const fn menu_item_title_yellow() -> ButtonStyleSheet {
menu_item_title!(YELLOW) menu_item_title!(YELLOW)
} }
pub const fn menu_item_title_red() -> ButtonStyleSheet { pub const fn menu_item_title_orange() -> ButtonStyleSheet {
menu_item_title!(RED) menu_item_title!(ORANGE)
} }
pub const fn button_select_word() -> ButtonStyleSheet { pub const fn button_select_word() -> ButtonStyleSheet {

View File

@ -113,9 +113,9 @@ pub const fn button_default() -> ButtonStyleSheet {
disabled: &ButtonStyle { disabled: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26, font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: GREY_LIGHT, text_color: GREY_LIGHT,
button_color: GREY_DARK, button_color: BG,
icon_color: GREY_LIGHT, icon_color: GREY_LIGHT,
background_color: GREY_DARK, background_color: BG,
}, },
} }
} }