File size: 4,344 Bytes
0b97f6a
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
custom_css = """



/* ========== 响应式布局 ========== */

/* 移除固定宽度,让Gradio自动适配不同屏幕尺寸 */

.gradio-container {

    width: 100% !important;

    max-width: 100% !important;

}



/* 主体内容区域自适应 */

.main, .contain {

    width: 100% !important;

    max-width: 100% !important;

}



/* Tab 内容区域自适应 */

.tabitem {

    width: 100% !important;

    max-width: 100% !important;

}



/* Plot 组件自适应,但保持最小可读宽度 */

.js-plotly-plot, .plotly {

    width: 100% !important;

    max-width: 100% !important;

    min-width: 300px !important;  /* 保持最小可读宽度 */

}



/* ========== 原有样式 ========== */

.markdown-text {

    font-size: 20px !important;

}



/* 只影响 Tabs 按钮 */

#custom-tabs [role="tab"] {

    font-size: 20px;

}



/* ✅ 只影响表格 */

.custom-table table thead th {

    font-size: 16px;

    font-weight: 600;  /* 想要普通就改成 400 */

    text-align: center;

}



.custom-table table tbody td {

    font-size: 14px;

}



/* 响应式表格布局 */

.custom-table table {

    table-layout: auto;    /* 使用自动布局,让表格自适应 */

    width: 100%;           /* 占满容器 */

    min-width: 100%;       /* 确保至少占满容器 */

}



/* 表格容器允许横向滚动(当内容过宽时) */

.custom-table {

    overflow-x: auto;      /* 当表格内容过宽时,允许横向滚动 */

    width: 100%;

}



/* 为不同列设置合适的宽度(使用相对单位,更灵活) */

.custom-table table th:nth-child(1),

.custom-table table td:nth-child(1) {

    min-width: 150px;      /* model 列最小宽度 */

    max-width: 250px;      /* 最大宽度限制 */

}



/* 指标列(MASE, CRPS, MAE, MSE) */

.custom-table table th:nth-child(2),

.custom-table table td:nth-child(2),

.custom-table table th:nth-child(3),

.custom-table table td:nth-child(3),

.custom-table table th:nth-child(4),

.custom-table table td:nth-child(4),

.custom-table table th:nth-child(5),

.custom-table table td:nth-child(5) {

    min-width: 80px;      /* 原始指标列最小宽度 */

    max-width: 120px;

}



/* 归一化指标列(MASE_norm, CRPS_norm, MAE_norm, MSE_norm) */

.custom-table table th:nth-child(6),

.custom-table table td:nth-child(6),

.custom-table table th:nth-child(7),

.custom-table table td:nth-child(7),

.custom-table table th:nth-child(8),

.custom-table table td:nth-child(8),

.custom-table table th:nth-child(9),

.custom-table table td:nth-child(9) {

    min-width: 100px;      /* 归一化指标列最小宽度 */

    max-width: 150px;

}



/* 排名列(MASE_rank, CRPS_rank) */

.custom-table table th:nth-child(10),

.custom-table table td:nth-child(10),

.custom-table table th:nth-child(11),

.custom-table table td:nth-child(11) {

    min-width: 80px;       /* 排名列最小宽度 */

    max-width: 120px;

}





#archive-table table thead th { font-size: 14px; font-weight: 400}

#archive-table table {

    table-layout: fixed;   /* 强制固定布局 */

    width: 100%;           /* 占满容器 */

}



#archive-table table th:nth-child(1),

#archive-table table td:nth-child(1) {

    width: 160px !important;   /* dataset */

}



#archive-table table th:nth-child(2),

#archive-table table td:nth-child(2) {

    width: 100px !important;   /* variate_name */

}



#archive-table table th:nth-child(3),

#archive-table table td:nth-child(3) {

    width: 60px !important;   /* freq */

}



#archive-table table th:nth-child(4),

#archive-table table td:nth-child(4) {

    width: 100px !important;   /* domain */

}



/* 后面的特征列 */

#archive-table table th:nth-child(n+5),

#archive-table table td:nth-child(n+5) {

    width: 120px !important;

}









#citation-button span {

    font-size: 14px !important;

}



#citation-button textarea {

    font-size: 16px !important;

}



#citation-button > label > button {

    margin: 6px;

    transform: scale(1.3);

}



#search-bar-table-box > div:first-child {

    background: none;

    border: none;

}



#search-bar {

    padding: 0px;

}



"""

# ToDO: markdown-text不好使...
# archive-table table thead th { font-size: 14px; font-weight: 400}

# /* 让表格遵守列宽、并能横向滚动 */
# #