lorn666 commited on
Commit
fda7f2e
·
verified ·
1 Parent(s): 182b93f

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +29 -17
app.py CHANGED
@@ -31,7 +31,19 @@ blue_ui_css = """
31
  background-color: #667eea !important;
32
  }
33
 
34
- /* Tab styling - blue underline for active tabs, no background fill */
 
 
 
 
 
 
 
 
 
 
 
 
35
  .gradio-container .tab-nav button[aria-selected="true"],
36
  .gradio-container .tab-nav button.selected,
37
  .gradio-container button[role="tab"][aria-selected="true"],
@@ -39,10 +51,8 @@ blue_ui_css = """
39
  background-color: transparent !important;
40
  background: transparent !important;
41
  color: #667eea !important;
 
42
  border-bottom: 2px solid #667eea !important;
43
- border-top: none !important;
44
- border-left: none !important;
45
- border-right: none !important;
46
  }
47
 
48
  .gradio-container .tabs button[aria-selected="true"],
@@ -50,10 +60,8 @@ blue_ui_css = """
50
  background-color: transparent !important;
51
  background: transparent !important;
52
  color: #667eea !important;
 
53
  border-bottom: 2px solid #667eea !important;
54
- border-top: none !important;
55
- border-left: none !important;
56
- border-right: none !important;
57
  }
58
 
59
  /* Hover state for tabs - subtle blue text */
@@ -63,16 +71,7 @@ blue_ui_css = """
63
  background-color: transparent !important;
64
  background: transparent !important;
65
  color: #5a6fd8 !important;
66
- }
67
-
68
- /* Ensure inactive tabs have no special styling */
69
- .gradio-container .tab-nav button,
70
- .gradio-container button[role="tab"],
71
- .gradio-container .tabs button {
72
- background-color: transparent !important;
73
- background: transparent !important;
74
- border-bottom: 2px solid transparent !important;
75
- transition: all 0.3s ease !important;
76
  }
77
 
78
  /* Specific targeting for tab icons and active states */
@@ -82,9 +81,22 @@ blue_ui_css = """
82
  background-color: transparent !important;
83
  background: transparent !important;
84
  color: #667eea !important;
 
85
  border-bottom: 2px solid #667eea !important;
86
  }
87
 
 
 
 
 
 
 
 
 
 
 
 
 
88
  /* Override orange primary colors globally */
89
  .gradio-container * {
90
  --primary-color: #667eea !important;
 
31
  background-color: #667eea !important;
32
  }
33
 
34
+ /* Tab styling - no borders, only blue underline for active tabs */
35
+ .gradio-container .tab-nav button,
36
+ .gradio-container button[role="tab"],
37
+ .gradio-container .tabs button {
38
+ background-color: transparent !important;
39
+ background: transparent !important;
40
+ border: none !important;
41
+ border-bottom: 2px solid transparent !important;
42
+ transition: all 0.3s ease !important;
43
+ display: block !important;
44
+ visibility: visible !important;
45
+ }
46
+
47
  .gradio-container .tab-nav button[aria-selected="true"],
48
  .gradio-container .tab-nav button.selected,
49
  .gradio-container button[role="tab"][aria-selected="true"],
 
51
  background-color: transparent !important;
52
  background: transparent !important;
53
  color: #667eea !important;
54
+ border: none !important;
55
  border-bottom: 2px solid #667eea !important;
 
 
 
56
  }
57
 
58
  .gradio-container .tabs button[aria-selected="true"],
 
60
  background-color: transparent !important;
61
  background: transparent !important;
62
  color: #667eea !important;
63
+ border: none !important;
64
  border-bottom: 2px solid #667eea !important;
 
 
 
65
  }
66
 
67
  /* Hover state for tabs - subtle blue text */
 
71
  background-color: transparent !important;
72
  background: transparent !important;
73
  color: #5a6fd8 !important;
74
+ border: none !important;
 
 
 
 
 
 
 
 
 
75
  }
76
 
77
  /* Specific targeting for tab icons and active states */
 
81
  background-color: transparent !important;
82
  background: transparent !important;
83
  color: #667eea !important;
84
+ border: none !important;
85
  border-bottom: 2px solid #667eea !important;
86
  }
87
 
88
+ /* Ensure all tab buttons are visible */
89
+ .gradio-container [data-testid="tab"] button,
90
+ .gradio-container .tab button,
91
+ .gradio-container [role="tablist"] button {
92
+ background-color: transparent !important;
93
+ background: transparent !important;
94
+ border: none !important;
95
+ border-bottom: 2px solid transparent !important;
96
+ display: block !important;
97
+ visibility: visible !important;
98
+ }
99
+
100
  /* Override orange primary colors globally */
101
  .gradio-container * {
102
  --primary-color: #667eea !important;