Add perpetuity to hovercard portrait

components/CharacterHovercard/index.scss

@@ -1,4 +1,19 @@
 .Character.HovercardContent {
+  .title .Image {
+    position: relative;
+
+    .Perpetuity {
+      position: absolute;
+      background-image: url('/icons/perpetuity/filled.svg');
+      background-size: $unit-3x $unit-3x;
+      z-index: 20;
+      top: $unit-half * -1;
+      right: $unit-3x;
+      width: $unit-3x;
+      height: $unit-3x;
+    }
+  }
+
   .Mastery {
     display: flex;
     flex-direction: column;

components/CharacterHovercard/index.tsx

@@ -65,6 +65,12 @@ const CharacterHovercard = (props: Props) => {
     window.open(url, '_blank')
   }
 
+  const perpetuity = () => {
+    if (props.gridCharacter && props.gridCharacter.perpetuity) {
+      return <i className="Perpetuity" />
+    }
+  }
+
   function characterImage() {
     let imgSrc = ''
 
@@ -223,10 +229,13 @@ const CharacterHovercard = (props: Props) => {
         <div className="top">
           <div className="title">
             <h4>{props.gridCharacter.object.name[locale]}</h4>
-            <img
-              alt={props.gridCharacter.object.name[locale]}
-              src={characterImage()}
-            />
+            <div className="Image">
+              {perpetuity()}
+              <img
+                alt={props.gridCharacter.object.name[locale]}
+                src={characterImage()}
+              />
+            </div>
           </div>
           <div className="subInfo">
             <div className="icons">