Fix styling post-hovercard

components/CharacterUnit/index.scss

@@ -27,7 +27,8 @@
     h3 {
         color: #333;
         font-size: $font-regular;
-        font-weight: 500;
+        font-weight: $normal;
+        line-height: 1.1;
         margin: 0;
         max-width: 131px;
         text-align: center;

components/CharacterUnit/index.tsx

@@ -77,7 +77,6 @@ const CharacterUnit = (props: Props) => {
     )
 
     const unitContent = (
-        <div>
         <div className={classes}>
             { (props.editable) ? editableImage : image }
             { (gridCharacter && character) ? 
@@ -91,7 +90,6 @@ const CharacterUnit = (props: Props) => {
                 /> : '' }
             <h3 className="CharacterName">{character?.name.en}</h3>
         </div>
-        </div>
     )
 
     const withHovercard = (
@@ -101,9 +99,7 @@ const CharacterUnit = (props: Props) => {
     )
 
     return (
-        <div className={classes}>
+        (gridCharacter) ? withHovercard : unitContent
-            { (gridCharacter) ? withHovercard : unitContent }
-        </div>
     )
 }
 

components/SummonUnit/index.scss

@@ -92,7 +92,8 @@
     h3 {
         color: #333;
         font-size: $font-regular;
-        font-weight: 500;
+        font-weight: $normal;
+        line-height: 1.1;
         margin: 0;
         text-align: center;
     }

components/SummonUnit/index.tsx

@@ -83,7 +83,7 @@ const SummonUnit = (props: Props) => {
     )
 
     const unitContent = (
-        <div>
+        <div className={classes}>
             { (props.editable) ? editableImage : image }
             { (gridSummon) ? 
                 <UncapIndicator 
@@ -105,11 +105,7 @@ const SummonUnit = (props: Props) => {
         </SummonHovercard>
     )
 
-    return (
+    return (gridSummon) ? withHovercard : unitContent
-        <div className={classes}>
-            { (gridSummon) ? withHovercard : unitContent }
-        </div>
-    )
 }
 
 export default SummonUnit

components/WeaponUnit/index.scss

@@ -85,6 +85,7 @@
         color: $grey-00;
         font-size: $font-button;
         font-weight: $normal;
+        line-height: 1.1;
         margin: 0;
         text-align: center;
     }

components/WeaponUnit/index.tsx

@@ -90,7 +90,7 @@ const WeaponUnit = (props: Props) => {
     )
 
     const unitContent = (
-        <div>
+        <div className={classes}>
             { (props.editable && gridWeapon && canBeModified(gridWeapon)) ? 
             <WeaponModal gridWeapon={gridWeapon}>
                 <div>
@@ -118,11 +118,7 @@ const WeaponUnit = (props: Props) => {
         </WeaponHovercard>
     )
 
-    return (
+    return (gridWeapon) ? withHovercard : unitContent
-        <div className={classes}>
-            { (gridWeapon) ? withHovercard : unitContent }
-        </div>
-    )
 }
 
 export default WeaponUnit