Create theme_tops
Browse files- theme_tops +74 -0
theme_tops
ADDED
@@ -0,0 +1,74 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
from gradio.themes.base import Base
|
2 |
+
from gradio.themes import Color, Size
|
3 |
+
|
4 |
+
|
5 |
+
class DarkTheme(Base):
|
6 |
+
def __init__(self):
|
7 |
+
super().__init__()
|
8 |
+
|
9 |
+
# Primary colors
|
10 |
+
self.primary_hue = Color(
|
11 |
+
c50="#484848",
|
12 |
+
c100="#484848",
|
13 |
+
c200="#484848",
|
14 |
+
c300="#484848",
|
15 |
+
c400="#484848",
|
16 |
+
c500="#484848",
|
17 |
+
c600="#484848",
|
18 |
+
c700="#484848",
|
19 |
+
c800="#484848",
|
20 |
+
c900="#484848",
|
21 |
+
c950="#484848",
|
22 |
+
)
|
23 |
+
|
24 |
+
# Background colors
|
25 |
+
self.background_fill_primary = "#242424"
|
26 |
+
self.background_fill_secondary = "#2b2b2b"
|
27 |
+
self.border_color_primary = "#3a3a3a"
|
28 |
+
|
29 |
+
# Text colors
|
30 |
+
self.text_color = "#ffffff"
|
31 |
+
self.text_color_subdued = "#cccccc"
|
32 |
+
self.body_text_color = "#ffffff"
|
33 |
+
self.error_text_color = "#ff5757"
|
34 |
+
|
35 |
+
# Component colors
|
36 |
+
self.button_primary_background_fill = "#ffd700" # Yellow button
|
37 |
+
self.button_primary_text_color = "#000000"
|
38 |
+
self.block_title_text_color = "#ffd700" # Yellow titles
|
39 |
+
self.block_label_text_color = "#cccccc"
|
40 |
+
|
41 |
+
# Borders and spacing
|
42 |
+
self.border_color_accent = "#3a3a3a"
|
43 |
+
self.radius_size = Size(
|
44 |
+
xxs="2px",
|
45 |
+
xs="3px",
|
46 |
+
sm="4px",
|
47 |
+
md="6px",
|
48 |
+
lg="8px",
|
49 |
+
xl="10px",
|
50 |
+
xxl="12px",
|
51 |
+
)
|
52 |
+
|
53 |
+
# Shadows
|
54 |
+
self.shadow_drop = "0 1px 3px 0 rgba(0, 0, 0, 0.1)"
|
55 |
+
self.shadow_drop_lg = "0 4px 6px -1px rgba(0, 0, 0, 0.1)"
|
56 |
+
|
57 |
+
# Input elements
|
58 |
+
self.input_background_fill = "#2b2b2b"
|
59 |
+
self.input_border_color = "#3a3a3a"
|
60 |
+
self.input_shadow = "0 1px 2px 0 rgba(0, 0, 0, 0.05)"
|
61 |
+
|
62 |
+
# Table styles
|
63 |
+
self.table_border_color = "#3a3a3a"
|
64 |
+
self.table_row_even_background_fill = "#2b2b2b"
|
65 |
+
self.table_row_odd_background_fill = "#242424"
|
66 |
+
|
67 |
+
# Checkbox and radio
|
68 |
+
self.checkbox_background_color = "#2b2b2b"
|
69 |
+
self.checkbox_border_color = "#3a3a3a"
|
70 |
+
self.checkbox_background_color_selected = "#ffd700"
|
71 |
+
|
72 |
+
# Slider
|
73 |
+
self.slider_color = "#ffd700"
|
74 |
+
self.slider_background_color = "#3a3a3a"
|