pro_tip (#12)

- add pro tip (05d9f268384e9f932e617463e67af231db245ce2)
- add info (19879000bc7b8788974c68045cd8edafacc63f5e)
- new line (a2880bfe2be845e24bc11eaf7a83cabfc9117e21)
- fix (b879b2922feb794368c7ac0ed7612530861b137e)
- fix (5453add22e0e7cf0ec41f3ca89f499e9a9ac3455)
- some tiny wording (4ecc8fd734124db37726ebfb5e38cfe3b15afb98)
- oops (b9ad1443c36ffe51ed14c49e2fcf095cc85c0a4d)


Co-authored-by: Hugo Laurençon <HugoLaurencon@users.noreply.huggingface.co>

app_dialogue.py

@@ -475,6 +475,13 @@ with gr.Blocks(title="IDEFICS Playground", theme=gr.themes.Base()) as demo:
                 inputs=decoding_strategy,
                 outputs=top_p,
             )
+            gr.Markdown(
+                """**💡 Pro tip**:\\
+                You can input an arbitrary number of images at arbitrary positions in the same query.\\
+                You will need to input each image with its URL with the syntax `<fake_token_around_image><image:IMAGE_URL><fake_token_around_image>`.\\
+                For example, for two images, you could input `TEXT_1<fake_token_around_image><image:IMAGE_URL_1><fake_token_around_image>TEXT_2<fake_token_around_image><image:IMAGE_URL_2><fake_token_around_image>TEXT_3`.\\
+                In the particular case where two images are consecutive, it is not necessary to add an additional separator: `<fake_token_around_image><image:IMAGE_URL_1><fake_token_around_image><image:IMAGE_URL_2><fake_token_around_image>`."""
+            )
 
     def model_inference(
         model_selector,