new style for experiences section

src/components/SingleExperience.jsx

@@ -1,22 +1,21 @@
 import '../styles/SingleExperience.css';
 
-function SingleExperience({ experience, whichSide }) {
+function SingleExperience({ experience }) {
     return (
-        <div className={`experience-card ${whichSide ? 'right' : 'left'}`}>
-            <div className="experience-card-header">
-                <div className="experience-card-header-left">
-                    <h3 className="experience-role">{experience.role}</h3>
-                    <p className="experience-location">
-                        {experience.company} • {experience.location}
-                    </p>
-                </div>
+        <div className="experience-card">
+            <div className="experience-card-left">
+                <h3 className="experience-company">{experience.company}</h3>
+                <p className="experience-location">{experience.location}</p>
                 <p className="experience-duration">{experience.duration}</p>
             </div>
-            <ul className="experience-tasks">
-                {experience.tasks.map((task, index) => (
-                    <li key={index}>{task}</li>
-                ))}
-            </ul>
+            <div className="experience-card-right">
+                <h3 className="experience-role">{experience.role}</h3>
+                <ul className="experience-tasks">
+                    {experience.tasks.map((task, index) => (
+                        <li key={index}>{task}</li>
+                    ))}
+                </ul>
+            </div>
         </div>
     );
 }