BoxOfColors commited on
Commit
2648727
·
1 Parent(s): bd7399c

Fix UI layout: explicit scale=1 on all columns + CSS equal-width enforcement

Browse files
Files changed (1) hide show
  1. app.py +15 -10
app.py CHANGED
@@ -1482,12 +1482,17 @@ def _update_slot_visibility(n):
1482
  _SLOT_CSS = """
1483
  /* Responsive video: fills column width, height auto from aspect ratio */
1484
  .gradio-video video {
1485
- width: 100% !important;
1486
- height: auto !important;
1487
- max-height: 60vh !important;
1488
  object-fit: contain;
1489
  }
1490
- /* No hidden trigger inputs needed regen uses direct Gradio queue API calls. */
 
 
 
 
 
1491
  """
1492
 
1493
  _GLOBAL_JS = """
@@ -1752,7 +1757,7 @@ with gr.Blocks(title="Generate Audio for Video", css=_SLOT_CSS, js=_GLOBAL_JS) a
1752
  # ---------------------------------------------------------- #
1753
  with gr.Tab("TARO"):
1754
  with gr.Row():
1755
- with gr.Column():
1756
  taro_video = gr.Video(label="Input Video")
1757
  taro_seed = gr.Number(label="Seed (-1 = random)", value=get_random_seed(), precision=0, elem_id="taro_seed")
1758
  taro_cfg = gr.Slider(label="CFG Scale", minimum=1, maximum=15, value=7.5, step=0.5, elem_id="taro_cfg")
@@ -1763,7 +1768,7 @@ with gr.Blocks(title="Generate Audio for Video", css=_SLOT_CSS, js=_GLOBAL_JS) a
1763
  taro_samples = gr.Slider(label="Generations", minimum=1, maximum=MAX_SLOTS, value=1, step=1)
1764
  taro_btn = gr.Button("Generate", variant="primary")
1765
 
1766
- with gr.Column():
1767
  (taro_slot_grps, taro_slot_vids,
1768
  taro_slot_waves) = _make_output_slots("taro")
1769
 
@@ -1858,7 +1863,7 @@ with gr.Blocks(title="Generate Audio for Video", css=_SLOT_CSS, js=_GLOBAL_JS) a
1858
  # ---------------------------------------------------------- #
1859
  with gr.Tab("MMAudio"):
1860
  with gr.Row():
1861
- with gr.Column():
1862
  mma_video = gr.Video(label="Input Video")
1863
  mma_prompt = gr.Textbox(label="Prompt", placeholder="e.g. footsteps on gravel", elem_id="mma_prompt")
1864
  mma_neg = gr.Textbox(label="Negative Prompt", placeholder="music, speech", elem_id="mma_neg")
@@ -1870,7 +1875,7 @@ with gr.Blocks(title="Generate Audio for Video", css=_SLOT_CSS, js=_GLOBAL_JS) a
1870
  mma_samples = gr.Slider(label="Generations", minimum=1, maximum=MAX_SLOTS, value=1, step=1)
1871
  mma_btn = gr.Button("Generate", variant="primary")
1872
 
1873
- with gr.Column():
1874
  (mma_slot_grps, mma_slot_vids,
1875
  mma_slot_waves) = _make_output_slots("mma")
1876
 
@@ -1948,7 +1953,7 @@ with gr.Blocks(title="Generate Audio for Video", css=_SLOT_CSS, js=_GLOBAL_JS) a
1948
  # ---------------------------------------------------------- #
1949
  with gr.Tab("HunyuanFoley"):
1950
  with gr.Row():
1951
- with gr.Column():
1952
  hf_video = gr.Video(label="Input Video")
1953
  hf_prompt = gr.Textbox(label="Prompt", placeholder="e.g. rain hitting a metal roof", elem_id="hf_prompt")
1954
  hf_neg = gr.Textbox(label="Negative Prompt", value="noisy, harsh", elem_id="hf_neg")
@@ -1961,7 +1966,7 @@ with gr.Blocks(title="Generate Audio for Video", css=_SLOT_CSS, js=_GLOBAL_JS) a
1961
  hf_samples = gr.Slider(label="Generations", minimum=1, maximum=MAX_SLOTS, value=1, step=1)
1962
  hf_btn = gr.Button("Generate", variant="primary")
1963
 
1964
- with gr.Column():
1965
  (hf_slot_grps, hf_slot_vids,
1966
  hf_slot_waves) = _make_output_slots("hf")
1967
 
 
1482
  _SLOT_CSS = """
1483
  /* Responsive video: fills column width, height auto from aspect ratio */
1484
  .gradio-video video {
1485
+ width: 100%;
1486
+ height: auto;
1487
+ max-height: 60vh;
1488
  object-fit: contain;
1489
  }
1490
+ /* Force two-column layout to stay equal-width */
1491
+ .gradio-container .gradio-row > .gradio-column {
1492
+ flex: 1 1 0 !important;
1493
+ min-width: 0 !important;
1494
+ max-width: 50% !important;
1495
+ }
1496
  """
1497
 
1498
  _GLOBAL_JS = """
 
1757
  # ---------------------------------------------------------- #
1758
  with gr.Tab("TARO"):
1759
  with gr.Row():
1760
+ with gr.Column(scale=1):
1761
  taro_video = gr.Video(label="Input Video")
1762
  taro_seed = gr.Number(label="Seed (-1 = random)", value=get_random_seed(), precision=0, elem_id="taro_seed")
1763
  taro_cfg = gr.Slider(label="CFG Scale", minimum=1, maximum=15, value=7.5, step=0.5, elem_id="taro_cfg")
 
1768
  taro_samples = gr.Slider(label="Generations", minimum=1, maximum=MAX_SLOTS, value=1, step=1)
1769
  taro_btn = gr.Button("Generate", variant="primary")
1770
 
1771
+ with gr.Column(scale=1):
1772
  (taro_slot_grps, taro_slot_vids,
1773
  taro_slot_waves) = _make_output_slots("taro")
1774
 
 
1863
  # ---------------------------------------------------------- #
1864
  with gr.Tab("MMAudio"):
1865
  with gr.Row():
1866
+ with gr.Column(scale=1):
1867
  mma_video = gr.Video(label="Input Video")
1868
  mma_prompt = gr.Textbox(label="Prompt", placeholder="e.g. footsteps on gravel", elem_id="mma_prompt")
1869
  mma_neg = gr.Textbox(label="Negative Prompt", placeholder="music, speech", elem_id="mma_neg")
 
1875
  mma_samples = gr.Slider(label="Generations", minimum=1, maximum=MAX_SLOTS, value=1, step=1)
1876
  mma_btn = gr.Button("Generate", variant="primary")
1877
 
1878
+ with gr.Column(scale=1):
1879
  (mma_slot_grps, mma_slot_vids,
1880
  mma_slot_waves) = _make_output_slots("mma")
1881
 
 
1953
  # ---------------------------------------------------------- #
1954
  with gr.Tab("HunyuanFoley"):
1955
  with gr.Row():
1956
+ with gr.Column(scale=1):
1957
  hf_video = gr.Video(label="Input Video")
1958
  hf_prompt = gr.Textbox(label="Prompt", placeholder="e.g. rain hitting a metal roof", elem_id="hf_prompt")
1959
  hf_neg = gr.Textbox(label="Negative Prompt", value="noisy, harsh", elem_id="hf_neg")
 
1966
  hf_samples = gr.Slider(label="Generations", minimum=1, maximum=MAX_SLOTS, value=1, step=1)
1967
  hf_btn = gr.Button("Generate", variant="primary")
1968
 
1969
+ with gr.Column(scale=1):
1970
  (hf_slot_grps, hf_slot_vids,
1971
  hf_slot_waves) = _make_output_slots("hf")
1972