Update app.py

app.py

@@ -772,10 +772,9 @@ body, .stApp {
 """, unsafe_allow_html=True)
 
 # ========== توابع اصلی ==========
-import streamlit as st
 
 def enhanced_likert_scale(question_data):
-    """لیکرت اسکیل با دکمه‌های رادیویی افقی در Streamlit"""
+    """لیکرت اسکیل با دکمه‌های رادیویی افقی و مرکزی در Streamlit"""
     question = question_data["question"]
     key = question_data["key"]
     scale = question_data["scale"]
@@ -786,25 +785,26 @@ def enhanced_likert_scale(question_data):
         st.session_state[key] = 0
 
     # نمایش سوال
-    st.markdown(f"<div style='text-align:right; font-weight:bold; margin-bottom:15px;'>{question}</div>", 
+    st.markdown(f"<div style='text-align:right; font-weight:bold; margin-bottom:15px; direction: rtl;'>{question}</div>", 
                 unsafe_allow_html=True)
 
-    # ایجاد ستون‌ها برای برچسب‌ها و گزینه‌ها
-    col_label1, *option_cols, col_label2 = st.columns([1] + [1] * scale + [1])
+    # تنظیم چیدمان مرکزی با ستون‌ها
+    total_cols = scale + 2  # یک ستون برای هر نقطه + 2 ستون برای برچسب‌ها
+    col_widths = [1] + [2] * scale + [1]  # برچسب‌ها باریک‌تر، نقاط پهن‌تر برای مرکزیت
+    col_label1, *option_cols, col_label2 = st.columns(col_widths)
 
     # نمایش برچسب سمت راست
     with col_label1:
-        st.markdown(f"<span style='font-size:14px; font-weight:bold; color:#6a0dad;'>{labels[0]}</span>", 
+        st.markdown(f"<span style='font-size:14px; font-weight:bold; color:#6a0dad; direction: rtl;'>{labels[0]}</span>", 
                     unsafe_allow_html=True)
 
-    # نمایش دکمه‌های رادیویی به صورت افقی
+    # نمایش دکمه‌های رادیویی به صورت افقی و مرکزی
     with st.container():
-        options = [str(i) for i in range(1, scale + 1)]  # گزینه‌ها: "1", "2", ..., "scale"
+        options = [str(i) for i in range(1, scale + 1)]
         selected_value = st.session_state.get(key, 0)
         
         for i, col in enumerate(option_cols, 1):
             with col:
-                # استفاده از radio برای هر گزینه به صورت جداگانه
                 is_selected = selected_value == i
                 st.radio(
                     "",
@@ -818,15 +818,15 @@ def enhanced_likert_scale(question_data):
 
     # نمایش برچسب سمت چپ
     with col_label2:
-        st.markdown(f"<span style='font-size:14px; font-weight:bold; color:#6a0dad;'>{labels[1]}</span>", 
+        st.markdown(f"<span style='font-size:14px; font-weight:bold; color:#6a0dad; direction: rtl;'>{labels[1]}</span>", 
                     unsafe_allow_html=True)
 
     # نمایش پاسخ انتخاب‌شده
     if st.session_state[key] != 0:
-        st.markdown(f"<p style='text-align:right; color:#6a0dad;'>پاسخ شما: {st.session_state[key]}</p>", 
+        st.markdown(f"<p style='text-align:right; color:#6a0dad; direction: rtl;'>پاسخ شما: {st.session_state[key]}</p>", 
                     unsafe_allow_html=True)
     else:
-        st.markdown(f"<p style='text-align:right; color:#6a0dad;'>پاسخ شما: هنوز انتخاب نشده</p>", 
+        st.markdown(f"<p style='text-align:right; color:#6a0dad; direction: rtl;'>پاسخ شما: هنوز انتخاب نشده</p>", 
                     unsafe_allow_html=True)
 
     # خط جداکننده بنفش
@@ -837,6 +837,13 @@ def enhanced_likert_scale(question_data):
             height: 2px;
             background: #6a0dad;
             margin: 20px auto;
+            direction: rtl;
+        }
+        /* اطمینان از مرکزیت در تمام دستگاه‌ها */
+        @media (max-width: 768px) {
+            .likert-separator {
+                width: 90%;
+            }
         }
     </style>
     <div class="likert-separator"></div>