From 5f492b8be586a25303f4d057082ab8a6fa9d584b Mon Sep 17 00:00:00 2001
From: angbur <41025473+angbur@users.noreply.github.com>
Date: Mon, 28 Nov 2022 10:32:17 +0100
Subject: [PATCH] fix social icon in experience section (#98)

---
 src/components/organisms/work-timeline-item.astro | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/organisms/work-timeline-item.astro b/src/components/organisms/work-timeline-item.astro
index 3f68861..e615a47 100644
--- a/src/components/organisms/work-timeline-item.astro
+++ b/src/components/organisms/work-timeline-item.astro
@@ -15,9 +15,13 @@ const WorkTimelineItem = 'div';
 ---
 
 <WorkTimelineItem class:list={['flex', 'flex-col', 'gap-2', 'md:gap-0', 'mb-4', props.class]}>
-  <Typography variant="item-title">{job.role} <span class="font-medium"> &#8212;&nbsp;{job.company}</span></Typography>
-  <div class:list={['fixed', 'top-3', 'right-3', 'md:flex', 'sm:flex-wrap', 'gap-3', '[&>a]:my-2']}>
-    {job.socials?.map(({ icon, url }) => <IconButton icon={icon} href={url} target="_blank" size="small" />)}
+  <div class:list={['flex', 'justify-between', 'items-start', 'gap-4', 'sm:items-center']}>
+    <Typography variant="item-title"
+      >{job.role} <span class="font-medium"> &#8212;&nbsp;{job.company}</span>
+    </Typography>
+    <div class:list={['md:flex', 'sm:flex-wrap', 'gap-3', '[&>a]:mb-2', 'md:[&>a]:my-2']}>
+      {job.socials?.map(({ icon, url }) => <IconButton icon={icon} href={url} target="_blank" size="small" />)}
+    </div>
   </div>
   <Timestamp
     startDate={job.startDate}