AldoOrtega commited on
Commit
df56fc1
1 Parent(s): a17a2b8

Upload gradio_theme.py

Browse files
Files changed (1) hide show
  1. gradio_theme.py +104 -0
gradio_theme.py ADDED
@@ -0,0 +1,104 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import gradio as gr
2
+
3
+ primary_palette = gr.themes.Color(
4
+ c50="#282253",
5
+ c100="#282253",
6
+ c200="#282253",
7
+ c300="#282253",
8
+ c400="#282253",
9
+ c500="#282253",
10
+ c600="white",
11
+ c700="#EC5F9C",
12
+ c800="#EC4D92",
13
+ c900="#EB3A86",
14
+ c950='#E9277A',
15
+ )
16
+
17
+ css_variables = {
18
+ 'body_text_color_dark': '*neutral_800',
19
+ 'color_accent_soft_dark': '*primary_50',
20
+ 'background_fill_primary_dark': 'white',
21
+ 'background_fill_secondary_dark': '*neutral_50',
22
+ 'border_color_accent_dark': '*primary_300',
23
+ 'border_color_primary_dark': '*neutral_200',
24
+ 'link_text_color_dark': '*secondary_600',
25
+ 'link_text_color_active_dark': '*secondary_600',
26
+ 'link_text_color_hover_dark': '*secondary_700',
27
+ 'link_text_color_visited_dark': '*secondary_500',
28
+ 'body_text_color_subdued_dark': '*neutral_400',
29
+ 'shadow_spread_dark': '3px',
30
+ 'block_background_fill_dark': '*background_fill_primary',
31
+ 'block_border_color_dark': '*border_color_primary',
32
+ 'block_border_width_dark': '1px',
33
+ 'block_info_text_color_dark': '*body_text_color_subdued',
34
+ 'block_label_background_fill_dark': '*background_fill_primary',
35
+ 'block_label_border_color_dark': '*border_color_primary',
36
+ 'block_label_border_width_dark': '1px',
37
+ 'block_label_text_color_dark': '*neutral_500',
38
+ 'block_title_text_color_dark': '*neutral_500',
39
+ 'panel_background_fill_dark': '*background_fill_secondary',
40
+ 'panel_border_color_dark': '*border_color_primary',
41
+ 'panel_border_width_dark': '0',
42
+ 'checkbox_background_color_dark': '*background_fill_primary',
43
+ 'checkbox_background_color_focus_dark': '*checkbox_background_color',
44
+ 'checkbox_background_color_hover_dark': '*checkbox_background_color',
45
+ 'checkbox_background_color_selected_dark': '*secondary_600',
46
+ 'checkbox_border_color_dark': '*neutral_300',
47
+ 'checkbox_border_color_focus_dark': '*secondary_500',
48
+ 'checkbox_border_color_hover_dark': '*neutral_300',
49
+ 'checkbox_border_color_selected_dark': '*secondary_600',
50
+ 'checkbox_label_background_fill_dark': 'linear-gradient(to top, *neutral_50, white)',
51
+ 'checkbox_label_background_fill_hover_dark': 'linear-gradient(to top, *neutral_100, white)',
52
+ 'checkbox_label_background_fill_selected_dark': '*checkbox_label_background_fill',
53
+ 'checkbox_label_border_color_dark': '*border_color_primary',
54
+ 'checkbox_label_border_color_hover_dark': '*checkbox_label_border_color',
55
+ 'checkbox_label_border_width_dark': '*input_border_width',
56
+ 'checkbox_label_text_color_dark': '*body_text_color',
57
+ 'checkbox_label_text_color_selected_dark': '*checkbox_label_text_color',
58
+ 'error_background_fill_dark': 'linear-gradient(to right, #fee2e2, *background_fill_secondary)',
59
+ 'error_border_color_dark': '#fecaca',
60
+ 'error_border_width_dark': '1px',
61
+ 'error_text_color_dark': '#ef4444',
62
+ 'input_background_fill_dark': 'white',
63
+ 'input_background_fill_focus_dark': '*secondary_500',
64
+ 'input_background_fill_hover_dark': '*input_background_fill',
65
+ 'input_border_color_dark': '*border_color_primary',
66
+ 'input_border_color_focus_dark': '*secondary_300',
67
+ 'input_border_color_hover_dark': '*input_border_color',
68
+ 'input_border_width_dark': '1px',
69
+ 'input_placeholder_color_dark': '*neutral_400',
70
+ 'input_shadow_dark': '0 0 0 *shadow_spread transparent, *shadow_inset',
71
+ 'input_shadow_focus_dark': '0 0 0 *shadow_spread *secondary_50, *shadow_inset',
72
+ 'loader_color_dark': '*color_accent',
73
+ 'slider_color_dark': '',
74
+ 'stat_background_fill_dark': 'linear-gradient(to right, *primary_400, *primary_200)',
75
+ 'table_border_color_dark': '*neutral_300',
76
+ 'table_even_background_fill_dark': 'white',
77
+ 'table_odd_background_fill_dark': '*neutral_50',
78
+ 'table_row_focus_dark': '*color_accent_soft',
79
+ 'button_border_width_dark': '*input_border_width',
80
+ 'button_cancel_background_fill_dark': 'linear-gradient(to bottom right, #fee2e2, #fecaca)',
81
+ 'button_cancel_background_fill_hover_dark': 'linear-gradient(to bottom right, #fee2e2, #fee2e2)',
82
+ 'button_cancel_border_color_dark': '#fecaca',
83
+ 'button_cancel_border_color_hover_dark': '*button_cancel_border_color',
84
+ 'button_cancel_text_color_dark': '#dc2626',
85
+ 'button_cancel_text_color_hover_dark': '*button_cancel_text_color',
86
+ 'button_primary_background_fill_dark': 'linear-gradient(to bottom right, *primary_100, *primary_300)',
87
+ 'button_primary_background_fill_hover_dark': 'linear-gradient(to bottom right, *primary_100, *primary_200)',
88
+ 'button_primary_border_color_dark': '*primary_200',
89
+ 'button_primary_border_color_hover_dark': '*button_primary_border_color',
90
+ 'button_primary_text_color_dark': '*primary_600',
91
+ 'button_primary_text_color_hover_dark': '*button_primary_text_color',
92
+ 'button_secondary_background_fill_dark': 'linear-gradient(to bottom right, *neutral_100, *neutral_200)',
93
+ 'button_secondary_background_fill_hover_dark': 'linear-gradient(to bottom right, *neutral_100, *neutral_100)',
94
+ 'button_secondary_border_color_dark': '*neutral_200',
95
+ 'button_secondary_border_color_hover_dark': '*button_secondary_border_color',
96
+ 'button_secondary_text_color_dark': '*neutral_700',
97
+ 'button_secondary_text_color_hover_dark': '*button_secondary_text_color'
98
+ }
99
+
100
+ theme=gr.themes.Default(primary_hue=primary_palette)
101
+ theme.set(
102
+ body_background_fill='#F8F9FA',
103
+ body_background_fill_dark='#F8F9FA',
104
+ **css_variables)