257 lines
11 KiB
Text
257 lines
11 KiB
Text
mod.theme = mod.themes.light
|
|
|
|
// Cardboard. Kraft corrugated board, hand made: every control is a piece of
|
|
// card cut out and glued on, or laid back into the window it was cut from,
|
|
// and every word and line is drawn in black felt marker. The board is a warm
|
|
// kraft brown with its fibres and a quiet drift of tone; the cut edges show
|
|
// the fluted layer between the two liners. What is chosen is black card or
|
|
// a marker fill; coloured paper (yellow, blue, red) and cream paper are glued
|
|
// on where a role needs a colour. The faces are drawn in widgets.splash; this
|
|
// file holds the tokens every face and every stock widget reads.
|
|
use mod.res.*
|
|
use mod.text.*
|
|
|
|
// The board.
|
|
mod.theme.color_bg_app = #b08659
|
|
mod.theme.color_fg_app = #b08659
|
|
mod.theme.color_bg_container = #b08659
|
|
|
|
// Raised pieces the sheet does not redraw: the board's own kraft, a shade
|
|
// lighter on top and darker at the foot.
|
|
mod.theme.color_outset = #b38a5d
|
|
mod.theme.color_outset_1 = #c29a6c
|
|
mod.theme.color_outset_2 = #9c744b
|
|
mod.theme.color_outset_hover = #b99063
|
|
mod.theme.color_outset_1_hover = #c7a072
|
|
mod.theme.color_outset_2_hover = #a17a50
|
|
mod.theme.color_outset_down = #a27a50
|
|
mod.theme.color_outset_1_down = #96704a
|
|
mod.theme.color_outset_2_down = #ab8358
|
|
mod.theme.color_outset_focus = #b38a5d
|
|
mod.theme.color_outset_1_focus = #c29a6c
|
|
mod.theme.color_outset_2_focus = #9c744b
|
|
mod.theme.color_outset_active = #2a2724
|
|
mod.theme.color_outset_1_active = #2a2724
|
|
mod.theme.color_outset_2_active = #2a2724
|
|
mod.theme.color_outset_disabled = #ab9580
|
|
mod.theme.color_outset_1_disabled = #ab9580
|
|
mod.theme.color_outset_2_disabled = #ab9580
|
|
|
|
// Wells: a window cut through the board, its floor the deeper kraft under
|
|
// it. Opaque in every state.
|
|
mod.theme.color_inset = #a37b51
|
|
mod.theme.color_inset_1 = #a37b51
|
|
mod.theme.color_inset_2 = #a37b51
|
|
mod.theme.color_inset_hover = #a98157
|
|
mod.theme.color_inset_1_hover = #a98157
|
|
mod.theme.color_inset_2_hover = #a98157
|
|
mod.theme.color_inset_focus = #a98157
|
|
mod.theme.color_inset_1_focus = #a98157
|
|
mod.theme.color_inset_2_focus = #a98157
|
|
mod.theme.color_inset_active = #a37b51
|
|
mod.theme.color_inset_1_active = #a37b51
|
|
mod.theme.color_inset_2_active = #a37b51
|
|
mod.theme.color_inset_down = #9b744b
|
|
mod.theme.color_inset_1_down = #9b744b
|
|
mod.theme.color_inset_2_down = #9b744b
|
|
mod.theme.color_inset_drag = #9b744b
|
|
mod.theme.color_inset_1_drag = #9b744b
|
|
mod.theme.color_inset_2_drag = #9b744b
|
|
mod.theme.color_inset_empty = #a37b51
|
|
mod.theme.color_inset_1_empty = #a37b51
|
|
mod.theme.color_inset_2_empty = #a37b51
|
|
mod.theme.color_inset_disabled = #ad9073
|
|
mod.theme.color_inset_1_disabled = #ad9073
|
|
mod.theme.color_inset_2_disabled = #ad9073
|
|
|
|
// Every edge a stock face strokes is a line of marker.
|
|
mod.theme.color_bevel = #x18140e
|
|
mod.theme.color_bevel_hover = #x18140e
|
|
mod.theme.color_bevel_focus = #x2f5f9e
|
|
mod.theme.color_bevel_down = #x18140e
|
|
mod.theme.color_bevel_active = #x18140e
|
|
mod.theme.color_bevel_empty = #x18140e
|
|
mod.theme.color_bevel_disabled = #7d6a55
|
|
mod.theme.color_bevel_inset_1 = #x18140e
|
|
mod.theme.color_bevel_inset_2 = #x18140e
|
|
mod.theme.color_bevel_outset_1 = #x18140e
|
|
mod.theme.color_bevel_outset_2 = #x18140e
|
|
mod.theme.beveling = 0.5
|
|
|
|
// Ink: black felt marker, #x18140e, 5.6:1 on the board. Disabled words are
|
|
// the same marker gone dry, a brown that still reads.
|
|
mod.theme.color_text = #x18140e
|
|
mod.theme.color_text_hover = #100c08
|
|
mod.theme.color_text_focus = #100c08
|
|
mod.theme.color_text_active = #100c08
|
|
mod.theme.color_text_down = #100c08
|
|
mod.theme.color_text_disabled = #x6e5a44
|
|
mod.theme.color_text_placeholder = #4a3a2a
|
|
mod.theme.color_text_placeholder_hover = #x3e3022
|
|
mod.theme.color_text_val = #x18140e
|
|
mod.theme.color_text_meta = #221a10
|
|
mod.theme.color_text_cursor = #x18140e
|
|
mod.theme.color_cursor = #x18140e
|
|
mod.theme.color_label = #x18140e
|
|
mod.theme.color_label_hover = #100c08
|
|
mod.theme.color_label_focus = #100c08
|
|
mod.theme.color_label_active = #100c08
|
|
mod.theme.color_label_down = #100c08
|
|
mod.theme.color_label_disabled = #x6e5a44
|
|
mod.theme.color_label_inner = #x18140e
|
|
mod.theme.color_label_inner_hover = #100c08
|
|
mod.theme.color_label_inner_focus = #x18140e
|
|
mod.theme.color_label_inner_down = #100c08
|
|
mod.theme.color_label_inner_drag = #100c08
|
|
mod.theme.color_label_inner_active = #100c08
|
|
mod.theme.color_label_inner_inactive = #221a10
|
|
mod.theme.color_label_inner_disabled = #x6e5a44
|
|
mod.theme.color_label_outer = #x18140e
|
|
mod.theme.color_label_outer_off = #x18140e
|
|
mod.theme.color_label_outer_hover = #100c08
|
|
mod.theme.color_label_outer_down = #100c08
|
|
mod.theme.color_label_outer_drag = #100c08
|
|
mod.theme.color_label_outer_focus = #100c08
|
|
mod.theme.color_label_outer_active = #100c08
|
|
mod.theme.color_label_outer_active_focus = #100c08
|
|
mod.theme.color_label_outer_disabled = #x6e5a44
|
|
mod.theme.color_icon = #x18140e
|
|
mod.theme.color_icon_hover = #100c08
|
|
mod.theme.color_icon_focus = #x18140e
|
|
mod.theme.color_icon_active = #100c08
|
|
mod.theme.color_icon_down = #100c08
|
|
mod.theme.color_icon_disabled = #x6e5a44
|
|
mod.theme.color_on_surface = #x18140e
|
|
mod.theme.color_on_surface_variant = #x18140e
|
|
|
|
// The accent seed is the marker itself: the grown primary is black card
|
|
// with cream words. Focus is a blue ballpoint line.
|
|
mod.theme.color_ctrl_selected = #2a2724
|
|
mod.theme.color_text_on_accent = #xf1e6cf
|
|
mod.theme.color_focus = #x2f5f9e
|
|
mod.theme.color_ctrl_active = #x18140e
|
|
mod.theme.color_val = #x18140e
|
|
mod.theme.color_val_hover = #x18140e
|
|
mod.theme.color_val_focus = #x18140e
|
|
mod.theme.color_val_drag = #x18140e
|
|
mod.theme.color_val_disabled = #7d6a55
|
|
mod.theme.color_mark = #x18140e
|
|
mod.theme.color_mark_active = #x18140e
|
|
mod.theme.color_mark_active_hover = #100c08
|
|
mod.theme.color_mark_focus = #x18140e
|
|
mod.theme.color_mark_disabled = #7d6a55
|
|
// Selected text: a yellow highlighter stroke.
|
|
mod.theme.color_selection = #00000000
|
|
mod.theme.color_selection_hover = #xe8c2404d
|
|
mod.theme.color_selection_focus = #xe8c24080
|
|
mod.theme.color_selection_down = #xe8c24080
|
|
mod.theme.color_bg_highlight = #c29a6c
|
|
mod.theme.color_bg_highlight_inline = #xe8c24066
|
|
mod.theme.color_handle = #c29a6c
|
|
mod.theme.color_handle_hover = #c7a072
|
|
mod.theme.color_handle_1 = #c7a072
|
|
mod.theme.color_handle_2 = #9c744b
|
|
|
|
// Rows of a tree or a table: strips of cream paper glued on the board, every
|
|
// other one a shade warmer; the chosen row a strip of yellow paper.
|
|
mod.theme.color_bg_even = #xe6d8bc
|
|
mod.theme.color_bg_odd = #xdfcfb1
|
|
mod.theme.color_highlight = #e2b84a
|
|
|
|
// The instruments: black card behind a cream paper frame, yellow figures
|
|
// painted on it, the unlit segments a ghost.
|
|
mod.theme.color_screen = #2a2724
|
|
mod.theme.color_screen_ink = #xf2c94e
|
|
mod.theme.screen_ghost = 0.10
|
|
mod.theme.color_lamp_plain = #xfff6e4
|
|
mod.theme.color_lamp_off = #2a2520
|
|
|
|
// The surface ladder: kraft for the board, cream paper above it.
|
|
mod.theme.color_surface = #b08659
|
|
mod.theme.color_surface_dim = #a37b51
|
|
mod.theme.color_surface_bright = #c29a6c
|
|
mod.theme.color_surface_container_lowest = #a37b51
|
|
mod.theme.color_surface_container_low = #b38a5d
|
|
mod.theme.color_surface_container = #xe6d8bc
|
|
mod.theme.color_surface_container_high = #xece0c7
|
|
mod.theme.color_surface_container_highest = #xf1e6cf
|
|
mod.theme.color_outline = #x18140e
|
|
mod.theme.color_outline_variant = #x6e5a44
|
|
mod.theme.color_inverse_surface = #2a2724
|
|
mod.theme.color_inverse_on_surface = #xf1e6cf
|
|
|
|
// SPACING. Rows of 26 points, gaps of 8, a panel's padding 12. The rungs
|
|
// below were frozen as numbers when the base was read, so they are stated
|
|
// again here.
|
|
mod.theme.space_factor = 6.0
|
|
mod.theme.space_1 = 4.0
|
|
mod.theme.space_2 = 8.0
|
|
mod.theme.space_3 = 12.0
|
|
mod.theme.space_4 = 16.0
|
|
mod.theme.space_5 = 20.0
|
|
mod.theme.space_6 = 24.0
|
|
mod.theme.mspace_1 = mod.turtle.Inset{top: 4.0 right: 4.0 bottom: 4.0 left: 4.0}
|
|
mod.theme.mspace_h_1 = mod.turtle.Inset{top: 0.0 right: 4.0 bottom: 0.0 left: 4.0}
|
|
mod.theme.mspace_v_1 = mod.turtle.Inset{top: 4.0 right: 0.0 bottom: 4.0 left: 0.0}
|
|
mod.theme.mspace_2 = mod.turtle.Inset{top: 8.0 right: 8.0 bottom: 8.0 left: 8.0}
|
|
mod.theme.mspace_h_2 = mod.turtle.Inset{top: 0.0 right: 8.0 bottom: 0.0 left: 8.0}
|
|
mod.theme.mspace_v_2 = mod.turtle.Inset{top: 8.0 right: 0.0 bottom: 8.0 left: 0.0}
|
|
mod.theme.mspace_3 = mod.turtle.Inset{top: 12.0 right: 12.0 bottom: 12.0 left: 12.0}
|
|
mod.theme.mspace_h_3 = mod.turtle.Inset{top: 0.0 right: 12.0 bottom: 0.0 left: 12.0}
|
|
mod.theme.mspace_v_3 = mod.turtle.Inset{top: 12.0 right: 0.0 bottom: 12.0 left: 0.0}
|
|
mod.theme.size_control_s = 22.0
|
|
mod.theme.size_control_m = 26.0
|
|
mod.theme.size_control_l = 32.0
|
|
mod.theme.tab_height = 26.0
|
|
mod.theme.tab_flat_height = 26.0
|
|
mod.theme.data_item_height = 22.0
|
|
mod.theme.corner_radius = 5.0
|
|
mod.theme.container_corner_radius = 6.0
|
|
mod.theme.textselection_corner_radius = 1.5
|
|
mod.theme.radius_xs = 2.0
|
|
mod.theme.radius_s = 3.0
|
|
mod.theme.radius_m = 5.0
|
|
mod.theme.radius_l = 6.0
|
|
|
|
// TYPE, all of it by hand. Headings and captions in felt marker capitals
|
|
// (Permanent Marker); everything else hand printed (Caveat) in its heaviest
|
|
// weight, so it reads as a felt-tip at 1x. Caveat is small on its body (an
|
|
// x-height of 0.36 of the size, against Inter's 0.54), so it is set
|
|
// larger: 12.5 for working text, 13 on the controls. Both
|
|
// hands carry tall line boxes for their size (Caveat 1.26 em, Permanent
|
|
// Marker 1.43), so each line box is drawn in to the ink (the asc and desc
|
|
// fudges), or a 26 point row and an 80 point panel would overflow.
|
|
mod.theme.font_size_p = 12.5
|
|
mod.theme.font_size_base = 12.5
|
|
mod.theme.type_title_l_size = 15.0
|
|
mod.theme.type_title_m_size = 13.0
|
|
mod.theme.type_title_s_size = 11.5
|
|
mod.theme.type_body_l_size = 13.5
|
|
mod.theme.type_body_m_size = 12.5
|
|
mod.theme.type_body_s_size = 11.5
|
|
mod.theme.type_label_l_size = 13.0
|
|
mod.theme.type_label_m_size = 12.0
|
|
mod.theme.type_label_s_size = 11.0
|
|
mod.theme.font_size_4 = 13.0
|
|
mod.theme.font_regular = mod.theme.font_regular{font_size: 12.5 font_family: mod.theme.font_regular.font_family{ibm_plex_text := FontMember{res: crate_resource("self:resources/Caveat-Variable.ttf") weight: 700.0 asc: -0.16 desc: 0.06}}}
|
|
mod.theme.font_label = mod.theme.font_label{font_size: 13.0 font_family: mod.theme.font_label.font_family{ibm_plex_text := FontMember{res: crate_resource("self:resources/Caveat-Variable.ttf") weight: 700.0 asc: -0.16 desc: 0.06}}}
|
|
mod.theme.font_bold = mod.theme.font_bold{font_size: 12.0 font_family: mod.theme.font_bold.font_family{ibm_plex_semibold := FontMember{res: crate_resource("self:resources/PermanentMarker-Regular.ttf") weight: 400.0 asc: -0.25 desc: 0.1}}}
|
|
// The type roles were frozen from the base's faces; stated again so every
|
|
// role reads in its hand. Titles in marker, body and labels hand printed.
|
|
mod.theme.font_title_l = mod.theme.font_bold{font_size: 14.0 line_spacing: 1.15}
|
|
mod.theme.font_title_m = mod.theme.font_bold{font_size: 12.0 line_spacing: 1.15}
|
|
mod.theme.font_title_s = mod.theme.font_bold{font_size: 10.5 line_spacing: 1.15}
|
|
mod.theme.font_body_l = mod.theme.font_regular{font_size: 13.5 line_spacing: 1.2}
|
|
mod.theme.font_body_m = mod.theme.font_regular{font_size: 12.5 line_spacing: 1.2}
|
|
mod.theme.font_body_s = mod.theme.font_regular{font_size: 11.5 line_spacing: 1.2}
|
|
mod.theme.font_label_l = mod.theme.font_label{font_size: 13.0 line_spacing: 1.1}
|
|
mod.theme.font_label_m = mod.theme.font_label{font_size: 12.0 line_spacing: 1.1}
|
|
mod.theme.font_label_s = mod.theme.font_label{font_size: 11.0 line_spacing: 1.1}
|
|
|
|
// No surface material: every face that matters is drawn by the sheet.
|
|
mod.theme.material_level = 0.0
|
|
mod.theme.material_margin = 0.0
|
|
mod.theme.material_glow = 0.0
|
|
mod.theme.material_ink_glow = 0.0
|
|
mod.theme.color_material_glow = #x2f5f9e
|
|
true
|