Update app.py

app.py

@@ -8,22 +8,31 @@ from nltk.stem import WordNetLemmatizer
 from transformers import pipeline
 from PIL import Image
 
-# Ensure set_page_config is the first Streamlit command
-if "device_type" not in st.session_state:
-    st.set_page_config(page_title="News Classifier", page_icon="📰", layout="wide")  # Default layout
+# JavaScript to detect screen width
+def get_device_type():
+    return st.session_state.get("device_type", None)
 
-    # Ask user for device type
-    device_type = st.radio("Are you using a mobile device or a PC?", ["Mobile", "PC"])
+if "device_type" not in st.session_state:
+    device_type_script = """
+    <script>
+        let screen_width = window.innerWidth;
+        let device_type = screen_width < 768 ? "Mobile" : "PC";
+        window.parent.postMessage(device_type, "*");
+    </script>
+    """
+    st.markdown(device_type_script, unsafe_allow_html=True)
+
+    # Wait for response from JavaScript
+    device_type = st.selectbox("Select your device type", ["Mobile", "PC"])
     st.session_state.device_type = device_type
-    st.rerun()  # Corrected method for refreshing the app
 
-# Apply the selected layout before anything else
-if st.session_state.device_type == "Mobile":
+# Set the layout only ONCE at the start
+if get_device_type() == "Mobile":
     st.set_page_config(page_title="News Classifier", page_icon="📰", layout="centered")
 else:
     st.set_page_config(page_title="News Classifier", page_icon="📰", layout="wide")
 
-# Now continue with the rest of your code
+# Now continue with the rest of the app
 nltk.download('stopwords')
 nltk.download('wordnet')
 nltk.download('omw-1.4')