From 64cd69d0243c8f025cee8db21116f2b969561e57 Mon Sep 17 00:00:00 2001
From: Keane Chan <e0425601@u.nus.edu>
Date: Mon, 24 Oct 2022 21:55:21 +0800
Subject: [PATCH] [resumes][feat] move badge to the right instead

---
 .../src/components/resumes/badges/ResumeUserBadge.tsx | 11 ++++++-----
 .../components/resumes/badges/resumeBadgeConstants.ts |  6 +++---
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/apps/portal/src/components/resumes/badges/ResumeUserBadge.tsx b/apps/portal/src/components/resumes/badges/ResumeUserBadge.tsx
index 52d0de40..adf647a2 100644
--- a/apps/portal/src/components/resumes/badges/ResumeUserBadge.tsx
+++ b/apps/portal/src/components/resumes/badges/ResumeUserBadge.tsx
@@ -14,11 +14,12 @@ export default function ResumeUserBadge({
   return (
     <div className="group relative flex items-center justify-center">
       <div
-        className="absolute -top-3 hidden w-48 -translate-y-full flex-col
-        justify-center gap-1 rounded-lg bg-white px-2 py-2 text-center drop-shadow-xl
-        after:absolute after:left-1/2 after:top-[100%] after:-translate-x-1/2
-        after:border-8 after:border-x-transparent after:border-b-transparent
-       after:border-t-white after:drop-shadow-lg after:content-['']
+        className="absolute left-6 z-10 hidden w-48 flex-col
+        justify-center gap-1 rounded-xl bg-white px-2 py-2 text-center drop-shadow-lg
+
+        before:absolute before:top-12 before:-translate-x-6
+        before:border-8 before:border-y-transparent before:border-l-transparent
+        before:border-r-white before:drop-shadow-lg before:content-['']
         group-hover:flex">
         <Icon className="h-12 w-12 self-center" />
         <p className="font-medium">{title}</p>
diff --git a/apps/portal/src/components/resumes/badges/resumeBadgeConstants.ts b/apps/portal/src/components/resumes/badges/resumeBadgeConstants.ts
index 3b01ee9e..bb3f36ad 100644
--- a/apps/portal/src/components/resumes/badges/resumeBadgeConstants.ts
+++ b/apps/portal/src/components/resumes/badges/resumeBadgeConstants.ts
@@ -33,7 +33,7 @@ const TIER_ONE = 5;
 
 export const RESUME_USER_BADGES: Array<BadgeInfo> = [
   {
-    description: `Reviewed over ${TIER_THREE} resumes`,
+    description: `Reviewed ${TIER_THREE} resumes`,
     icon: ResumeBadgeSuperheroIcon,
     id: 'Superhero',
     isValid: (payload: BadgePayload) =>
@@ -41,7 +41,7 @@ export const RESUME_USER_BADGES: Array<BadgeInfo> = [
     title: 'True saviour of the people',
   },
   {
-    description: `Reviewed over ${TIER_TWO} resumes`,
+    description: `Reviewed ${TIER_TWO} resumes`,
     icon: ResumeBadgeDetectiveIcon,
     id: 'Detective',
     isValid: (payload: BadgePayload) =>
@@ -50,7 +50,7 @@ export const RESUME_USER_BADGES: Array<BadgeInfo> = [
     title: 'Keen eye for details like a private eye',
   },
   {
-    description: `Reviewed over ${TIER_ONE} resumes`,
+    description: `Reviewed ${TIER_ONE} resumes`,
     icon: ResumeBadgeEagleIcon,
     id: 'Eagle',
     isValid: (payload: BadgePayload) =>