Update app.py

app.py

@@ -15,19 +15,42 @@ def calculate(num1, num2, operation):
     else:
         return "Invalid operation"
 
-# Streamlit UI
-st.title("Simple Calculator")
+# Streamlit UI - Customizing the interface for better user experience
 
-# User input
-num1 = st.number_input("Enter the first number", format="%.2f")
-num2 = st.number_input("Enter the second number", format="%.2f")
+# Title with custom styling
+st.markdown("""
+    <h1 style="text-align: center; color: #4CAF50;">Simple Calculator</h1>
+    <p style="text-align: center; font-size: 18px;">Perform basic arithmetic operations: Add, Subtract, Multiply, Divide.</p>
+    """, unsafe_allow_html=True)
 
+# Create a layout with columns for inputs and result
+col1, col2 = st.columns(2)
+
+with col1:
+    # User input for the first number
+    num1 = st.number_input("Enter the first number", value=0.0, format="%.2f", step=0.1, key="num1")
+    
+with col2:
+    # User input for the second number
+    num2 = st.number_input("Enter the second number", value=0.0, format="%.2f", step=0.1, key="num2")
+
+# Selectbox for the operation
 operation = st.selectbox(
     "Select the operation",
-    ("Add", "Subtract", "Multiply", "Divide")
+    ("Add", "Subtract", "Multiply", "Divide"),
+    key="operation"
 )
 
-# Calculate and display result
+# Add a button to calculate
 if st.button("Calculate"):
     result = calculate(num1, num2, operation)
-    st.write(f"Result: {result}")
+    st.markdown(f"### **Result: {result}**", unsafe_allow_html=True)
+
+# Additional styling
+st.markdown("""
+    <style>
+    .css-1v0mbdj {padding: 0.5rem 2rem;}
+    .css-1cpxqw2 {background-color: #4CAF50; color: white;}
+    .stButton button {border-radius: 5px;}
+    </style>
+    """, unsafe_allow_html=True)