feat: update ui style

pull/222/head
fennghuang 2023-08-12 07:14:07 +00:00
parent ab8abbc12c
commit 8c9f7b9f2f
2 changed files with 9 additions and 4 deletions

View File

@ -1174,7 +1174,7 @@ def create_tab(tab: ImageBrowserTab, current_gr_tab: gr.Tab):
gr.HTML("<h3>Additional Generation Info</h3>") gr.HTML("<h3>Additional Generation Info</h3>")
img_file_info_add = gr.HTML() img_file_info_add = gr.HTML()
with gr.Column(scale=1): with gr.Column(scale=1, elem_classes="right-column-panel"):
with gr.Row(elem_classes="sort-panel") as sort_panel: with gr.Row(elem_classes="sort-panel") as sort_panel:
sort_by = gr.Dropdown(value="date", choices=["path name", "date", "aesthetic_score", "random", "cfg scale", "steps", "seed", "sampler", "size", "model", "model hash", "ranking"], label="Sort by") sort_by = gr.Dropdown(value="date", choices=["path name", "date", "aesthetic_score", "random", "cfg scale", "steps", "seed", "sampler", "size", "model", "model hash", "ranking"], label="Sort by")
sort_order = ToolButton(value=down_symbol) sort_order = ToolButton(value=down_symbol)
@ -1192,9 +1192,9 @@ def create_tab(tab: ImageBrowserTab, current_gr_tab: gr.Tab):
ranking_filter = gr.Radio(value="All", choices=["All", "1", "2", "3", "4", "5", "None", "Min-max"], label="Ranking filter", interactive=True) ranking_filter = gr.Radio(value="All", choices=["All", "1", "2", "3", "4", "5", "None", "Min-max"], label="Ranking filter", interactive=True)
with gr.Row(): with gr.Row():
with gr.Column(scale=2, min_width=20): with gr.Column(scale=2, min_width=20):
ranking_filter_min = gr.Textbox(value="1", label="Minimum ranking", interactive=False) ranking_filter_min = gr.Number(value="1", label="Minimum ranking", interactive=False, elem_classes="ranking-filter-input")
with gr.Column(scale=2, min_width=20): with gr.Column(scale=2, min_width=20):
ranking_filter_max = gr.Textbox(value="5", label="Maximum ranking", interactive=False) ranking_filter_max = gr.Number(value="5", label="Maximum ranking", interactive=False, elem_classes="ranking-filter-input")
with gr.Row(): with gr.Row():
with gr.Column(): with gr.Column():
gr.HTML("<p class='no-gap-top mb-0 text-subdued'>Choose Min-max to activate these controls<p>") gr.HTML("<p class='no-gap-top mb-0 text-subdued'>Choose Min-max to activate these controls<p>")

View File

@ -65,10 +65,15 @@ button[id$='_image_browser_del_img_btn'] {
} }
#tab_image_browser div[id$='_control_image_browser_page_index'], #tab_image_browser div[id$='_control_image_browser_page_index'],
#tab_image_browser .sort-panel .form>div { #tab_image_browser .right-column-panel {
margin-top: calc(var(--body-text-size) * var(--line-sm) * -1) !important margin-top: calc(var(--body-text-size) * var(--line-sm) * -1) !important
} }
#tab_image_browser .sort-panel button { #tab_image_browser .sort-panel button {
margin-top: calc(var(--body-text-size) * var(--line-sm));
align-self: center align-self: center
} }
#tab_image_browser .ranking-filter-input input:disabled{
cursor: not-allowed
}