NeoPy commited on
Commit
fad6406
·
verified ·
1 Parent(s): ad771f5

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +38 -120
app.py CHANGED
@@ -1,13 +1,9 @@
1
  from __future__ import annotations
2
-
3
  from typing import Iterable
4
  import gradio as gr
5
-
6
- # gr.themes.builder()
7
  from gradio.themes.base import Base
8
  from gradio.themes.utils import colors, fonts, sizes
9
 
10
-
11
  class Neopy(Base):
12
  def __init__(
13
  self,
@@ -40,6 +36,7 @@ class Neopy(Base):
40
  font_mono=font_mono,
41
  )
42
  self.name = ("Neopy",)
 
43
  self.secondary_100 = ("#b80000",)
44
  self.secondary_200 = ("#ff6b6b",)
45
  self.secondary_300 = ("#ff5252",)
@@ -48,12 +45,23 @@ class Neopy(Base):
48
  self.secondary_500 = ("#d31c1c",)
49
  self.secondary_600 = ("#eb2525",)
50
  self.secondary_700 = ("#d81d1d",)
51
- self.secondary_800 = ("#1e40af",)
52
  self.secondary_900 = ("#af1e1e",)
53
  self.secondary_950 = ("#601d1d",)
 
 
 
 
 
 
 
 
 
 
 
54
 
55
  super().set(
56
- # NeoRVC
57
  background_fill_primary="#110F0F",
58
  background_fill_primary_dark="#110F0F",
59
  background_fill_secondary="#110F0F",
@@ -61,198 +69,116 @@ class Neopy(Base):
61
  block_background_fill="*neutral_800",
62
  block_background_fill_dark="*neutral_800",
63
  block_border_color="*border_color_primary",
64
- block_border_color_dark="*border_color_primary",
65
  block_border_width="1px",
66
- block_border_width_dark="1px",
67
  block_info_text_color="*body_text_color_subdued",
68
- block_info_text_color_dark="*body_text_color_subdued",
69
  block_info_text_size="*text_sm",
70
  block_info_text_weight="400",
71
  block_label_background_fill="*background_fill_primary",
72
  block_label_background_fill_dark="*background_fill_secondary",
73
  block_label_border_color="*border_color_primary",
74
- block_label_border_color_dark="*border_color_primary",
75
  block_label_border_width="1px",
76
- block_label_border_width_dark="1px",
77
  block_label_margin="0",
78
  block_label_padding="*spacing_sm *spacing_lg",
79
  block_label_radius="calc(*radius_lg - 1px) 0 calc(*radius_lg - 1px) 0",
80
  block_label_right_radius="0 calc(*radius_lg - 1px) 0 calc(*radius_lg - 1px)",
81
  block_label_shadow="*block_shadow",
82
- block_label_text_color="*#110F0F",
83
- block_label_text_color_dark="*#110F0F",
84
  block_label_text_weight="400",
85
  block_padding="*spacing_xl",
86
  block_radius="*radius_md",
87
  block_shadow="none",
88
- block_shadow_dark="none",
89
  block_title_background_fill="rgb(255,255,255)",
90
- block_title_background_fill_dark="rgb(255,255,255)",
91
  block_title_border_color="none",
92
- block_title_border_color_dark="none",
93
  block_title_border_width="0px",
94
  block_title_padding="*block_label_padding",
95
  block_title_radius="*block_label_radius",
96
- block_title_text_color="#110F0F",
97
- block_title_text_color_dark="#110F0F",
98
  block_title_text_size="*text_md",
99
  block_title_text_weight="600",
100
  body_background_fill="#110F0F",
101
- body_background_fill_dark="#110F0F",
102
  body_text_color="white",
103
- body_text_color_dark="white",
104
  body_text_color_subdued="#cecece",
105
- body_text_color_subdued_dark="#cecece",
106
  body_text_size="*text_md",
107
  body_text_weight="400",
108
- border_color_accent="*neutral_600",
109
- border_color_accent_dark="*neutral_600",
110
  border_color_primary="*neutral_800",
111
- border_color_primary_dark="*neutral_800",
112
  button_border_width="*input_border_width",
113
- button_border_width_dark="*input_border_width",
114
  button_cancel_background_fill="*button_secondary_background_fill",
115
- button_cancel_background_fill_dark="*button_secondary_background_fill",
116
- button_cancel_background_fill_hover="*button_cancel_background_fill",
117
- button_cancel_background_fill_hover_dark="*button_cancel_background_fill",
118
  button_cancel_border_color="*button_secondary_border_color",
119
- button_cancel_border_color_dark="*button_secondary_border_color",
120
- button_cancel_border_color_hover="*button_cancel_border_color",
121
- button_cancel_border_color_hover_dark="*button_cancel_border_color",
122
  button_cancel_text_color="#110F0F",
123
- button_cancel_text_color_dark="#110F0F",
124
- button_cancel_text_color_hover="#110F0F",
125
- button_cancel_text_color_hover_dark="#110F0F",
126
  button_large_padding="*spacing_lg calc(2 * *spacing_lg)",
127
  button_large_radius="*radius_lg",
128
  button_large_text_size="*text_lg",
129
  button_large_text_weight="600",
130
- button_primary_background_fill="*primary_600",
131
- button_primary_background_fill_dark="*primary_600",
132
  button_primary_background_fill_hover="*primary_500",
133
- button_primary_background_fill_hover_dark="*primary_500",
134
  button_primary_border_color="*primary_500",
135
- button_primary_border_color_dark="*primary_500",
136
  button_primary_border_color_hover="*primary_400",
137
- button_primary_border_color_hover_dark="*primary_400",
138
  button_primary_text_color="white",
139
- button_primary_text_color_dark="white",
140
- button_primary_text_color_hover="#110F0F",
141
- button_primary_text_color_hover_dark="#110F0F",
142
  button_secondary_background_fill="transparent",
143
- button_secondary_background_fill_dark="transparent",
144
  button_secondary_background_fill_hover="*neutral_800",
145
- button_secondary_background_fill_hover_dark="*neutral_800",
146
  button_secondary_border_color="*neutral_700",
147
- button_secondary_border_color_dark="*neutral_700",
148
- button_secondary_border_color_hover="*neutral_600",
149
- button_secondary_border_color_hover_dark="*neutral_600",
150
  button_secondary_text_color="white",
151
- button_secondary_text_color_dark="white",
152
- button_secondary_text_color_hover="*button_secondary_text_color",
153
- button_secondary_text_color_hover_dark="*button_secondary_text_color",
154
  button_small_padding="*spacing_sm calc(2 * *spacing_sm)",
155
  button_small_radius="*radius_lg",
156
  button_small_text_size="*text_md",
157
  button_small_text_weight="400",
158
  button_transition="0.3s ease all",
 
159
  checkbox_background_color="*neutral_700",
160
- checkbox_background_color_dark="*neutral_700",
161
- checkbox_background_color_focus="*checkbox_background_color",
162
- checkbox_background_color_focus_dark="*checkbox_background_color",
163
- checkbox_background_color_hover="*checkbox_background_color",
164
- checkbox_background_color_hover_dark="*checkbox_background_color",
165
- checkbox_background_color_selected="*secondary_600",
166
- checkbox_background_color_selected_dark="*secondary_600",
167
  checkbox_border_color="*neutral_700",
168
- checkbox_border_color_dark="*neutral_700",
169
- checkbox_border_color_focus="*secondary_500",
170
- checkbox_border_color_focus_dark="*secondary_500",
171
- checkbox_border_color_hover="*neutral_600",
172
- checkbox_border_color_hover_dark="*neutral_600",
173
- checkbox_border_color_selected="*secondary_600",
174
- checkbox_border_color_selected_dark="*secondary_600",
175
  checkbox_border_radius="*radius_sm",
176
  checkbox_border_width="*input_border_width",
177
- checkbox_border_width_dark="*input_border_width",
178
  checkbox_check="url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e\")",
179
  checkbox_label_background_fill="transparent",
180
- checkbox_label_background_fill_dark="transparent",
181
- checkbox_label_background_fill_hover="transparent",
182
- checkbox_label_background_fill_hover_dark="transparent",
183
- checkbox_label_background_fill_selected="transparent",
184
- checkbox_label_background_fill_selected_dark="transparent",
185
  checkbox_label_border_color="transparent",
186
- checkbox_label_border_color_dark="transparent",
187
- checkbox_label_border_color_hover="transparent",
188
- checkbox_label_border_color_hover_dark="transparent",
189
  checkbox_label_border_width="transparent",
190
- checkbox_label_border_width_dark="transparent",
191
  checkbox_label_gap="*spacing_lg",
192
  checkbox_label_padding="*spacing_md calc(2 * *spacing_md)",
193
  checkbox_label_shadow="none",
194
  checkbox_label_text_color="*body_text_color",
195
- checkbox_label_text_color_dark="*body_text_color",
196
- checkbox_label_text_color_selected="*checkbox_label_text_color",
197
- checkbox_label_text_color_selected_dark="*checkbox_label_text_color",
198
  checkbox_label_text_size="*text_md",
199
  checkbox_label_text_weight="400",
200
  checkbox_shadow="*input_shadow",
201
  color_accent="*primary_500",
202
  color_accent_soft="*primary_50",
203
- color_accent_soft_dark="*neutral_700",
204
  container_radius="*radius_xl",
205
  embed_radius="*radius_lg",
 
206
  error_background_fill="*background_fill_primary",
207
- error_background_fill_dark="*background_fill_primary",
208
  error_border_color="*border_color_primary",
209
- error_border_color_dark="*border_color_primary",
210
  error_border_width="1px",
211
- error_border_width_dark="1px",
212
- error_text_color="#8a0000",
213
- error_text_color_dark="#ff0000",
214
  form_gap_width="0px",
 
215
  input_background_fill="*neutral_900",
216
- input_background_fill_dark="*neutral_900",
217
- input_background_fill_focus="*secondary_600",
218
- input_background_fill_focus_dark="*secondary_600",
219
- input_background_fill_hover="*input_background_fill",
220
- input_background_fill_hover_dark="*input_background_fill",
221
  input_border_color="*neutral_700",
222
- input_border_color_dark="*neutral_700",
223
- input_border_color_focus="*secondary_600",
224
- input_border_color_focus_dark="*primary_600",
225
- input_border_color_hover="*input_border_color",
226
- input_border_color_hover_dark="*input_border_color",
227
  input_border_width="1px",
228
- input_border_width_dark="1px",
229
  input_padding="*spacing_xl",
230
  input_placeholder_color="*neutral_500",
231
- input_placeholder_color_dark="*neutral_500",
232
  input_radius="*radius_lg",
233
  input_shadow="none",
234
- input_shadow_dark="none",
235
- input_shadow_focus="*input_shadow",
236
- input_shadow_focus_dark="*input_shadow",
237
  input_text_size="*text_md",
238
  input_text_weight="400",
239
  layout_gap="*spacing_xxl",
240
- link_text_color="*secondary_500",
241
- link_text_color_active="*secondary_500",
242
- link_text_color_active_dark="*secondary_500",
243
- link_text_color_dark="*secondary_500",
244
- link_text_color_hover="*secondary_400",
245
- link_text_color_hover_dark="*secondary_400",
246
- link_text_color_visited="*secondary_600",
247
- link_text_color_visited_dark="*secondary_600",
248
  loader_color="*color_accent",
249
- loader_color_dark="*color_accent",
250
  panel_background_fill="*background_fill_secondary",
251
- panel_background_fill_dark="*background_fill_secondary",
252
  panel_border_color="*border_color_primary",
253
- panel_border_color_dark="*border_color_primary",
254
  panel_border_width="1px",
255
- panel_border_width_dark="1px",
256
  prose_header_text_weight="600",
257
  prose_text_size="*text_md",
258
  prose_text_weight="400",
@@ -263,24 +189,16 @@ class Neopy(Base):
263
  shadow_drop_lg="0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
264
  shadow_inset="rgba(0,0,0,0.05) 0px 2px 4px 0px inset",
265
  shadow_spread="3px",
266
- shadow_spread_dark="1px",
267
- slider_color="#ff0000",
268
- slider_color_dark="#ff0000",
269
  stat_background_fill="*primary_500",
270
- stat_background_fill_dark="*primary_500",
271
  table_border_color="*neutral_700",
272
- table_border_color_dark="*neutral_700",
273
  table_even_background_fill="*neutral_950",
274
- table_even_background_fill_dark="*neutral_950",
275
  table_odd_background_fill="*neutral_900",
276
- table_odd_background_fill_dark="*neutral_900",
277
  table_radius="*radius_lg",
278
  table_row_focus="*color_accent_soft",
279
- table_row_focus_dark="*color_accent_soft",
280
  )
281
 
282
-
283
- theme = Neopy()
284
 
285
 
286
 
 
1
  from __future__ import annotations
 
2
  from typing import Iterable
3
  import gradio as gr
 
 
4
  from gradio.themes.base import Base
5
  from gradio.themes.utils import colors, fonts, sizes
6
 
 
7
  class Neopy(Base):
8
  def __init__(
9
  self,
 
36
  font_mono=font_mono,
37
  )
38
  self.name = ("Neopy",)
39
+ # Secondary palette (red, used for errors/warnings)
40
  self.secondary_100 = ("#b80000",)
41
  self.secondary_200 = ("#ff6b6b",)
42
  self.secondary_300 = ("#ff5252",)
 
45
  self.secondary_500 = ("#d31c1c",)
46
  self.secondary_600 = ("#eb2525",)
47
  self.secondary_700 = ("#d81d1d",)
48
+ self.secondary_800 = ("#1e40af",) # Note: This seems out of place (blue in red palette), but kept as is
49
  self.secondary_900 = ("#af1e1e",)
50
  self.secondary_950 = ("#601d1d",)
51
+ # New primary palette (blue, for main accents)
52
+ self.primary_50 = ("#eff6ff",)
53
+ self.primary_100 = ("#dbeafe",)
54
+ self.primary_200 = ("#bfdbfe",)
55
+ self.primary_300 = ("#93c5fd",)
56
+ self.primary_400 = ("#60a5fa",)
57
+ self.primary_500 = ("#3b82f6",)
58
+ self.primary_600 = ("#2563eb",)
59
+ self.primary_700 = ("#1d4ed8",)
60
+ self.primary_800 = ("#1e40af",)
61
+ self.primary_900 = ("#1e3a8a",)
62
 
63
  super().set(
64
+ # Backgrounds
65
  background_fill_primary="#110F0F",
66
  background_fill_primary_dark="#110F0F",
67
  background_fill_secondary="#110F0F",
 
69
  block_background_fill="*neutral_800",
70
  block_background_fill_dark="*neutral_800",
71
  block_border_color="*border_color_primary",
 
72
  block_border_width="1px",
 
73
  block_info_text_color="*body_text_color_subdued",
 
74
  block_info_text_size="*text_sm",
75
  block_info_text_weight="400",
76
  block_label_background_fill="*background_fill_primary",
77
  block_label_background_fill_dark="*background_fill_secondary",
78
  block_label_border_color="*border_color_primary",
 
79
  block_label_border_width="1px",
 
80
  block_label_margin="0",
81
  block_label_padding="*spacing_sm *spacing_lg",
82
  block_label_radius="calc(*radius_lg - 1px) 0 calc(*radius_lg - 1px) 0",
83
  block_label_right_radius="0 calc(*radius_lg - 1px) 0 calc(*radius_lg - 1px)",
84
  block_label_shadow="*block_shadow",
85
+ block_label_text_color="*body_text_color", # Fixed to white for visibility
86
+ block_label_text_color_dark="*body_text_color",
87
  block_label_text_weight="400",
88
  block_padding="*spacing_xl",
89
  block_radius="*radius_md",
90
  block_shadow="none",
 
91
  block_title_background_fill="rgb(255,255,255)",
 
92
  block_title_border_color="none",
 
93
  block_title_border_width="0px",
94
  block_title_padding="*block_label_padding",
95
  block_title_radius="*block_label_radius",
96
+ block_title_text_color="#110F0F", # Dark text on white background
 
97
  block_title_text_size="*text_md",
98
  block_title_text_weight="600",
99
  body_background_fill="#110F0F",
 
100
  body_text_color="white",
 
101
  body_text_color_subdued="#cecece",
 
102
  body_text_size="*text_md",
103
  body_text_weight="400",
104
+ border_color_accent="*primary_500",
 
105
  border_color_primary="*neutral_800",
106
+ # Buttons
107
  button_border_width="*input_border_width",
 
108
  button_cancel_background_fill="*button_secondary_background_fill",
 
 
 
109
  button_cancel_border_color="*button_secondary_border_color",
 
 
 
110
  button_cancel_text_color="#110F0F",
 
 
 
111
  button_large_padding="*spacing_lg calc(2 * *spacing_lg)",
112
  button_large_radius="*radius_lg",
113
  button_large_text_size="*text_lg",
114
  button_large_text_weight="600",
115
+ button_primary_background_fill="*primary_600", # Blue buttons
 
116
  button_primary_background_fill_hover="*primary_500",
 
117
  button_primary_border_color="*primary_500",
 
118
  button_primary_border_color_hover="*primary_400",
 
119
  button_primary_text_color="white",
120
+ button_primary_text_color_hover="white", # Changed for contrast on blue
 
 
121
  button_secondary_background_fill="transparent",
 
122
  button_secondary_background_fill_hover="*neutral_800",
 
123
  button_secondary_border_color="*neutral_700",
 
 
 
124
  button_secondary_text_color="white",
 
 
 
125
  button_small_padding="*spacing_sm calc(2 * *spacing_sm)",
126
  button_small_radius="*radius_lg",
127
  button_small_text_size="*text_md",
128
  button_small_text_weight="400",
129
  button_transition="0.3s ease all",
130
+ # Checkboxes
131
  checkbox_background_color="*neutral_700",
132
+ checkbox_background_color_selected="*primary_500", # Blue when selected
 
 
 
 
 
 
133
  checkbox_border_color="*neutral_700",
134
+ checkbox_border_color_focus="*primary_500",
135
+ checkbox_border_color_selected="*primary_500",
 
 
 
 
 
136
  checkbox_border_radius="*radius_sm",
137
  checkbox_border_width="*input_border_width",
 
138
  checkbox_check="url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e\")",
139
  checkbox_label_background_fill="transparent",
 
 
 
 
 
140
  checkbox_label_border_color="transparent",
 
 
 
141
  checkbox_label_border_width="transparent",
 
142
  checkbox_label_gap="*spacing_lg",
143
  checkbox_label_padding="*spacing_md calc(2 * *spacing_md)",
144
  checkbox_label_shadow="none",
145
  checkbox_label_text_color="*body_text_color",
 
 
 
146
  checkbox_label_text_size="*text_md",
147
  checkbox_label_text_weight="400",
148
  checkbox_shadow="*input_shadow",
149
  color_accent="*primary_500",
150
  color_accent_soft="*primary_50",
 
151
  container_radius="*radius_xl",
152
  embed_radius="*radius_lg",
153
+ # Errors
154
  error_background_fill="*background_fill_primary",
 
155
  error_border_color="*border_color_primary",
 
156
  error_border_width="1px",
157
+ error_text_color="*secondary_700", # Red for errors
158
+ error_text_color_dark="*secondary_600",
 
159
  form_gap_width="0px",
160
+ # Inputs
161
  input_background_fill="*neutral_900",
162
+ input_background_fill_focus="*primary_50", # Light blue when focused
 
 
 
 
163
  input_border_color="*neutral_700",
164
+ input_border_color_focus="*primary_500", # Blue border when focused
 
 
 
 
165
  input_border_width="1px",
 
166
  input_padding="*spacing_xl",
167
  input_placeholder_color="*neutral_500",
 
168
  input_radius="*radius_lg",
169
  input_shadow="none",
 
 
 
170
  input_text_size="*text_md",
171
  input_text_weight="400",
172
  layout_gap="*spacing_xxl",
173
+ # Links
174
+ link_text_color="*primary_500", # Blue links
175
+ link_text_color_active="*primary_500",
176
+ link_text_color_hover="*primary_400",
177
+ link_text_color_visited="*primary_600",
 
 
 
178
  loader_color="*color_accent",
 
179
  panel_background_fill="*background_fill_secondary",
 
180
  panel_border_color="*border_color_primary",
 
181
  panel_border_width="1px",
 
182
  prose_header_text_weight="600",
183
  prose_text_size="*text_md",
184
  prose_text_weight="400",
 
189
  shadow_drop_lg="0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)",
190
  shadow_inset="rgba(0,0,0,0.05) 0px 2px 4px 0px inset",
191
  shadow_spread="3px",
192
+ slider_color="*primary_500", # Blue slider
 
 
193
  stat_background_fill="*primary_500",
 
194
  table_border_color="*neutral_700",
 
195
  table_even_background_fill="*neutral_950",
 
196
  table_odd_background_fill="*neutral_900",
 
197
  table_radius="*radius_lg",
198
  table_row_focus="*color_accent_soft",
 
199
  )
200
 
201
+ theme = Neopy()
 
202
 
203
 
204