Hugging Face's logo

Spaces:
RealMati
/
t2sql-demo
Sleeping

App Files Community
RealMati commited on
Commit
e27cd82
·
verified ·
1 Parent(s): 76545d6

Upload style.css with huggingface_hub

Browse files
Files changed (1) hide show
  1. style.css +130 -0
style.css ADDED
@@ -0,0 +1,130 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ .main-header {
2
+ text-align: center;
3
+ margin-bottom: 0.5rem;
4
+ }
5
+ .main-header h1 {
6
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
7
+ -webkit-background-clip: text;
8
+ -webkit-text-fill-color: transparent;
9
+ font-size: 2.4rem;
10
+ font-weight: 800;
11
+ margin-bottom: 0.25rem;
12
+ }
13
+ .main-header p {
14
+ color: #374151;
15
+ font-size: 1.05rem;
16
+ max-width: 600px;
17
+ margin: 0 auto;
18
+ }
19
+
20
+ /* Pipeline visualization */
21
+ .pipeline-box {
22
+ background: #1e1e2e;
23
+ border: 1px solid #313244;
24
+ border-radius: 12px;
25
+ padding: 1rem 1.5rem;
26
+ text-align: center;
27
+ font-family: 'SF Mono', 'Fira Code', monospace;
28
+ font-size: 0.95rem;
29
+ color: #cdd6f4;
30
+ margin-bottom: 1rem;
31
+ letter-spacing: 0.02em;
32
+ }
33
+ .pipeline-box .arrow {
34
+ color: #a6adc8;
35
+ margin: 0 0.3rem;
36
+ }
37
+ .pipeline-box .stage {
38
+ color: #b4befe;
39
+ font-weight: 600;
40
+ }
41
+ .pipeline-box .highlight {
42
+ color: #f9e2af;
43
+ font-weight: 600;
44
+ }
45
+
46
+ /* SQL output - dark code block */
47
+ .sql-output textarea {
48
+ font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', monospace !important;
49
+ font-size: 1.1rem !important;
50
+ background: #1e1e2e !important;
51
+ color: #cdd6f4 !important;
52
+ border: 1px solid #45475a !important;
53
+ border-radius: 10px !important;
54
+ padding: 1rem !important;
55
+ }
56
+ .sql-output label span {
57
+ color: #374151 !important;
58
+ }
59
+
60
+ /* Raw output - muted style */
61
+ .raw-output textarea {
62
+ font-family: 'SF Mono', 'Fira Code', monospace !important;
63
+ font-size: 0.9rem !important;
64
+ background: #f1f5f9 !important;
65
+ color: #1e293b !important;
66
+ border: 1px solid #cbd5e1 !important;
67
+ border-radius: 8px !important;
68
+ }
69
+ .raw-output label span {
70
+ color: #374151 !important;
71
+ }
72
+
73
+ /* Generate button */
74
+ .generate-btn {
75
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
76
+ border: none !important;
77
+ color: white !important;
78
+ font-weight: 600 !important;
79
+ font-size: 1.05rem !important;
80
+ padding: 0.75rem 2rem !important;
81
+ border-radius: 10px !important;
82
+ min-height: 46px !important;
83
+ }
84
+ .generate-btn:hover {
85
+ opacity: 0.92 !important;
86
+ transform: translateY(-1px);
87
+ box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4) !important;
88
+ }
89
+
90
+ /* Info badges */
91
+ .info-badge {
92
+ display: inline-block;
93
+ background: #e0e7ff;
94
+ color: #3730a3;
95
+ padding: 0.25rem 0.7rem;
96
+ border-radius: 6px;
97
+ font-size: 0.8rem;
98
+ font-weight: 600;
99
+ }
100
+
101
+ /* Force all label text to be dark */
102
+ label span, .label-wrap span {
103
+ color: #1f2937 !important;
104
+ }
105
+
106
+ /* Section headers */
107
+ .section-header {
108
+ color: #1f2937 !important;
109
+ font-weight: 700;
110
+ }
111
+
112
+ /* Slider labels and info text */
113
+ .info-text, .slider-label {
114
+ color: #4b5563 !important;
115
+ }
116
+
117
+ /* Footer */
118
+ .footer-section {
119
+ text-align: center;
120
+ margin-top: 1.5rem;
121
+ padding: 1rem;
122
+ color: #6b7280;
123
+ font-size: 0.85rem;
124
+ }
125
+ .footer-section a {
126
+ color: #667eea;
127
+ }
128
+
129
+ /* Hide default Gradio footer */
130
+ footer { display: none !important; }