From 1152e1acacde90b49d4c6d09b479d13802b84229 Mon Sep 17 00:00:00 2001
From: 7dJx1qP <38586902+7dJx1qP@users.noreply.github.com>
Date: Thu, 14 Oct 2021 17:56:41 -0400
Subject: [PATCH] Fix performer icon link padding (#1843)

* fix performer url icon link padding
---
 .../components/Performers/PerformerDetails/Performer.tsx | 6 +++---
 ui/v2.5/src/components/Performers/styles.scss            | 9 +++++++++
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx
index 92f602679..b694dfe98 100644
--- a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx
+++ b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx
@@ -221,7 +221,7 @@ export const Performer: React.FC = () => {
         <Icon icon="heart" />
       </Button>
       {performer.url && (
-        <Button className="minimal">
+        <Button className="minimal icon-link">
           <a
             href={TextUtils.sanitiseURL(performer.url)}
             className="link"
@@ -233,7 +233,7 @@ export const Performer: React.FC = () => {
         </Button>
       )}
       {performer.twitter && (
-        <Button className="minimal">
+        <Button className="minimal icon-link">
           <a
             href={TextUtils.sanitiseURL(
               performer.twitter,
@@ -248,7 +248,7 @@ export const Performer: React.FC = () => {
         </Button>
       )}
       {performer.instagram && (
-        <Button className="minimal">
+        <Button className="minimal icon-link">
           <a
             href={TextUtils.sanitiseURL(
               performer.instagram,
diff --git a/ui/v2.5/src/components/Performers/styles.scss b/ui/v2.5/src/components/Performers/styles.scss
index 8c9c797d3..d06c3645a 100644
--- a/ui/v2.5/src/components/Performers/styles.scss
+++ b/ui/v2.5/src/components/Performers/styles.scss
@@ -37,6 +37,15 @@
       .instagram {
         color: pink;
       }
+
+      .icon-link {
+        padding: 0;
+
+        a {
+          display: inline-block;
+          padding: $btn-padding-y $btn-padding-x;
+        }
+      }
     }
   }