Changed menu & created About and FAQ tabs, no content yet

app.py

@@ -41,9 +41,40 @@ lemma_dict = load_lsj_dict()
 models_for_word_dict = load_models_for_word_dict()
 
 
+# Set styles for menu
+styles = {
+    "container": {"display": "flex", "justify-content": "center"},
+    "nav": {"display": "flex", "gap": "2px", "margin": "5px"},
+    "nav-item": {"flex": "1", "font-family": "Sans-serif"},
+    "nav-link": {
+        "background-color": "#f0f0f0",
+        "border": "1px solid #ccc",
+        "border-radius": "5px",
+        "padding": "10px",
+        "width": "100px",  
+        "height": "60px",  
+        "display": "flex",
+        "align-items": "center",
+        "justify-content": "center",
+        "transition": "background-color 0.3s, color 0.3s",
+        "color": "black",
+        "text-decoration": "none"
+    },
+    "nav-link:hover": {
+        "background-color": "rgb(238, 238, 238)",
+        "color": "#000"
+    },
+    "nav-link-selected": {
+        "background-color": "rgb(254, 74, 75)",
+        "color": "white",
+        "font-weight": "bold"
+    },
+    "icon": {"display": "None"}
+}
+
 # Horizontal menu
-active_tab = option_menu(None, ["Nearest neighbours", "Cosine similarity", "3D graph", 'Dictionary'], 
-    menu_icon="cast", default_index=0, orientation="horizontal")
+active_tab = option_menu(None, ["Nearest neighbours", "Cosine similarity", "3D graph", 'Dictionary', 'About', 'FAQ'], 
+    menu_icon="cast", default_index=0, orientation="horizontal", styles=styles)
 
 
 # Adding CSS style to remove list-style-type
@@ -276,8 +307,30 @@ elif active_tab == "Dictionary":
                         </style>
                         """, unsafe_allow_html=True)
                     
-                        
-            
+
+# About tab
+elif active_tab == "About":
+    st.markdown("""
+        ## About
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec purus nec nunc ultricies ultricies.
+        """)
+
+
+elif active_tab == "FAQ":
+    st.markdown("""
+        ## FAQ
+        """)
+    
+    with st.expander("Which models is this interface based on?"):
+        st.write(
+                "This interface is based on five language models. \
+                Language models are statistical models of language, \
+                which store statistical information about word co-occurrence during the training phase. \
+                During training they process a corpus of texts in the target language(s). \
+                Once trained, models can be used to extract information about the language \
+                (in this interface, we focus on the extraction of semantic information) or to perform specific linguistic tasks. \
+                The models on which this interface is based are Word Embedding models."
+                )