Update app.py

app.py

@@ -39,7 +39,6 @@ def calculate_pressure(tyre_type, temp, condition, min_max):
 
 # ================= CUSTOM CSS (Dark Theme Premium) =================
 custom_css = """
-<style>
 body {
     background: #000000;
     color: #ffffff;
@@ -115,11 +114,64 @@ button:hover {
     color: #FF0000;
     font-weight: bold;
 }
-</style>
 """
 
 # ================= GRADIO INTERFACE =================
 with gr.Blocks(title="Michelin Mining Tyre Analytics — Objective 6", css=custom_css) as demo:
-    gr.HTML("""
-    <div style="text-align:center; padding:20px;">
-        <img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICA8cGF0aCBmaWxsPSIjMDAzQTg4IiBkPSJNMjAgMTVjLTEuMSAwLTIuMi0uOS0yLjItMi4yaC0xLjRjLS4xIDAtLjIuMS0uMi4yaC0xLjRjLS4xIDAtLjIuMS0uMi4yaC0xLjRjLS4xIDAtLjIuMS0uMi4yaC0xLjRjLS4xIDAtLjIuMS0uMi4yaC0xLjRjLS4xIDAtLjIuMS0uMi4yaC0xLjRjLS4xIDAtLjI
+    gr.Markdown("""
+    # 🛞 Michelin Mining Tyre Analytics — Objective 6
+    ### Simulasi Tekanan Ban Berdasarkan Suhu & Jenis Ban
+    Masukkan suhu saat ini dan pilih jenis ban untuk mendapatkan rekomendasi tekanan ideal.
+    """)
+
+    with gr.Row():
+        tyre_type = gr.Radio(
+            choices=["10 (Depan)", "11 (Belakang)"],
+            label="Jenis Ban",
+            value="10 (Depan)",
+            interactive=True
+        )
+        temperature = gr.Slider(
+            minimum=40,
+            maximum=70,
+            value=54,
+            step=0.5,
+            label="Suhu Saat Ini (°C)",
+            interactive=True
+        )
+
+    with gr.Row():
+        btn_simulate = gr.Button("🔍 Simulasikan Tekanan")
+
+    with gr.Row():
+        output = gr.HTML(label="Hasil Simulasi")
+
+    def simulate_pressure(tyres, temp):
+        tyre_num = int(tyres.split()[0])
+        p_min_high = calculate_pressure(tyre_num, temp, 'High', 'Min')
+        p_max_high = calculate_pressure(tyre_num, temp, 'High', 'Max')
+        p_min_low = calculate_pressure(tyre_num, temp, 'Low', 'Min')
+        p_max_low = calculate_pressure(tyre_num, temp, 'Low', 'Max')
+
+        if p_min_high is None or p_max_high is None or p_min_low is None or p_max_low is None:
+            return "<p style='color:#FF0000;'>❌ Tidak dapat menghitung tekanan. Periksa input.</p>"
+
+        # Rekomendasi: Jaga tekanan antara P Min Low dan P Max High
+        recommendation = f"""
+        <div class="output-area">
+        <h4>📊 Hasil Simulasi untuk Ban {tyres} pada Suhu {temp}°C</h4>
+        <p><strong>P Min saat Low Pressure:</strong> <span style="color:#FFD100;">{p_min_low:.1f} psi</span></p>
+        <p><strong>P Max saat Low Pressure:</strong> <span style="color:#FFD100;">{p_max_low:.1f} psi</span></p>
+        <p><strong>P Min saat High Pressure:</strong> <span style="color:#FFD100;">{p_min_high:.1f} psi</span></p>
+        <p><strong>P Max saat High Pressure:</strong> <span style="color:#FFD100;">{p_max_high:.1f} psi</span></p>
+        <hr>
+        <p class="recommendation">✅ Rekomendasi Tekanan Ideal:</strong> Isi angin antara <strong>{p_min_low:.1f} – {p_max_high:.1f} psi</strong> untuk menghindari alarm Amber/Red.</p>
+        <p class="warning">⚠️ Jika tekanan saat ini < {p_min_low:.1f} psi → risiko <strong>Low Pressure</strong>.</p>
+        <p class="danger">⚠️ Jika tekanan saat ini > {p_max_high:.1f} psi → risiko <strong>High Pressure</strong>.</p>
+        </div>
+        """
+        return recommendation
+
+    btn_simulate.click(simulate_pressure, inputs=[tyre_type, temperature], outputs=output)
+
+demo.launch()