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:
parent
a9ef1284a6
commit
300a3bd1a0
@ -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 {
|
||||
|
@ -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]
|
||||
|
||||
|
@ -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]
|
||||
|
||||
|
@ -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 {
|
||||
|
@ -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);
|
||||
|
@ -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);
|
||||
|
Loading…
Reference in New Issue
Block a user