@fruits-chain/react-native-xiaoshu/lib/module/theme/default-var.js

React Native UI library

/* eslint-disable @typescript-eslint/no-inferrable-types */
// Padding
export const padding_base = 4;
export const padding_xs = padding_base * 2;
export const padding_sm = padding_base * 3;
export const padding_md = padding_base * 4;
export const padding_lg = padding_base * 6;
export const padding_xl = padding_base * 8; // 标准通用色

export const white = '#FFF';
export const primary = '#0065FE';
export const success = '#24B356';
export const warning = '#FE7A33';
export const error = '#FF3341';
export const auxiliary_color_1 = '#7566FF';
export const auxiliary_color_2 = '#009DF2';
export const auxiliary_color_3 = '#FE9D00';
export const auxiliary_color_4 = '#FE5500';
export const auxiliary_color_5 = '#6B7D99';
export const active_opacity = 0.6;
export const active_img_opacity = 0.4; // 文字颜色

export const text_color_1 = '#11151A';
export const text_color_2 = '#5A6068';
export const text_color_3 = '#8C9199';
export const text_color_4 = '#B9BDC5'; // 页面背景

export const page_bg_color = '#ECEEF1';
export const underlay_color = 'transparent';
export const underlay_color_ddd = '#F7F9FC'; // 分割线颜色

export const divider_color_1 = '#E8E8E8';
export const divider_color_2 = '#F2F2F2'; // 字号

export const font_size_h1 = 22;
export const font_size_h2 = 20;
export const font_size_h3 = 18;
export const font_size_h4 = 16;
export const font_size_h5 = 15;
export const font_size_text = 14;
export const font_size_subtitle = 12;
export const line_height_xs = 14;
export const line_height_sm = 18;
export const line_height_md = 20;
export const line_height_lg = 22;
export const background_color_1 = '#EDEFF2';
export const background_color_2 = '#F7F9FC'; // Animation

export const animation_duration_base = 300;
export const animation_duration_fast = 200; // Border

export const border_color = divider_color_1;
export const border_width_base = 1;
export const border_radius_sm = 4;
export const border_radius_md = 8;
export const border_radius_lg = 16;
export const border_radius_max = 999; // 似乎需要调用的时候传入比较合适

export const page_header_height = 44; // ActionSheet

export const action_sheet_header_height = 48;
export const action_sheet_header_font_size = font_size_h4;
export const action_sheet_description_color = text_color_2;
export const action_sheet_description_font_size = font_size_text;
export const action_sheet_description_line_height = line_height_md;
export const action_sheet_item_background = white;
export const action_sheet_item_font_size = font_size_h5;
export const action_sheet_item_disabled_text_color = text_color_3;
export const action_sheet_subname_color = text_color_1;
export const action_sheet_subname_font_size = font_size_text;
export const action_sheet_subname_line_height = line_height_sm;
export const action_sheet_cancel_text_color = text_color_2;
export const action_sheet_cancel_padding_top = padding_xs;
export const action_sheet_cancel_padding_color = background_color_1;
export const action_sheet_loading_icon_size = 22; // Badge

export const badge_size = 16;
export const badge_color = white;
export const badge_padding_vertical = 0;
export const badge_padding_horizontal = 3;
export const badge_font_size = 10;
export const badge_font_weight = 'bold';
export const badge_background_color = error;
export const badge_dot_size = 8; // BottomBar

export const bottom_bar_height = 50;
export const bottom_bar_background_color = '#fff'; // Button

export const button_mini_height = 24;
export const button_mini_font_size = font_size_subtitle;
export const button_mini_loading_size = 14;
export const button_small_height = 32;
export const button_small_font_size = font_size_text;
export const button_small_loading_size = 20;
export const button_normal_height = 40;
export const button_normal_font_size = font_size_h5;
export const button_normal_loading_size = 20;
export const button_large_height = 50;
export const button_large_font_size = font_size_h4;
export const button_large_loading_size = 24;
export const button_default_height = 44;
export const button_default_font_size = font_size_h4;
export const button_default_loading_size = 24;
export const button_default_color = primary;
export const button_default_background_color = white;
export const button_default_border_color = white;
export const button_primary_color = white;
export const button_primary_background_color = primary;
export const button_primary_border_color = primary;
export const button_success_color = white;
export const button_success_background_color = success;
export const button_success_border_color = success;
export const button_error_color = white;
export const button_error_background_color = error;
export const button_error_border_color = error;
export const button_warning_color = white;
export const button_warning_background_color = warning;
export const button_warning_border_color = warning;
export const button_info_color = primary;
export const button_info_background_color = '#EFF5FE';
export const button_info_border_color = '#EFF5FE';
export const button_link_color = primary;
export const button_link_background_color = 'transparent';
export const button_link_border_color = 'transparent';
export const button_border_width = border_width_base;
export const button_border_radius = border_radius_sm;
export const button_ghost_background_color = 'transparent';
export const button_disabled_opacity = active_opacity;
export const button_active_opacity = 0.4; // ButtonBar

export const button_bar_padding_horizontal = padding_sm;
export const button_bar_button_space = 8; // Cell

export const cell_group_title_padding_horizontal = padding_sm;
export const cell_group_title_padding_top = padding_xs;
export const cell_group_title_padding_bottom = padding_xs;
export const cell_group_title_color = text_color_1;
export const cell_group_title_font_size = font_size_h5;
export const cell_group_title_line_height = 28;
export const cell_border_color = divider_color_2;
export const cell_icon_size = font_size_h5;
export const cell_icon_color = text_color_3;
export const cell_active_color = underlay_color_ddd;
export const cell_font_size = font_size_text;
export const cell_background_color = white;
export const cell_padding_vertical = padding_sm;
export const cell_padding_horizontal = padding_sm;
export const cell_mini_height = 50;
export const cell_title_text_color = text_color_1;
export const cell_title_height = 32;
export const cell_title_line_height = 22;
export const cell_value_text_color = text_color_2;
export const cell_required_color = error; // Checkbox

export const checkbox_icon_size = 20;
export const checkbox_icon_color = text_color_3;
export const checkbox_icon_disabled_color = text_color_2;
export const checkbox_checked_icon_color = primary;
export const checkbox_checked_icon_disabled_color = text_color_2;
export const checkbox_label_color = text_color_1;
export const checkbox_label_margin = padding_xs;
export const checkbox_disabled_label_color = text_color_3; // Collapse

export const collapse_transition_duration = animation_duration_base;
export const collapse_title_font_size = font_size_h4;
export const collapse_title_line_height = 24;
export const collapse_title_padding_vertical = 10;
export const collapse_title_padding_horizontal = padding_md;
export const collapse_title_text_color = text_color_1;
export const collapse_title_icon_color = text_color_1;
export const collapse_title_icon_size = font_size_h4;
export const collapse_title_border_color = border_color;
export const collapse_title_background_color = white;
export const collapse_content_background_color = white;
export const collapse_content_padding_horizontal = padding_md; // Dialog

export const dialog_width = 300;
export const dialog_transition = animation_duration_base;
export const dialog_border_radius = 16;
export const dialog_background_color = white;
export const dialog_header_font_weight = 'bold';
export const dialog_header_line_height = 24;
export const dialog_header_margin_top = 30;
export const dialog_header_font_size = 18;
export const dialog_message_margin_top = 12;
export const dialog_message_padding_horizontal = padding_lg;
export const dialog_message_font_size = 16;
export const dialog_message_line_height = 22;
export const dialog_message_text_color = text_color_2;
export const dialog_footer_margin_top = 32;
export const dialog_button_height = 52;
export const dialog_button_font_size = 18;
export const dialog_confirm_button_text_color = primary;
export const dialog_cancel_button_text_color = text_color_2; // Divider

export const divider_margin_vertical = padding_md;
export const divider_margin_horizontal = padding_md;
export const divider_text_color = text_color_1;
export const divider_font_size = font_size_h5;
export const divider_line_height = 24;
export const divider_border_color = divider_color_1;
export const divider_content_padding = padding_md;
export const divider_content_left_width = '10%';
export const divider_content_right_width = '10%'; // DropdownMenu

export const dropdown_menu_height = 48;
export const dropdown_menu_background_color = white;
export const dropdown_menu_title_font_size = 15;
export const dropdown_menu_title_text_color = text_color_1;
export const dropdown_menu_title_active_text_color = primary;
export const dropdown_menu_title_disabled_text_color = text_color_3;
export const dropdown_menu_title_padding_horizontal = padding_base;
export const dropdown_menu_title_line_height = line_height_lg;
export const dropdown_menu_title_icon_size = 12;
export const dropdown_menu_option_active_color = primary; // Empty

export const empty_image_width = 130;
export const empty_image_height = 115;
export const empty_text_color = text_color_3;
export const empty_text_font_size = font_size_text;
export const empty_text_line_height = 20; // Icon

export const icon_color = text_color_2;
export const icon_disabled_color = text_color_4; // Loading

export const loading_text_color = text_color_1;
export const loading_text_font_size = font_size_h5;
export const loading_spinner_color = primary;
export const loading_spinner_size = 24;
export const loading_spinner_animation_duration = 800; // NavBar

export const nav_bar_arrow_size = 20;
export const nav_bar_height = 44;
export const nav_bar_background_color = '#FFF';
export const nav_bar_title_text_color = text_color_1;
export const nav_bar_title_font_size = font_size_h4;
export const nav_bar_icon_color = text_color_1; // NoticeBar

export const notice_bar_padding_vertical = padding_xs;
export const notice_bar_padding_horizontal = padding_md;
export const notice_bar_text_line_height = 20;
export const notice_bar_text_font_size = font_size_text;
export const notice_bar_icon_size = font_size_text;
export const notice_bar_icon_margin_horizontal = padding_xs;
export const notice_bar_primary_background_color = '#E6F0FF';
export const notice_bar_primary_text_color = primary;
export const notice_bar_success_background_color = '#EBFFF2';
export const notice_bar_success_text_color = success;
export const notice_bar_warning_background_color = '#FEEDE5';
export const notice_bar_warning_text_color = warning;
export const notice_bar_error_background_color = '#FFEBEC';
export const notice_bar_error_text_color = error; // Notify

export const notify_text_color = white;
export const notify_padding_vertical = padding_xs;
export const notify_padding_horizontal = padding_md;
export const notify_font_size = font_size_h5;
export const notify_line_height = line_height_md;
export const notify_primary_background_color = primary;
export const notify_success_background_color = success;
export const notify_error_background_color = error;
export const notify_warning_background_color = warning; // Overlay

export const overlay_z_index = 10;
export const overlay_background_color = 'rgba(0, 0, 0, 0.7)'; // Popup

export const popup_background_color = white;
export const popup_round_border_radius = border_radius_lg;
export const popup_close_icon_size = 24;
export const popup_close_icon_color = text_color_2; // Progress

export const progress_height = 4;
export const progress_color = primary;
export const progress_background_color = background_color_1;
export const progress_pivot_horizontal_padding = 5;
export const progress_pivot_text_color = white;
export const progress_pivot_font_size = font_size_subtitle;
export const progress_pivot_line_height_scale = 1.6;
export const progress_pivot_background_color = primary;
export const progress_page_background_color = white; // SelectPopup

export const select_popup_min_height = 270;
export const select_popup_option_text_line_height = 50;
export const select_popup_body_padding_horizontal = padding_sm; // Steps

export const steps_background_color = primary;
export const steps_padding_vertical = padding_md;
export const steps_padding_horizontal = padding_lg;
export const steps_icon_dot_size = 10;
export const steps_icon_dot_active_size = 16;
export const steps_icon_success_active_size = 16;
export const steps_title_size = font_size_h5;
export const steps_title_color = white; // Switch

export const switch_size = 30;
export const switch_width_ratio = 2; // 原变量中使用了 em，这里改成对应的比例

export const switch_height_ratio = 1; // 原变量中使用了 em，这里改成对应的比例

export const switch_node_size_ratio = 1; // 原变量中使用了 em，这里改成对应的比例

export const switch_node_background_color = white;
export const switch_background_color = white;
export const switch_on_background_color = primary;
export const switch_transition_duration = animation_duration_base;
export const switch_disabled_opacity = active_opacity;
export const switch_border_width = border_width_base;
export const switch_border_style = 'solid';
export const switch_border_color = 'rgba(0, 0, 0, 0.1)'; // TabBar

export const tab_bar_text_font_size = 10;
export const tab_bar_text_margin_top = 4;
export const tab_bar_text_color = text_color_3;
export const tab_bar_icon_color = text_color_3;
export const tab_bar_active_text_color = primary;
export const tab_bar_active_icon_color = primary; // Tag

export const tag_padding_horizontal = padding_base;
export const tag_text_color = white;
export const tag_font_size = font_size_subtitle;
export const tag_border_radius = 2;
export const tag_small_padding_vertical = 0;
export const tag_small_padding_horizontal = 0;
export const tag_medium_padding_vertical = 2;
export const tag_medium_padding_horizontal = 6;
export const tag_large_padding_vertical = padding_base;
export const tag_large_padding_horizontal = padding_xs;
export const tag_large_border_radius = border_radius_md;
export const tag_large_font_size = font_size_h5;
export const tag_round_border_radius = border_radius_max;
export const tag_primary_color = primary;
export const tag_success_color = success;
export const tag_warning_color = warning;
export const tag_error_color = error;
export const tag_default_color = text_color_2;
export const tag_ghost_bg_color = 'transparent'; // TextInput

export const text_input_selection_color = primary;
export const text_input_placeholder_text_color = text_color_4;
export const text_input_color = text_color_1;
export const text_input_disabled_color = text_color_3;
export const text_input_disabled_background_color = '#EFEFF1';
export const text_input_large_font_size = font_size_h4;
export const text_input_middle_font_size = font_size_h5;
export const text_input_small_font_size = font_size_h5;
export const text_input_padding_horizontal = padding_xs; // export const text_input_padding_vertical = padding_xs

export const text_input_large_min_height = 40;
export const text_input_middle_min_height = 32;
export const text_input_small_min_height = 24;
export const text_input_clearable_size = 16;
export const text_input_clearable_background_color = text_color_4;
export const text_input_clearable_color = '#fff';
export const text_input_fix_text_color = text_color_1;
export const text_input_addon_text_color = text_color_1;
export const text_input_light_accessory_background_color = '#f7f7f7';
export const text_input_dark_accessory_background_color = '#575757';
export const text_input_dark_accessory_padding_horizontal = padding_sm;
export const text_input_accessory_font_size = font_size_h4;
export const text_input_accessory_height = 44;
export const text_input_accessory_text_color = primary; // Result

export const result_success_color = success;
export const result_error_color = error;
export const result_info_color = primary;
export const result_warning_color = warning;
export const result_icon_size = 72;
export const result_title_font_size = font_size_h3;
export const result_title_color = text_color_1;
export const result_subtitle_font_size = font_size_text;
export const result_subtitle_color = text_color_2; // Toast

export const toast_max_width = '70%';
export const toast_font_size = font_size_text;
export const toast_text_color = white;
export const toast_loading_icon_color = white;
export const toast_line_height = line_height_md;
export const toast_border_radius = border_radius_lg;
export const toast_text_border_radius = border_radius_md;
export const toast_background_color = 'rgba(0,0,0,0.7)';
export const toast_icon_size = 36;
export const toast_text_min_width = 96;
export const toast_text_padding_vertical = padding_xs;
export const toast_text_padding_horizontal = padding_sm;
export const toast_default_padding_vertical = padding_md;
export const toast_default_padding_horizontal = padding_md;
export const toast_default_width = 88 + padding_md * 2; // box-sizing: content-box 但是 RN 无法设置，计算了一下

export const toast_default_min_height = 88 + padding_md * 2;
export const toast_position_top_distance = '20%';
export const toast_position_bottom_distance = '20%';
//# sourceMappingURL=default-var.js.map