Diff of /templates/p.html [000000] .. [b018ba]

Switch to side-by-side view

--- a
+++ b/templates/p.html
@@ -0,0 +1,139 @@
+<!-- p.html -->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Prediction Result</title>
+    <style>
+        body {
+            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+            height: 100vh;
+            margin: 0;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            align-items: center;
+            background-image: linear-gradient(to right, #8e2de2, #4a00e0);
+            color: #fff;
+        }
+
+        .result-box {
+            background-color: rgba(200, 240, 196, 0.85);
+            color: #040404;
+            padding: 20px 50px;
+            border-radius: 10px;
+            box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
+            text-align: center;
+            max-width: 600px;
+            margin: 40px;
+        }
+
+        .result-box h2 {
+            margin-bottom: 15px;
+            font-size: 2rem;
+            color: #333;
+        }
+
+        .result-message {
+            font-size: 20px;
+            font-weight: bold;
+            margin-bottom: 20px;
+            color: #444;
+        }
+
+        .additional-details {
+            font-size: 18px;
+            color: #555;
+            margin-top: 10px;
+        }
+
+        .logo {
+            width: 150px;
+            height: auto;
+            margin-bottom: 20px;
+        }
+
+        .back-to-home-btn {
+            background-color: hsl(286, 64%, 80%);
+            color: #000000;
+            font-size: 18px;
+            font-weight: bold;
+            padding: 12px 25px;
+            border-radius: 8px;
+            text-decoration: none;
+            transition: background-color 0.3s ease;
+            margin-top: 20px;
+        }
+
+        .back-to-home-btn:hover {
+            background-color: #f0f0f0;
+            color: #333;
+        }
+        .btn-home {
+    background-color: #000000; /* Black color */
+    color: white;
+    height: 50px;
+    width: 100px;
+    padding-bottom: 5px;
+    padding: 4px 4px; /* Smaller padding */
+    font-size: 26px; /* Smaller font size */
+    border-radius: 5px;
+    margin-top: 1px;
+    margin-bottom: -10px;
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+    text-decoration: none; /* Remove underline */
+    text-align: center;
+}
+
+.btn-home:hover {
+    background-color: #333333; /* Darker shade of black on hover */
+    color: white; /* Keep text white on hover */
+    text-decoration: none; /* Remove underline on hover */
+}
+    </style>
+</head>
+
+<body>
+    <header>
+        <img src="/static/NEWLOGO.png" alt="Logo" class="logo">
+    </header>
+    <div>
+        <a href="/" class="btn-home">Home</a> <!-- Link to the home page -->
+    </div>
+
+    <div class="result-box">
+        <h2>Prediction Result</h2>
+        {% if predicted_class == 0 %}
+        <div class="result-message">The predicted class is: <strong>dyed-lifted-polyps</strong></div>
+        {% elif predicted_class == 1 %}
+        <div class="result-message">The predicted class is: <strong>dyed-resection-margins</strong></div>
+        {% elif predicted_class == 2 %}
+        <div class="result-message">The predicted class is: <strong>esophagitis</strong></div>
+        {% elif predicted_class == 3 %}
+        <div class="result-message">The predicted class is: <strong>normal-cecum</strong></div>
+        {% elif predicted_class == 4 %}
+        <div class="result-message">The predicted class is: <strong>normal-pylorus</strong></div>
+        {% elif predicted_class == 5 %}
+        <div class="result-message">The predicted class is: <strong>normal-z-line</strong></div>
+        {% elif predicted_class == 6 %}
+        <div class="result-message">The predicted class is: <strong>polyps</strong></div>
+        {% elif predicted_class == 7 %}
+        <div class="result-message">The predicted class is: <strong>ulcerative-colitis</strong></div>
+        {% else %}
+        <div class="result-message">The predicted class is: <strong>normal-z-line</strong></div>
+        {% endif %}
+        <p class="additional-details">
+            Predicted class ID: <strong>{{ predicted_class }}</strong><br>
+            Suggested action: Consult a gastroenterologist if required.
+        </p>
+    </div>
+
+    <div>
+        <a href="{% url 'GI_diseases' %}" class="back-to-home-btn">Upload Another Image</a>
+    </div>
+</body>
+
+</html>