K00B404 commited on
Commit
21df871
·
verified ·
1 Parent(s): 3d907df

Update css.py

Browse files
Files changed (1) hide show
  1. css.py +117 -0
css.py CHANGED
@@ -0,0 +1,117 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+
2
+ # CSS for styling the interface
3
+ css = """
4
+ #col-left, #col-mid, #col-right {
5
+ margin: 0 auto;
6
+ max-width: 400px;
7
+ padding: 10px;
8
+ border-radius: 15px;
9
+ background-color: #f9f9f9;
10
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
11
+ }
12
+ #banner {
13
+ width: 100%;
14
+ text-align: center;
15
+ margin-bottom: 20px;
16
+ }
17
+ #run-button {
18
+ background-color: #ff4b5c;
19
+ color: white;
20
+ font-weight: bold;
21
+ padding: 10px;
22
+ border-radius: 10px;
23
+ cursor: pointer;
24
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
25
+ }
26
+ #footer {
27
+ text-align: center;
28
+ margin-top: 20px;
29
+ color: silver;
30
+ }
31
+ """
32
+
33
+ css2="""
34
+ .gradio-container {
35
+ background-image: linear-gradient(#000000, #0a0a0a, #111111) !important;
36
+ color: #00ffff !important;
37
+ font-family: 'IBM Plex Sans', sans-serif !important;
38
+ }
39
+
40
+ h1 {
41
+ font-size: 6em;
42
+ color: #ff00ff;
43
+ margin-top: 30px;
44
+ margin-bottom: 30px;
45
+ text-shadow: 3px 3px 5px rgba(255, 0, 255, 0.8) !important;
46
+ }
47
+
48
+ h3 {
49
+ color: #00ff99 !important;
50
+ }
51
+
52
+ h4 {
53
+ display: inline-block;
54
+ color: #ffffff !important;
55
+ }
56
+
57
+ .wrapper img {
58
+ font-size: 98% !important;
59
+ white-space: nowrap !important;
60
+ text-align: center !important;
61
+ display: inline-block !important;
62
+ color: #ffffff !important;
63
+ }
64
+
65
+ .wrapper {
66
+ color: #ffffff !important;
67
+ }
68
+
69
+ .text-gray-500 {
70
+ color: #ff0099 !important;
71
+ }
72
+
73
+ .gr-box {
74
+ background-image: linear-gradient(#111111, #0a0a0a, #000000) !important;
75
+ border-top-color: #ff00ff !important;
76
+ border-right-color: #00ffff !important;
77
+ border-bottom-color: #ff00ff !important;
78
+ border-left-color: #00ffff !important;
79
+ }
80
+
81
+ .gr-input {
82
+ color: #00ff99 !important;
83
+ background-color: #111111 !important;
84
+ }
85
+
86
+ :root {
87
+ --neutral-100: #000000 !important;
88
+ }
89
+
90
+ .gr-button {
91
+ color: #ffffff !important;
92
+ text-shadow: 1px 1px 5px rgba(0, 255, 255, 0.8) !important;
93
+ background-image: linear-gradient(#002244, #004488) !important;
94
+ border-radius: 24px !important;
95
+ border: solid 1px !important;
96
+ border-top-color: #00ffff !important;
97
+ border-right-color: #ff00ff !important;
98
+ border-bottom-color: #ff00ff !important;
99
+ border-left-color: #00ffff !important;
100
+ padding: 6px 30px;
101
+ }
102
+
103
+ .gr-button:active {
104
+ color: #ff00ff !important;
105
+ font-size: 98% !important;
106
+ text-shadow: 0px 0px 5px rgba(255, 0, 255, 0.8) !important;
107
+ background-image: linear-gradient(#004488, #002244) !important;
108
+ border-top-color: #ff00ff !important;
109
+ border-right-color: #00ffff !important;
110
+ border-bottom-color: #00ffff !important;
111
+ border-left-color: #ff00ff !important;
112
+ }
113
+
114
+ .gr-button:hover {
115
+ filter: brightness(150%);
116
+ }
117
+ """