Update CSS for improved Gradio layout and responsiveness
Browse files
src/synthetic_dataset_generator/app.py
CHANGED
|
@@ -18,6 +18,9 @@ button[role="tab"][aria-selected="true"]:hover {border-color: var(--button-prima
|
|
| 18 |
#system_prompt_examples { color: var(--body-text-color) !important; background-color: var(--block-background-fill) !important;}
|
| 19 |
.container {padding-inline: 0 !important}
|
| 20 |
#sign_in_button { flex-grow: 0; width: auto !important; display: flex; align-items: center; justify-content: center; margin: 0 auto; }
|
|
|
|
|
|
|
|
|
|
| 21 |
"""
|
| 22 |
|
| 23 |
image = """<br><img src="https://raw.githubusercontent.com/argilla-io/synthetic-data-generator/main/assets/logo.svg" alt="Synthetic Data Generator Logo" style="display: block; margin-left: auto; margin-right: auto; width: clamp(50%, 400px, 100%)"/>"""
|
|
|
|
| 18 |
#system_prompt_examples { color: var(--body-text-color) !important; background-color: var(--block-background-fill) !important;}
|
| 19 |
.container {padding-inline: 0 !important}
|
| 20 |
#sign_in_button { flex-grow: 0; width: auto !important; display: flex; align-items: center; justify-content: center; margin: 0 auto; }
|
| 21 |
+
.gradio-container { width: 100% !important; }
|
| 22 |
+
.gradio-row { display: flex !important; flex-direction: row !important; }
|
| 23 |
+
.gradio-column { flex: 1 !important; min-width: 0 !important; }
|
| 24 |
"""
|
| 25 |
|
| 26 |
image = """<br><img src="https://raw.githubusercontent.com/argilla-io/synthetic-data-generator/main/assets/logo.svg" alt="Synthetic Data Generator Logo" style="display: block; margin-left: auto; margin-right: auto; width: clamp(50%, 400px, 100%)"/>"""
|