yetessam commited on
Commit
1f330df
·
verified ·
1 Parent(s): 4f7c626

Update ui/styles.css

Browse files
Files changed (1) hide show
  1. ui/styles.css +43 -48
ui/styles.css CHANGED
@@ -1,5 +1,4 @@
1
-
2
-
3
  .gradio-container,
4
  .gradio-container .app,
5
  .gradio-container .wrap,
@@ -7,65 +6,61 @@
7
  .block,
8
  .gr-group,
9
  .html-container,
10
- .prose,
11
- #main_panel {
12
- background-color: white !important;
13
- background-fill-secondary: white !important;
14
  }
15
 
16
- #control_panel {
17
- background-color: white !important; */
18
- padding: 1em !important;
19
- margin: 1em !important;
20
  }
21
 
22
-
23
  #footer {
24
- text-align: center;
25
- color: gray;
26
- font-size: 1em;
27
  }
28
 
29
-
30
- /* Instructional Guidance Blocks */
31
- #component-8, #component-10, #component-11 {
32
- padding: 2em !important;
33
- margin: 16px 0 !important;
34
- background-color: white !important;
 
35
  }
36
 
37
-
38
- /* Body text in guidance */
39
- #component-8 .prose p,
40
- #component-10 .prose p {
41
- color: #475569 !important;
42
- line-height: 1.6 !important;
43
- margin-bottom: 12px !important;
44
- font-size: 14px !important;
45
  }
46
 
47
- /* Lists in guidance */
48
- #component-8 .prose ul,
49
- #component-10 .prose ul {
50
- color: #475569 !important;
51
- padding-left: 20px !important;
52
- margin: 12px 0 !important;
53
  }
54
 
55
- #component-8 .prose li,
56
- #component-10 .prose li {
57
- margin-bottom: 6px !important;
58
- line-height: 1.5 !important;
59
  }
60
 
61
- /* Code blocks in guidance */
62
- #component-8 .prose code,
63
- #component-10 .prose code {
64
- background: #e0e7ff !important;
65
- color: #4338ca !important;
66
- padding: 2px 6px !important;
67
- border-radius: 4px !important;
68
- font-family: 'Monaco', 'Consolas', monospace !important;
69
- font-size: 13px !important;
70
- border: 1px solid #c7d2fe !important;
71
  }
 
1
+ /* Global container + blocks → white background */
 
2
  .gradio-container,
3
  .gradio-container .app,
4
  .gradio-container .wrap,
 
6
  .block,
7
  .gr-group,
8
  .html-container,
9
+ .prose,
10
+ #main_panel,
11
+ #control_panel {
12
+ background: #ffffff !important;
13
  }
14
 
15
+ /* Control panel spacing */
16
+ #control_panel {
17
+ padding: 1em !important;
18
+ margin: 1em !important;
19
  }
20
 
21
+ /* Footer styling */
22
  #footer {
23
+ text-align: center;
24
+ color: gray;
25
+ font-size: 1em;
26
  }
27
 
28
+ /* Any Gradio component block (not hardcoded ids like #component-8) */
29
+ [id^="component-"].block,
30
+ [id^="component-"].row,
31
+ [id^="component-"].form {
32
+ padding: 2em !important;
33
+ margin: 16px 0 !important;
34
+ background: #ffffff !important;
35
  }
36
 
37
+ /* Body text inside guidance blocks */
38
+ [id^="component-"] .prose p {
39
+ color: #475569 !important;
40
+ line-height: 1.6 !important;
41
+ margin-bottom: 12px !important;
42
+ font-size: 14px !important;
 
 
43
  }
44
 
45
+ /* Lists inside guidance blocks */
46
+ [id^="component-"] .prose ul {
47
+ color: #475569 !important;
48
+ padding-left: 20px !important;
49
+ margin: 12px 0 !important;
 
50
  }
51
 
52
+ [id^="component-"] .prose li {
53
+ margin-bottom: 6px !important;
54
+ line-height: 1.5 !important;
 
55
  }
56
 
57
+ /* Inline code blocks inside guidance */
58
+ [id^="component-"] .prose code {
59
+ background: #e0e7ff !important;
60
+ color: #4338ca !important;
61
+ padding: 2px 6px !important;
62
+ border-radius: 4px !important;
63
+ border: 1px solid #c7d2fe !important;
64
+ font-family: Monaco, Consolas, monospace !important;
65
+ font-size: 13px !important;
 
66
  }