Update UI and UX

#71
by multimodalart HF staff - opened
Files changed (1) hide show
  1. custom.css +5 -5
custom.css CHANGED
@@ -2,9 +2,8 @@
2
  #title h1{font-size: 3em; display:inline-flex; align-items:center}
3
  #title img{width: 100px; margin-right: 0.5em}
4
  #prompt input{width: calc(100% - 160px);border-top-right-radius: 0px;border-bottom-right-radius: 0px;}
5
- #run_button{position:absolute;margin-top: 11px;right: 0;margin-right: 0.8em;border-bottom-left-radius: 0px;
6
- border-top-left-radius: 0px;}
7
- #gallery{display:flex}
8
  #gallery .grid-wrap{min-height: 100%;}
9
  #accordion code{word-break: break-all;word-wrap: break-word;white-space: pre-wrap}
10
  #soon{opacity: 0.55; pointer-events: none}
@@ -19,11 +18,12 @@ div#share-btn-container > div {flex-direction: row;background: black;align-items
19
  #share-btn-container.hidden {display: none!important}
20
  #extra_info{margin-top: 1em}
21
  .pending .min {min-height: auto}
 
22
  #gallery_box .form{border: 0 !important}
23
  #order_radio{border: 0;padding-left: 0}
24
- #order_radio .form{border:0 !important}
25
  #order_radio [data-testid="block-info"]{float: left;margin-top: 2px;margin-right: 6px}
26
- #order_radio label{padding: 0.25em 0.75em !important;font-size: 85% !important;}
27
  @media (max-width: 527px) {
28
  #title h1{font-size: 2.2em}
29
  #title img{width: 80px;}
 
2
  #title h1{font-size: 3em; display:inline-flex; align-items:center}
3
  #title img{width: 100px; margin-right: 0.5em}
4
  #prompt input{width: calc(100% - 160px);border-top-right-radius: 0px;border-bottom-right-radius: 0px;}
5
+ #run_button{position:absolute;margin-top: 11px;right: 0;margin-right: 0.8em;border-bottom-left-radius: 0px;border-top-left-radius: 0px;}
6
+ #gallery{display:flex;max-height: 784px;}
 
7
  #gallery .grid-wrap{min-height: 100%;}
8
  #accordion code{word-break: break-all;word-wrap: break-word;white-space: pre-wrap}
9
  #soon{opacity: 0.55; pointer-events: none}
 
18
  #share-btn-container.hidden {display: none!important}
19
  #extra_info{margin-top: 1em}
20
  .pending .min {min-height: auto}
21
+ #gallery_box{padding-top: 0}
22
  #gallery_box .form{border: 0 !important}
23
  #order_radio{border: 0;padding-left: 0}
24
+ #order_radio .form{border:0 !important; padding-bottom: 0.25em}
25
  #order_radio [data-testid="block-info"]{float: left;margin-top: 2px;margin-right: 6px}
26
+ #order_radio label{padding: 0.25em 0.75em !important;font-size: 85% !important}
27
  @media (max-width: 527px) {
28
  #title h1{font-size: 2.2em}
29
  #title img{width: 80px;}