File size: 4,574 Bytes
2491e55 17af010 05f0041 2491e55 05f0041 2491e55 05f0041 17af010 2491e55 17af010 9be7e63 17af010 05f0041 9be7e63 17af010 05f0041 17af010 2491e55 05f0041 17af010 2491e55 05f0041 2491e55 17af010 2491e55 05f0041 17af010 2491e55 17af010 2491e55 17af010 2491e55 05f0041 9be7e63 05f0041 2491e55 17af010 9be7e63 17af010 9be7e63 17af010 9be7e63 17af010 2491e55 17af010 05f0041 17af010 2491e55 17af010 05f0041 17af010 05f0041 6616542 05f0041 6616542 05f0041 6616542 05f0041 17af010 05f0041 6616542 2491e55 | 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 | CSS = """
html, body, .gradio-container {
height: 100% !important;
margin: 0 !important;
}
/* 1. Глобальный контейнер: занимаем все пространство без прокрутки страницы */
.gradio-container {
max-width: 100% !important;
margin: 0 !important;
padding: 0 !important;
height: 100vh !important;
display: flex !important;
flex-direction: column !important;
background-color: var(--background-fill-primary) !important;
overflow: hidden !important;
}
/* 2. Основной ряд: Sidebar + Chat
Сделано flex: main-row занимает оставшееся пространство и не вызывает лишнюю высоту */
#main-row {
display: flex !important;
flex: 1 1 auto !important;
height: 100% !important;
margin: 0 !important;
gap: 0 !important;
overflow: hidden !important;
}
/* 3. Сайдбар: фиксированная ширина, скролл при переполнении */
#sidebar-container {
width: 320px !important;
min-width: 240px !important;
max-width: 380px !important;
border-right: 1px solid var(--border-color-primary) !important;
background-color: var(--background-fill-secondary) !important;
padding: 1.25rem !important;
height: 100% !important;
display: flex !important;
flex-direction: column !important;
box-shadow: 2px 0 8px rgba(0, 0, 0, 0.02) !important;
overflow: auto !important;
}
/* Убираем "старение" (побледнение) при обновлении данных */
.stale {
opacity: 1 !important;
filter: none !important;
}
/* 5. Правая колонка с чатом (Главная область) */
#col-chat-main {
display: flex !important;
flex-direction: column !important;
height: 100% !important;
padding: 0 !important;
margin: 0 !important;
gap: 0 !important;
background: var(--background-fill-primary) !important;
flex: 1 1 auto !important;
overflow: hidden !important;
}
/* ЧАТБОТ: Растягиваем на всю доступную высоту, min-height:0 для корректного flex-scroll */
#chatbot {
flex: 1 1 auto !important;
height: auto !important;
min-height: 0 !important;
border: none !important;
border-radius: 0 !important;
margin: 0 !important;
display: flex !important;
flex-direction: column !important;
overflow-y: auto !important;
}
/* Фикс для внутренней обертки Gradio Chatbot - предотвращаем overflow issues */
#chatbot > .wrapper {
flex: 1 1 auto !important;
display: flex !important;
flex-direction: column !important;
min-height: 0 !important;
overflow: auto !important;
}
/* 6. Поле ввода: фиксируем снизу с помощью sticky, чтобы всегда быть видимым */
#input-area {
padding: 0.75rem 1rem !important;
border-top: 1px solid var(--border-color-primary) !important;
background: var(--background-fill-primary) !important;
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.02) !important;
flex-shrink: 0 !important;
position: sticky !important;
bottom: 0 !important;
z-index: 10 !important;
}
/* Текстовое поле адаптируется по ширине и не выходит за границы */
#input-area textarea {
border-radius: 10px !important;
border: 1px solid var(--border-color-primary) !important;
padding: 12px 16px !important;
font-size: 1rem !important;
transition: border-color 0.2s ease !important;
width: 100% !important;
box-sizing: border-box !important;
}
#input-area textarea:focus {
border-color: var(--color-accent) !important;
box-shadow: 0 0 0 2px rgba(var(--color-accent-rgb), 0.1) !important;
}
/* 7. Кнопки и прочие элементы */
.gr-button-primary {
border-radius: 8px !important;
font-weight: 600 !important;
}
/* Кастомный скроллбар */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: transparent;
}
::-webkit-scrollbar-thumb {
background: var(--neutral-300);
border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
background: var(--neutral-400);
}
/* Скрытие футера */
footer {
display: none !important;
}
/* Убираем лишние зазоры между элементами */
.gap {
gap: 12px !important;
}
"""
|