File size: 2,382 Bytes
36cac86 |
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 |
/* === Giao diện khung chứa === */
.container-box {
border: 1px solid var(--border-color-primary);
border-radius: 10px;
padding: 20px;
background-color: var(--background-fill-primary);
margin-bottom: 20px;
}
/* === Tiêu đề to và rõ === */
h1, h2, h3, label {
color: var(--body-text-color);
font-weight: bold;
font-size: 1.35rem;
}
/* === Hộp kết quả và danh sách file === */
.output-box ,.scroll-box {
background-color: var(--background-fill-primary) !important;
color: var(--body-text-color) !important;
border: 2px dashed var(--border-color-primary, #ccc) !important; /* #ccc là giá trị dự phòng */
border-radius: 10px !important;
padding: 18px !important;
font-size: 1.1rem !important;
}
/* === Thanh tải giả định (vòng tròn chờ) cho output nếu muốn thêm bằng js sau này === */
.output-box::after {
content: "";
display: none; /* Khi cần loading thì display: block */
position: absolute;
top: 10px;
right: 20px;
border: 4px solid #f3f3f3;
border-top: 4px solid #1e88e5;
border-radius: 50%;
width: 20px;
height: 20px;
animation: spin 1s linear infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/* === Nút hành động === */
.button-primary {
background-color: #1e88e5 !important;
color: white !important;
border-radius: 8px !important;
font-size: 1.05rem !important;
}
.button-primary:hover {
background-color: #1565c0 !important;
}
.button-secondary {
background-color: #ef5350 !important;
color: white !important;
border-radius: 8px !important;
font-size: 1.05rem !important;
}
.button-secondary:hover {
background-color: #c62828 !important;
}
/* === Input / dropdown đẹp hơn === */
gradio-textbox,
gradio-dropdown,
gradio-slider {
background-color: var(--background-fill-primary) !important;
color: var(--body-text-color) !important;
font-size: 1.05rem !important;
}
/* === Scrollbar custom cho danh sách === */
.scroll-box::-webkit-scrollbar {
width: 6px;
}
.scroll-box::-webkit-scrollbar-thumb {
background: #888;
border-radius: 4px;
}
.scroll-box::-webkit-scrollbar-thumb:hover {
background: #555;
}
|