better layout

app.py

@@ -8,8 +8,9 @@ st.title("Huggingface model explorer")
 st.text(f"search {len(models_df)} models by name or readme")
 st.text("note that there are many more models but here we only show those with readme")
 
-query = st.text_input("model name query", value="")
-readme_query = st.text_input("readme query", value="")
+col1, col2, col3 = st.columns(3)
+query = col1.text_input("model name query", value="")
+readme_query = col2.text_input("readme query", value="")
 
 selected_models_df = models_df[
     models_df["readme"].str.contains(readme_query)
@@ -17,10 +18,14 @@ selected_models_df = models_df[
 ]
 
 n_per_page = 10
-slider = st.number_input("page", 0, math.ceil(len(selected_models_df) / 10))
+slider = col3.number_input("page", 0, math.ceil(len(selected_models_df) / 10))
 selected_models_df_subset = selected_models_df.iloc[
     slider * n_per_page : (slider + 1) * n_per_page
 ]
 st.write(f"matched {len(selected_models_df)} models")
-for i, (model_name, readme) in enumerate(selected_models_df_subset[["modelId", "readme"]].itertuples(index=False)):
-    st.write(readme)
+
+for i, (model_name, tag, readme) in enumerate(
+    selected_models_df_subset[["modelId", "pipeline_tag", "readme"]].itertuples(index=False)
+):
+    with st.expander(f"{model_name} ({tag})"):
+        st.write(readme)