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

chore(eckhart): cleanup theme module

This commit is contained in:
obrusvit 2025-03-10 18:01:23 +01:00
parent a9ef1284a6
commit 300a3bd1a0
6 changed files with 91 additions and 195 deletions

View File

@ -41,7 +41,7 @@ impl Button {
#[cfg(not(feature = "bootloader"))]
const SUBTEXT_STYLE: TextStyle = theme::label_menu_item_subtitle();
#[cfg(feature = "bootloader")]
const SUBTEXT_STYLE: TextStyle = theme::bootloader::TEXT_NORMAL;
const SUBTEXT_STYLE: TextStyle = theme::TEXT_NORMAL;
pub const fn new(content: ButtonContent) -> Self {
Self {

View File

@ -89,7 +89,7 @@ pub enum HeaderMsg {
}
impl Header {
pub const HEADER_HEIGHT: i16 = 96; // [px]
pub const HEADER_HEIGHT: i16 = theme::HEADER_HEIGHT; // [px]
pub const HEADER_BUTTON_WIDTH: i16 = 56; // [px]
pub const HEADER_INSETS: Insets = Insets::sides(24); // [px]

View File

@ -213,7 +213,7 @@ struct Instruction<'a> {
impl<'a> Instruction<'a> {
/// default style for instruction text
const STYLE_INSTRUCTION: &'static TextStyle = &theme::TEXT_SMALL;
const STYLE_INSTRUCTION: &'static TextStyle = &theme::firmware::TEXT_SMALL;
/// margin between icon and text
const ICON_OFFSET: Offset = Offset::x(24); // [px]

View File

@ -10,7 +10,7 @@ use crate::ui::{
util::Pager,
};
use super::{action_bar::ActionBarMsg, ActionBar, Header, HeaderMsg, Hint};
use super::{action_bar::ActionBarMsg, ActionBar, Header, HeaderMsg, Hint, theme::SIDE_INSETS};
/// Full-screen component for rendering text.
///
@ -39,7 +39,7 @@ impl<T> TextScreen<T>
where
T: AllowedTextContent,
{
const CONTENT_INSETS: Insets = Insets::sides(24);
const CONTENT_INSETS: Insets = SIDE_INSETS;
pub fn new(content: T) -> Self {
Self {

View File

@ -1,92 +1,63 @@
use crate::ui::{
component::{text::TextStyle, LineBreaking::BreakWordsNoHyphen},
constant::{HEIGHT, WIDTH},
display::Color,
geometry::{Offset, Point, Rect},
util::include_res,
};
use super::{
super::{
component::{ButtonStyle, ButtonStyleSheet, ResultStyle},
component::{ButtonStyle, ButtonStyleSheet},
fonts,
},
BLACK, GREY_DARK, GREY_LIGHT, GREY_SUPER_DARK, WHITE,
BLACK, BLUE, GREY, GREY_DARK, GREY_EXTRA_DARK, GREY_EXTRA_LIGHT, GREY_LIGHT, GREY_SUPER_DARK,
RED, WHITE,
};
pub const BLD_BG: Color = Color::rgb(0x00, 0x1E, 0xAD);
pub const BLD_BG: Color = BLACK;
pub const BLD_FG: Color = WHITE;
pub const BLD_WIPE_COLOR: Color = Color::rgb(0xE7, 0x0E, 0x0E);
pub const BLD_WIPE_TEXT_COLOR: Color = WHITE;
pub const BLD_WARN_COLOR: Color = Color::rgb(0xFF, 0x00, 0x00);
pub const BLD_WIPE_BTN_COLOR: Color = WHITE;
pub const BLD_WIPE_BTN_COLOR_ACTIVE: Color = Color::rgb(0xFA, 0xCF, 0xCF);
pub const BLD_WIPE_CANCEL_BTN_COLOR: Color = Color::rgb(0xFF, 0x41, 0x41);
pub const BLD_WIPE_CANCEL_BTN_COLOR_ACTIVE: Color = Color::rgb(0xAE, 0x09, 0x09);
pub const BLD_INSTALL_BTN_COLOR_ACTIVE: Color = Color::rgb(0xCD, 0xD2, 0xEF);
pub const BLD_BTN_COLOR: Color = Color::rgb(0x2D, 0x42, 0xBF);
pub const BLD_BTN_COLOR_ACTIVE: Color = Color::rgb(0x04, 0x10, 0x58);
pub const BLD_TITLE_COLOR: Color = WHITE;
pub const WELCOME_COLOR: Color = BLACK;
pub const WELCOME_HIGHLIGHT_COLOR: Color = Color::rgb(0x28, 0x28, 0x28);
// Commonly used corner radius (i.e. for buttons).
pub const RADIUS: u8 = 2;
// Commonly used constants for UI elements.
pub const CONTENT_PADDING: i16 = 6;
pub const TITLE_AREA: Rect = Rect::new(
Point::new(CONTENT_PADDING, CONTENT_PADDING),
Point::new(WIDTH, CORNER_BUTTON_SIZE + CONTENT_PADDING),
);
pub const CORNER_BUTTON_TOUCH_EXPANSION: i16 = 13;
pub const CORNER_BUTTON_SIZE: i16 = 44;
pub const CORNER_BUTTON_AREA: Rect = Rect::from_top_left_and_size(
Point::new(
WIDTH - CORNER_BUTTON_SIZE - CONTENT_PADDING,
CONTENT_PADDING,
),
Offset::uniform(CORNER_BUTTON_SIZE),
);
pub const BUTTON_AREA_START: i16 = HEIGHT - 56;
pub const BUTTON_HEIGHT: i16 = 50;
// BLD icons
pub const X24: &[u8] = include_res!("layout_delizia/res/x24.toif");
pub const X32: &[u8] = include_res!("layout_delizia/res/x32.toif");
pub const FIRE24: &[u8] = include_res!("layout_delizia/res/fire24.toif");
pub const FIRE32: &[u8] = include_res!("layout_delizia/res/fire32.toif");
pub const FIRE40: &[u8] = include_res!("layout_delizia/res/fire40.toif");
pub const REFRESH24: &[u8] = include_res!("layout_delizia/res/refresh24.toif");
pub const MENU32: &[u8] = include_res!("layout_delizia/res/menu32.toif");
pub const INFO32: &[u8] = include_res!("layout_delizia/res/info32.toif");
pub const DOWNLOAD24: &[u8] = include_res!("layout_delizia/res/download24.toif");
pub const WARNING40: &[u8] = include_res!("layout_delizia/res/warning40.toif");
pub const CHECK24: &[u8] = include_res!("layout_delizia/res/check24.toif");
pub const CHECK40: &[u8] = include_res!("layout_delizia/res/check40.toif");
pub fn button_confirm() -> ButtonStyleSheet {
ButtonStyleSheet {
normal: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_BG,
button_color: WHITE,
icon_color: BLD_BG,
text_color: GREY_EXTRA_LIGHT,
button_color: BLUE,
icon_color: GREY_EXTRA_LIGHT,
background_color: BLD_BG,
},
active: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_BG,
button_color: BLD_INSTALL_BTN_COLOR_ACTIVE,
text_color: GREY_EXTRA_LIGHT,
button_color: GREY_SUPER_DARK,
icon_color: GREY_EXTRA_LIGHT,
background_color: BLD_BG,
},
disabled: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_FG,
button_color: GREY_DARK,
icon_color: BLD_BG,
background_color: BLD_FG,
},
}
}
pub fn button_cancel() -> ButtonStyleSheet {
ButtonStyleSheet {
normal: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: GREY_LIGHT,
button_color: GREY_EXTRA_DARK,
icon_color: GREY_LIGHT,
background_color: BLD_BG,
},
active: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: GREY_LIGHT,
button_color: GREY_DARK,
icon_color: GREY_LIGHT,
background_color: BLD_BG,
},
disabled: &ButtonStyle {
@ -125,47 +96,21 @@ pub const fn button_header() -> ButtonStyleSheet {
}
}
pub fn button_wipe_cancel() -> ButtonStyleSheet {
ButtonStyleSheet {
normal: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: WHITE,
button_color: BLD_WIPE_CANCEL_BTN_COLOR,
icon_color: WHITE,
background_color: BLD_WIPE_COLOR,
},
active: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: WHITE,
button_color: BLD_WIPE_CANCEL_BTN_COLOR_ACTIVE,
icon_color: WHITE,
background_color: BLD_WIPE_COLOR,
},
disabled: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: GREY_LIGHT,
button_color: GREY_DARK,
icon_color: GREY_LIGHT,
background_color: WHITE,
},
}
}
pub fn button_wipe_confirm() -> ButtonStyleSheet {
ButtonStyleSheet {
normal: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_WIPE_COLOR,
button_color: BLD_WIPE_BTN_COLOR,
icon_color: BLD_WIPE_COLOR,
background_color: BLD_WIPE_COLOR,
text_color: GREY_EXTRA_LIGHT,
button_color: RED,
icon_color: GREY_EXTRA_LIGHT,
background_color: RED,
},
active: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_WIPE_COLOR,
button_color: BLD_WIPE_BTN_COLOR_ACTIVE,
icon_color: BLD_WIPE_COLOR,
background_color: BLD_WIPE_COLOR,
text_color: RED,
button_color: GREY_EXTRA_LIGHT,
icon_color: RED,
background_color: GREY_EXTRA_LIGHT,
},
disabled: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
@ -180,72 +125,42 @@ pub fn button_wipe_confirm() -> ButtonStyleSheet {
pub fn button_bld_menu() -> ButtonStyleSheet {
ButtonStyleSheet {
normal: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_FG,
font: fonts::FONT_SATOSHI_REGULAR_38,
text_color: GREY_EXTRA_LIGHT,
button_color: BLD_BG,
icon_color: BLD_FG,
icon_color: GREY_EXTRA_LIGHT,
background_color: BLD_BG,
},
active: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_FG,
button_color: BLD_BG,
icon_color: BLD_FG,
background_color: BLD_BG,
font: fonts::FONT_SATOSHI_REGULAR_38,
text_color: GREY_DARK,
button_color: GREY_SUPER_DARK,
icon_color: GREY_DARK,
background_color: GREY_SUPER_DARK,
},
disabled: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: GREY_LIGHT,
font: fonts::FONT_SATOSHI_REGULAR_38,
text_color: GREY_DARK,
button_color: BLD_BG,
icon_color: GREY_LIGHT,
background_color: BLD_BG,
},
}
}
pub fn button_bld() -> ButtonStyleSheet {
ButtonStyleSheet {
normal: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_FG,
button_color: BLD_BTN_COLOR,
icon_color: BLD_FG,
background_color: BLD_BG,
},
active: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: BLD_FG,
button_color: BLD_BTN_COLOR_ACTIVE,
icon_color: BLD_FG,
background_color: BLD_BG,
},
disabled: &ButtonStyle {
font: fonts::FONT_SATOSHI_MEDIUM_26,
text_color: GREY_LIGHT,
button_color: BLD_BTN_COLOR,
icon_color: GREY_LIGHT,
icon_color: GREY_DARK,
background_color: BLD_BG,
},
}
}
pub const fn text_title(bg: Color) -> TextStyle {
TextStyle::new(
fonts::FONT_SATOSHI_MEDIUM_26,
BLD_TITLE_COLOR,
bg,
BLD_TITLE_COLOR,
BLD_TITLE_COLOR,
)
TextStyle::new(fonts::FONT_SATOSHI_MEDIUM_26, GREY, bg, GREY, GREY)
}
pub const TEXT_NORMAL: TextStyle = TextStyle::new(
pub const TEXT_FW_FINGERPRINT: TextStyle = TextStyle::new(
fonts::FONT_SATOSHI_REGULAR_38,
BLD_FG,
GREY_EXTRA_LIGHT,
BLD_BG,
BLD_FG,
BLD_FG,
);
)
.with_line_breaking(BreakWordsNoHyphen);
pub const TEXT_WARNING: TextStyle = TextStyle::new(
fonts::FONT_SATOSHI_REGULAR_38,
BLD_WARN_COLOR,
@ -253,39 +168,3 @@ pub const TEXT_WARNING: TextStyle = TextStyle::new(
BLD_WARN_COLOR,
BLD_WARN_COLOR,
);
pub const fn text_fingerprint(bg: Color) -> TextStyle {
TextStyle::new(fonts::FONT_SATOSHI_REGULAR_38, BLD_FG, bg, BLD_FG, BLD_FG)
.with_line_breaking(BreakWordsNoHyphen)
}
pub const TEXT_BOLD: TextStyle = TextStyle::new(
fonts::FONT_SATOSHI_REGULAR_38,
BLD_FG,
BLD_BG,
BLD_FG,
BLD_FG,
);
pub const TEXT_WIPE_BOLD: TextStyle = TextStyle::new(
fonts::FONT_SATOSHI_REGULAR_38,
BLD_WIPE_TEXT_COLOR,
BLD_WIPE_COLOR,
BLD_WIPE_TEXT_COLOR,
BLD_WIPE_TEXT_COLOR,
);
pub const TEXT_WIPE_NORMAL: TextStyle = TextStyle::new(
fonts::FONT_SATOSHI_REGULAR_38,
BLD_WIPE_TEXT_COLOR,
BLD_WIPE_COLOR,
BLD_WIPE_TEXT_COLOR,
BLD_WIPE_TEXT_COLOR,
);
pub const RESULT_WIPE: ResultStyle = ResultStyle::new(
BLD_WIPE_TEXT_COLOR,
BLD_WIPE_COLOR,
BLD_WIPE_CANCEL_BTN_COLOR,
);
pub const RESULT_FW_INSTALL: ResultStyle = ResultStyle::new(BLD_FG, BLD_BG, BLD_BTN_COLOR);
pub const RESULT_INITIAL: ResultStyle =
ResultStyle::new(BLD_FG, WELCOME_COLOR, WELCOME_HIGHLIGHT_COLOR);

View File

@ -6,10 +6,10 @@ pub mod firmware;
#[cfg(feature = "micropython")]
pub use firmware::*;
use crate::ui::{display::Color, util::include_icon};
use crate::ui::{component::text::TextStyle, display::Color, geometry::Insets, util::include_icon};
use super::{
component::{ButtonStyle, ButtonStyleSheet, ResultStyle},
component::{ButtonStyle, ButtonStyleSheet},
fonts,
};
@ -38,10 +38,18 @@ pub const ORANGE_EXTRA_DARK: Color = Color::rgb(0x12, 0x07, 0x04);
pub const YELLOW: Color = Color::rgb(0xFF, 0xE4, 0x58);
pub const BLUE: Color = Color::rgb(0x00, 0x46, 0xFF);
pub const RED: Color = Color::rgb(0xFF, 0x30, 0x30);
pub const FATAL_ERROR_COLOR: Color = Color::rgb(0xE7, 0x0E, 0x0E);
pub const FATAL_ERROR_HIGHLIGHT_COLOR: Color = Color::rgb(0xFF, 0x41, 0x41);
// Common constants
pub const HEADER_HEIGHT: i16 = 96; // [px]
pub const SIDE_INSETS: Insets = Insets::sides(24); // [px]
pub const ACTION_BAR_HEIGHT: i16 = 90; // [px]
pub const TEXT_VERTICAL_SPACING: i16 = 24; // [px]
// UI icons (white color).
include_icon!(ICON_CHEVRON_DOWN, "layout_eckhart/res/chevron_down.toif");
include_icon!(
@ -94,6 +102,22 @@ include_icon!(ICON_BORDER_TR, "layout_eckhart/res/border/TR.toif");
include_icon!(ICON_PLUS, "layout_eckhart/res/plus.toif");
include_icon!(ICON_MINUS, "layout_eckhart/res/minus.toif");
// Common text styles and button styles must use fonts accessible from both
// bootloader and firmware
pub const TEXT_NORMAL: TextStyle =
TextStyle::new(fonts::FONT_SATOSHI_REGULAR_38, GREY_EXTRA_LIGHT, BG, FG, FG);
pub const TEXT_SMALL: TextStyle =
TextStyle::new(fonts::FONT_SATOSHI_MEDIUM_26, GREY_EXTRA_LIGHT, BG, FG, FG);
pub const TEXT_SMALL_RED: TextStyle = TextStyle {
text_color: RED,
..TEXT_SMALL
};
pub const TEXT_SMALL_GREY: TextStyle = TextStyle {
text_color: GREY,
..TEXT_SMALL
};
pub const fn button_default() -> ButtonStyleSheet {
ButtonStyleSheet {
normal: &ButtonStyle {
@ -119,10 +143,3 @@ pub const fn button_default() -> ButtonStyleSheet {
},
}
}
// Result constants
pub const RESULT_PADDING: i16 = 6;
pub const RESULT_FOOTER_START: i16 = 171;
pub const RESULT_FOOTER_HEIGHT: i16 = 62;
pub const RESULT_ERROR: ResultStyle =
ResultStyle::new(FG, FATAL_ERROR_COLOR, FATAL_ERROR_HIGHLIGHT_COLOR);