liuw15 commited on
Commit
da9b278
·
1 Parent(s): df99c4b

滑动条内置,整个大卡片不动

Browse files
Files changed (2) hide show
  1. public/index.html +1 -1
  2. public/style.css +33 -7
public/index.html CHANGED
@@ -17,7 +17,7 @@
17
  </script>
18
  <style>
19
  .logged-in #loginForm { display: none !important; }
20
- .logged-in #mainContent { display: block !important; }
21
  </style>
22
  </head>
23
  <body>
 
17
  </script>
18
  <style>
19
  .logged-in #loginForm { display: none !important; }
20
+ .logged-in #mainContent { display: flex !important; }
21
  </style>
22
  </head>
23
  <body>
public/style.css CHANGED
@@ -92,7 +92,8 @@ body {
92
  background: var(--bg);
93
  color: var(--text);
94
  line-height: 1.5;
95
- min-height: 100vh;
 
96
  font-size: 1rem;
97
  /* 字体渲染优化 */
98
  -webkit-font-smoothing: antialiased;
@@ -115,7 +116,8 @@ code, pre, .mono, .token-display {
115
  max-width: 1400px;
116
  margin: 0 auto;
117
  padding: 0.5rem;
118
- min-height: 100vh;
 
119
  display: flex;
120
  justify-content: center;
121
  align-items: flex-start;
@@ -218,10 +220,11 @@ button.loading::after {
218
  box-shadow: 0 8px 32px rgba(0,0,0,0.2);
219
  width: 100%;
220
  max-width: 1400px;
221
- min-height: calc(100vh - 1rem);
222
  display: flex;
223
  flex-direction: column;
224
  border: 1px solid rgba(255, 255, 255, 0.5);
 
225
  }
226
  @media (prefers-color-scheme: dark) {
227
  .main-content {
@@ -281,7 +284,24 @@ button.loading::after {
281
  .content {
282
  padding: 1rem;
283
  flex: 1;
284
- overflow: visible;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
285
  }
286
 
287
  /* 顶部栏 - 统计+操作 */
@@ -294,6 +314,7 @@ button.loading::after {
294
  border-radius: 0.75rem;
295
  margin-bottom: 1rem;
296
  border: 1.5px solid var(--border);
 
297
  }
298
  @media (prefers-color-scheme: dark) {
299
  .top-bar {
@@ -360,6 +381,11 @@ button.loading::after {
360
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
361
  gap: 0.75rem;
362
  align-items: start;
 
 
 
 
 
363
  }
364
  .token-card {
365
  background: rgba(255, 255, 255, 0.6);
@@ -1222,7 +1248,7 @@ input:checked + .slider:before {
1222
  font-size: 0.7rem;
1223
  }
1224
 
1225
- .hidden { display: none; }
1226
 
1227
  /* 敏感信息模糊 */
1228
  .sensitive-info.blurred {
@@ -1233,10 +1259,10 @@ input:checked + .slider:before {
1233
 
1234
  /* 响应式 */
1235
  @media (max-width: 768px) {
1236
- .container { padding: 0; min-height: 100vh; align-items: stretch; }
1237
  .login-form { margin: auto 0.5rem; padding: 1.5rem; }
1238
  .login-form h2 { font-size: 1.25rem; }
1239
- .main-content { min-height: 100vh; border-radius: 0; margin: 0; }
1240
  .header {
1241
  padding: 0.5rem 0.75rem;
1242
  flex-wrap: nowrap;
 
92
  background: var(--bg);
93
  color: var(--text);
94
  line-height: 1.5;
95
+ height: 100vh;
96
+ overflow: hidden;
97
  font-size: 1rem;
98
  /* 字体渲染优化 */
99
  -webkit-font-smoothing: antialiased;
 
116
  max-width: 1400px;
117
  margin: 0 auto;
118
  padding: 0.5rem;
119
+ height: 100vh;
120
+ overflow: hidden;
121
  display: flex;
122
  justify-content: center;
123
  align-items: flex-start;
 
220
  box-shadow: 0 8px 32px rgba(0,0,0,0.2);
221
  width: 100%;
222
  max-width: 1400px;
223
+ height: calc(100vh - 1rem);
224
  display: flex;
225
  flex-direction: column;
226
  border: 1px solid rgba(255, 255, 255, 0.5);
227
+ overflow: hidden;
228
  }
229
  @media (prefers-color-scheme: dark) {
230
  .main-content {
 
284
  .content {
285
  padding: 1rem;
286
  flex: 1;
287
+ overflow: hidden;
288
+ display: flex;
289
+ flex-direction: column;
290
+ }
291
+
292
+ #tokensPage {
293
+ display: flex;
294
+ flex-direction: column;
295
+ flex: 1;
296
+ min-height: 0;
297
+ overflow: hidden;
298
+ }
299
+
300
+ #settingsPage {
301
+ flex: 1;
302
+ min-height: 0;
303
+ overflow-y: auto;
304
+ padding-right: 4px;
305
  }
306
 
307
  /* 顶部栏 - 统计+操作 */
 
314
  border-radius: 0.75rem;
315
  margin-bottom: 1rem;
316
  border: 1.5px solid var(--border);
317
+ flex-shrink: 0;
318
  }
319
  @media (prefers-color-scheme: dark) {
320
  .top-bar {
 
381
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
382
  gap: 0.75rem;
383
  align-items: start;
384
+ flex: 1;
385
+ overflow-y: auto;
386
+ padding-right: 4px;
387
+ padding-bottom: 0.5rem;
388
+ min-height: 0;
389
  }
390
  .token-card {
391
  background: rgba(255, 255, 255, 0.6);
 
1248
  font-size: 0.7rem;
1249
  }
1250
 
1251
+ .hidden { display: none !important; }
1252
 
1253
  /* 敏感信息模糊 */
1254
  .sensitive-info.blurred {
 
1259
 
1260
  /* 响应式 */
1261
  @media (max-width: 768px) {
1262
+ .container { padding: 0; height: 100vh; align-items: stretch; }
1263
  .login-form { margin: auto 0.5rem; padding: 1.5rem; }
1264
  .login-form h2 { font-size: 1.25rem; }
1265
+ .main-content { height: 100vh; border-radius: 0; margin: 0; }
1266
  .header {
1267
  padding: 0.5rem 0.75rem;
1268
  flex-wrap: nowrap;