ZhouChuYue commited on
Commit
2bb462d
·
1 Parent(s): 0c9565a

fix: tech-style refresh + single-box markdown + auto height output

Browse files
Files changed (1) hide show
  1. app.py +148 -0
app.py CHANGED
@@ -454,6 +454,154 @@ ul.options, .gr-dropdown-options {
454
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
455
  }
456
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
457
  /* === Premium Clean Overrides === */
458
  :root {
459
  --bg: #0b1120;
 
454
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
455
  }
456
 
457
+ /* ===== Tech Refresh (Cleaner + Single Box Output) ===== */
458
+ :root {
459
+ --bg: #0b1020;
460
+ --surface: #0f172a;
461
+ --surface-2: #111827;
462
+ --border: #1f2937;
463
+ --text: #e5e7eb;
464
+ --muted: #94a3b8;
465
+ --accent: #38bdf8;
466
+ --accent-2: #8b5cf6;
467
+ }
468
+
469
+ body {
470
+ background-color: var(--bg) !important;
471
+ color: var(--text) !important;
472
+ }
473
+
474
+ .gradio-container {
475
+ background:
476
+ radial-gradient(circle at 15% 10%, rgba(56, 189, 248, 0.08), transparent 40%),
477
+ radial-gradient(circle at 85% 20%, rgba(139, 92, 246, 0.08), transparent 45%),
478
+ linear-gradient(180deg, #0b1020 0%, #0b1020 100%) !important;
479
+ background-size: auto, auto, auto !important;
480
+ }
481
+
482
+ .main-title {
483
+ background: linear-gradient(90deg, #e5e7eb, #c7d2fe, #38bdf8) !important;
484
+ -webkit-background-clip: text !important;
485
+ -webkit-text-fill-color: transparent !important;
486
+ }
487
+
488
+ .subtitle {
489
+ color: var(--muted) !important;
490
+ }
491
+
492
+ .glass-panel {
493
+ background: linear-gradient(180deg, rgba(15, 23, 42, 0.95), rgba(17, 24, 39, 0.95)) !important;
494
+ border: 1px solid rgba(56, 189, 248, 0.15) !important;
495
+ box-shadow:
496
+ 0 0 0 1px rgba(139, 92, 246, 0.12),
497
+ 0 20px 40px rgba(2, 6, 23, 0.55) !important;
498
+ }
499
+
500
+ .section-header {
501
+ color: var(--text) !important;
502
+ border-bottom: 1px solid rgba(56, 189, 248, 0.2) !important;
503
+ text-shadow: none !important;
504
+ }
505
+
506
+ /* Labels & descriptions */
507
+ .block > label > span,
508
+ .form > label > span,
509
+ .gr-form > label > span,
510
+ .label-wrap > span {
511
+ color: var(--text) !important;
512
+ text-shadow: none !important;
513
+ }
514
+
515
+ span.description, .description {
516
+ color: var(--muted) !important;
517
+ text-shadow: none !important;
518
+ }
519
+
520
+ /* Inputs */
521
+ .gr-input, textarea, input, .gr-box, .gr-check-radio, .gr-dropdown {
522
+ background-color: var(--surface-2) !important;
523
+ border: 1px solid var(--border) !important;
524
+ color: var(--text) !important;
525
+ }
526
+
527
+ .gr-input:focus, textarea:focus, input:focus {
528
+ border-color: var(--accent) !important;
529
+ box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.15) !important;
530
+ }
531
+
532
+ /* Buttons */
533
+ .gr-button-primary {
534
+ background: linear-gradient(135deg, #2563eb 0%, #7c3aed 100%) !important;
535
+ box-shadow: 0 8px 20px rgba(37, 99, 235, 0.2) !important;
536
+ }
537
+
538
+ .gr-button-primary:hover {
539
+ background: linear-gradient(135deg, #1d4ed8 0%, #6d28d9 100%) !important;
540
+ }
541
+
542
+ .gr-button-secondary {
543
+ background: transparent !important;
544
+ border: 1px solid rgba(148, 163, 184, 0.35) !important;
545
+ color: var(--text) !important;
546
+ }
547
+
548
+ /* Tabs */
549
+ .tab-nav button {
550
+ color: var(--muted) !important;
551
+ }
552
+
553
+ .tab-nav button.selected {
554
+ color: var(--text) !important;
555
+ border-bottom: 2px solid var(--accent) !important;
556
+ }
557
+
558
+ /* Output: single box + auto height */
559
+ .output-textbox {
560
+ background-color: var(--surface-2) !important;
561
+ border: 1px solid var(--border) !important;
562
+ border-radius: 12px !important;
563
+ padding: 12px !important;
564
+ min-height: 220px !important;
565
+ max-height: 560px !important;
566
+ height: auto !important;
567
+ overflow-y: auto !important;
568
+ }
569
+
570
+ .output-textbox textarea {
571
+ background-color: transparent !important;
572
+ border: none !important;
573
+ box-shadow: none !important;
574
+ color: var(--text) !important;
575
+ min-height: 200px !important;
576
+ max-height: 520px !important;
577
+ height: auto !important;
578
+ overflow-y: auto !important;
579
+ }
580
+
581
+ .markdown-box {
582
+ background: transparent !important;
583
+ border: none !important;
584
+ padding: 0 !important;
585
+ }
586
+
587
+ .markdown-box .prose {
588
+ background-color: var(--surface-2) !important;
589
+ border: 1px solid var(--border) !important;
590
+ border-radius: 12px !important;
591
+ padding: 16px !important;
592
+ min-height: 220px !important;
593
+ max-height: 560px !important;
594
+ overflow-y: auto !important;
595
+ }
596
+
597
+ .markdown-box, .markdown-box * {
598
+ color: var(--text) !important;
599
+ }
600
+
601
+ .markdown-box code, .markdown-box pre {
602
+ background: #1f2937 !important;
603
+ }
604
+
605
  /* === Premium Clean Overrides === */
606
  :root {
607
  --bg: #0b1120;