Update app.py

app.py

@@ -44,6 +44,25 @@ st.markdown("""
     .small-font {
         font-size: 0.8rem;
     }
+    @media (max-width: 768px) {
+        /* Основной контейнер */
+        .main .block-container {
+            padding: 1rem;
+        }
+        /* Карточки примеров */
+        .metric-card {
+            margin: 1rem 0;
+            padding: 0.5rem;
+        }
+        /* Колонки: одна под другой */
+        .stColumns > div {
+            width: 100% !important;
+        }
+        /* Текст и элементы */
+        .stNumberInput input, .stSelectbox select {
+            width: 100%;
+        }
+    }
     </style>
     """, unsafe_allow_html=True)
 
@@ -188,29 +207,60 @@ def create_example_card(title, description, values, key):
         if st.button('Применить этот пример', key=key):
             st.session_state['current_example'] = values
 
-with col1:
-    create_example_card(
-        example_cases['контр']['title'],
-        example_cases['контр']['description'],
-        example_cases['контр']['values'],
-        'example_control'
-    )
+if st.session_state.get('is_mobile', False):  # Если мобильное устройство
+    for key, example in example_cases.items():
+        create_example_card(
+            example['title'],
+            example['description'],
+            example['values'],
+            f'example_{key}'
+        )
+else:  # Для десктопа
+    col1, col2, col3 = st.columns(3)
+    with col1:
+        create_example_card(
+            example_cases['контр']['title'],
+            example_cases['контр']['description'],
+            example_cases['контр']['values'],
+            'example_control'
+        )
+    with col2:
+        create_example_card(
+            example_cases['топирамат']['title'],
+            example_cases['топирамат']['description'],
+            example_cases['топирамат']['values'],
+            'example_topirama'
+        )
+    with col3:
+        create_example_card(
+            example_cases['леветирацетам']['title'],
+            example_cases['леветирацетам']['description'],
+            example_cases['леветирацетам']['values'],
+            'example_levetiracetam'
+        )
+# with col1:
+#     create_example_card(
+#         example_cases['контр']['title'],
+#         example_cases['контр']['description'],
+#         example_cases['контр']['values'],
+#         'example_control'
+#     )
 
-with col2:
-    create_example_card(
-        example_cases['топирамат']['title'],
-        example_cases['топирамат']['description'],
-        example_cases['топирамат']['values'],
-        'example_topirama'
-    )
+# with col2:
+#     create_example_card(
+#         example_cases['топирамат']['title'],
+#         example_cases['топирамат']['description'],
+#         example_cases['топирамат']['values'],
+#         'example_topirama'
+#     )
 
-with col3:
-    create_example_card(
-        example_cases['леветирацетам']['title'],
-        example_cases['леветирацетам']['description'],
-        example_cases['леветирацетам']['values'],
-        'example_levetiracetam'
-    )
+# with col3:
+#     create_example_card(
+#         example_cases['леветирацетам']['title'],
+#         example_cases['леветирацетам']['description'],
+#         example_cases['леветирацетам']['values'],
+#         'example_levetiracetam'
+#     )
 
 # # Описание в основной части
 # with st.container():
@@ -231,6 +281,15 @@ with col3:
 
 # Боковая панель для ввода данных
 with st.sidebar:
+    st.markdown("""
+    <style>
+    @media (max-width: 768px) {
+        div[data-testid="stSidebarNav"] {
+            width: 100% !important;
+        }
+    }
+    </style>
+""", unsafe_allow_html=True)
     st.header('Ввод данных')
     
     # Создаем вкладки для разных типов параметров