Add search with image functionality

app.py

@@ -315,7 +315,7 @@ st.title("いらすと検索（日本語CLIPゼロショット）")
 description_text = st.empty()
 
 if "model" not in st.session_state:
-    description_text.text("日本語CLIPモデル読み込み中... ")
+    description_text.markdown("日本語CLIPモデル読み込み中... ")
     device = "cuda" if torch.cuda.is_available() else "cpu"
     model = ClipModel("sonoisa/clip-vit-b-32-japanese-v1", device=device)
     st.session_state.model = model
@@ -340,11 +340,11 @@ df = st.session_state.df
 sentence_vectors = st.session_state.sentence_vectors
 image_vectors = st.session_state.image_vectors
 
-description_text.text("日本語CLIPモデル（ゼロショット）を用いて、説明文の意味が近い「いらすとや」画像を検索します。\n" + \
+description_text.markdown("日本語CLIPモデル（ゼロショット）を用いて、説明文の意味が近い「いらすとや」画像を検索します。\n" + \
     "使い方: \n" + \
-    "  1. 「クエリ種別」でテキスト（説明文）と画像のどちらをクエリに用いるか選ぶ。\n" + \
-    "  2. 「クエリ種別」に合わせて「説明文」に検索クエリとなるテキストを入力するか、「画像」に検索クエリとなる画像ファイルを指定する。\n" + \
-    "  3. 「検索数」で検索結果の表示数を、「検索対象ベクトル」で画像ベクトルと文ベクトルのどちらとの類似性をもって検索するかを指定することができる。\n" + \
+    "1. 「クエリ種別」でテキスト（説明文）と画像のどちらをクエリに用いるか選ぶ。\n" + \
+    "2. 「クエリ種別」に合わせて「説明文」に検索クエリとなるテキストを入力するか、「画像」に検索クエリとなる画像ファイルを指定する。\n" + \
+    "3. 「検索数」で検索結果の表示数を、「検索対象ベクトル」で画像ベクトルと文ベクトルのどちらとの類似性をもって検索するかを指定することができる。\n" + \
     "説明文にはキーワードを列挙するよりも、自然な文章を入力した方が精度よく検索できます。\n" + \
     "画像は必ずリンク先の「いらすとや」さんのページを開き、そこからダウンロードしてください。")