Fix(UI): \n 1. Prevent experience section dates from being detected as phone numbers on iOS on Safari. \n 2. Improved bullet point styling on all cards.

styles/experience-section.css

@@ -7,22 +7,23 @@
 }
 .experience-date {
     color: var(--primary-colour) !important;
-    font-size: 0.9rem;
+    font-size: 0.95rem;
     width: 50%;
     min-width: 50%;
-    -webkit-text-fill-color: inherit;
     text-decoration: none !important;
-    pointer-events: none;
+    -webkit-text-fill-color: inherit !important;
+    -webkit-text-decoration: none !important;
+    pointer-events: none !important;
 }
 .experience-card:last-child {
     margin-bottom: 0;
 }
 .experience-company-and-date {
-    display: flex;
+    display: inline-flex;
     justify-content: space-between;
     align-items: center;
     text-align: left;
-    width: 100%;
+    width: 90%;
     margin-bottom: 0.25rem;
 }
 .experience-description {
@@ -36,10 +37,6 @@
     display: flex;
     align-items: center;
 }
-.experience-additional-entry .experience-company-and-date {
-    display: flex;
-    width: 100%;
-}
 .experience-additional-entry .experience-job-title, 
 .experience-additional-entry .experience-company, 
 .experience-additional-entry .experience-date {

styles/home.css

@@ -16,7 +16,7 @@ h1, h2, h3 {
 }
 
 ul, li {
-    list-style-position: outside;
+    list-style-position: inside;
 }
 
 /* Common card styles */
@@ -41,7 +41,7 @@ ul, li {
 /* Responsive design */
 @media (max-width: 768px) {
     nav ul {
-        flex-direction: column;
+        flex-direction: row;
         align-items: center;
         gap: 1rem;
     }

styles/navigation.css

@@ -12,6 +12,7 @@ nav ul {
     display: flex;
     justify-content: center;
     gap: 2rem;
+    flex-wrap: wrap;
 }
 nav ul li {
     margin-top: auto;