Update pages/3Life Cycle of Machine Learning Project.py

pages/3Life Cycle of Machine Learning Project.py

@@ -59,7 +59,6 @@ st.markdown(
             flex-direction: column;
             align-items: center;
         }
-
         /* Styling for each phase (rectangle button) */
         .phase {
             position: relative;
@@ -78,25 +77,24 @@ st.markdown(
             align-items: center;
             box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
             transition: transform 0.3s ease, background-color 0.3s ease;
+            color: black; /* Always black text */
         }
-
         /* Colors for each phase (original colors) */
-        .phase-1 { background-color: #E6F4EA; color: black; } /* Green */
-        .phase-2 { background-color: #E0F7FA; color: black; } /* Blue */
-        .phase-3 { background-color: #FFF9C4; color: black; } /* Yellow */
-        .phase-4 { background-color: #FFE0B2; color: black; } /* Orange */
-        .phase-5 { background-color: #DCEDC8; color: black; } /* Light Green */
-        .phase-6 { background-color: #D1C4E9; color: black; } /* Purple */
-        .phase-7 { background-color: #F8BBD0; color: black; } /* Pink */
-        .phase-8 { background-color: #CFD8DC; color: black; } /* Gray-Blue */
-        .phase-9 { background-color: #B2EBF2; color: black; } /* Cyan */
-        .phase-10 { background-color: #FFE082; color: black; } /* Amber */
-
+        .phase-1 { background-color: #E6F4EA; } /* Light Green */
+        .phase-2 { background-color: #E0F7FA; } /* Light Blue */
+        .phase-3 { background-color: #FFF9C4; } /* Light Yellow */
+        .phase-4 { background-color: #FFE0B2; } /* Light Orange */
+        .phase-5 { background-color: #DCEDC8; } /* Light Green */
+        .phase-6 { background-color: #D1C4E9; } /* Light Purple */
+        .phase-7 { background-color: #F8BBD0; } /* Light Pink */
+        .phase-8 { background-color: #CFD8DC; } /* Light Gray-Blue */
+        .phase-9 { background-color: #B2EBF2; } /* Light Cyan */
+        .phase-10 { background-color: #FFE082; } /* Light Amber */
         .phase:hover {
             transform: scale(1.05);
             background-color: #F0F0F0; /* Slightly lighter on hover */
+            color: black; /* Ensure text remains black */
         }
-
         /* Arrow styling */
         .arrow {
             font-size: 24px; /* Arrow size */