Improve presentation

app.py

@@ -194,11 +194,11 @@ def draw_reshape_encode(img, boxes, x, y):
 def get_html(url_list, encoded_images):
     html = "<div style='margin-top: 20px; max-width: 1200px; display: flex; flex-wrap: wrap; justify-content: space-evenly'>"
     for i in range(len(url_list)):
-        title, link, encoded = url_list[i][1], url_list[i][2], encoded_images[i]
-        html2 = f"<img title='{escape(title)}' style='height: {HEIGHT}px; margin: 5px' src='data:image/jpeg;base64,{encoded.decode()}'>"
-        if len(link) > 0:
-            html2 = f"<a href='{escape(link)}' target='_blank'>" + html2 + "</a>"
-        html = html + html2
+        title, encoded = url_list[i][1], encoded_images[i]
+        html = (
+            html
+            + f"<img title='{escape(title)}' style='height: {HEIGHT}px; margin: 5px' src='data:image/jpeg;base64,{encoded.decode()}'>"
+        )
     html += "</div>"
     return html
 
@@ -206,13 +206,13 @@ def get_html(url_list, encoded_images):
 description = """
 # Search and Detect
 
-This demo illustrates how you can both retrieve images containing certain objects and locate these objects with a simple natural language query.
+This demo illustrates how to both retrieve images containing certain objects and locate these objects with a simple text query.
 
 **Enter your query and hit enter**
 
 **Tip 1**: if your query includes "/", the part left (resp. right) of "/" will be used to retrieve images (resp. locate objects). For example, if you want to retrieve pictures with several cats but locate individual cats, you can type "cats / cat".
 
-**Tip 2**: change the score threshold below to adjust the sensitivity of the object detection.
+**Tip 2**: change the score threshold to adjust the sensitivity of the object detection step.
 
 *Built with OpenAI's [CLIP](https://openai.com/blog/clip/) model and Google's [OWL-ViT](https://arxiv.org/abs/2205.06230) model, 🤗 Hugging Face's [transformers library](https://huggingface.co/transformers/), [Streamlit](https://streamlit.io/), 25k images from [Unsplash](https://unsplash.com/) and 8k images from [The Movie Database (TMDB)](https://www.themoviedb.org/)*
 
@@ -232,7 +232,7 @@ def main():
               .block-container{
                 max-width: 1200px;
               }
-              div.row-widget.stRadio > div{
+              div.row-widget > div{
                 flex-direction:row;
                 display: flex;
                 justify-content: center;
@@ -253,20 +253,17 @@ def main():
               #MainMenu {
                 visibility: hidden;
               }
-              footer {
-                visibility: hidden;
-              }
               </style>""",
         unsafe_allow_html=True,
     )
     st.sidebar.markdown(description)
-    score_threshold = st.sidebar.slider(
-        "Score threshold", min_value=0.01, max_value=0.3, value=0.1, step=0.01
-    )
 
     _, c, _ = st.columns((1, 3, 1))
     query = c.text_input("", value="koala")
-    corpus = st.radio("", ["Unsplash", "Movies"])
+    corpus = c.radio("", ["Unsplash", "Movies"])
+    score_threshold = c.slider(
+        "Score threshold", min_value=0.01, max_value=0.1, value=0.03, step=0.01
+    )
 
     if len(query) > 0:
         if "/" in query: