icon sizes

Prototypr · Jun 10, 2024 · badebc7 · badebc7
1 parent 76840ab
commit badebc7
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 20 deletions.
diff --git a/components/SocialShare.js b/components/SocialShare.js
@@ -11,22 +11,22 @@ export default function SocialShare({ slug, authorTwitter, title = "" , size=28}
           target="_blank"
           href={`https://twitter.com/intent/tweet?url=https%3A%2F%2Fprototypr.io%2Fpost%2F${slug}%2F&via=prototypr&text=Recommended%20read:%20%22${titleUrl}%22${authorTwitter ? "%20by%20" + authorTwitter : ""}%20✨%20check%20it%20out!`}
         >
-          <TwitterLogo width={size} height={size}/>
+          <TwitterLogo size={size}/>
         </a>
       </div>
       <div>
         <a
           target="_blank"
           href={`http://www.facebook.com/share.php?u=https%3A%2F%2Fprototypr.io%2Fpost%2F${slug}`}>
-        <FacebookLogo width={size} height={size}/>
+        <FacebookLogo size={size}/>
         </a>
       </div>
       <div>
         <a
           target="_blank"
           href={`https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fprototypr.io%2Fpost%2F${slug}`}
         >
-                  <LinkedinLogo width={size} height={size}/>
+                  <LinkedinLogo size={size}/>
 
         </a>
       </div>

diff --git a/components/people/ProfileCard.js b/components/people/ProfileCard.js
@@ -94,8 +94,7 @@ export default function ProfileCard({
                 <MapPin
                   className="mr-1 my-auto"
                   color="rgba(0,0,0,0.8)"
-                  width={16}
-                  height={16}
+                  size={16}
                 />
                 <div className="inline-block my-auto">{locationNiceName}</div>
               </div>
@@ -127,7 +126,7 @@ export default function ProfileCard({
                 href={`https://twitter.com/${twitter}`}
                 target="_blank"
               >
-                <TwitterLogo color="rgba(0,0,0,0.8)" width={20} height={20} />
+                <TwitterLogo color="rgba(0,0,0,0.8)" size={20} />
               </a>
             ) : null}
             {dribbble ? (
@@ -136,7 +135,7 @@ export default function ProfileCard({
                 href={`https://dribbble.com/${dribbble}`}
                 target="_blank"
               >
-                <DribbbleLogo color="rgba(0,0,0,0.8)" width={20} height={20} />
+                <DribbbleLogo color="rgba(0,0,0,0.8)" size={20} />
               </a>
             ) : null}
             {github ? (
@@ -145,7 +144,7 @@ export default function ProfileCard({
                 href={`https://github.com/${github}`}
                 target="_blank"
               >
-                <GithubLogo color="rgba(0,0,0,0.8)" width={20} height={20} />
+                <GithubLogo color="rgba(0,0,0,0.8)" size={20} />
               </a>
             ) : null}
           </div>

diff --git a/components/people/ProfilePageLayout.js b/components/people/ProfilePageLayout.js
@@ -277,17 +277,16 @@ const ProfilePageLayout = ({
                     <h3 className="text-gray-500 uppercase font-semibold tracking-wide text-xs my-2">
                       On Social
                     </h3>
-                    <div className="flex">
+                    <div className="flex gap-2.5">
                       {(twitter || (unapproved && user?.profile?.twitter)) && (
                         <a
-                          className="link block mr-2"
+                          className="link block"
                           href={`https://twitter.com/${twitter || user?.profile?.twitter}`}
                           target="_blank"
                         >
                           <TwitterLogo
                             color="rgba(0,0,0,0.8)"
-                            width={20}
-                            height={20}
+                            size={24}
                           />
                           {/* <img
                           style={{ width: "28px" }}
@@ -300,14 +299,13 @@ const ProfilePageLayout = ({
                       {(dribbble ||
                         (unapproved && user?.profile?.dribbble)) && (
                         <a
-                          className="link block mr-2"
+                          className="link block"
                           href={`https://dribbble.com/${dribbble || user?.profile?.dribbble}`}
                           target="_blank"
                         >
                           <DribbbleLogo
                             color="rgba(0,0,0,0.8)"
-                            width={20}
-                            height={20}
+                            size={24}
                           />
 
                           {/* <img
@@ -320,14 +318,13 @@ const ProfilePageLayout = ({
                       )}
                       {(github || (unapproved && user?.profile?.github)) && (
                         <a
-                          className="link block mr-2"
+                          className="link block"
                           href={`https://github.com/${github || user?.profile?.github}`}
                           target="_blank"
                         >
                           <GithubLogo
                             color="rgba(0,0,0,0.8)"
-                            width={20}
-                            height={20}
+                            size={24}
                           />
                         </a>
                       )}

diff --git a/pages/news/[slug].js b/pages/news/[slug].js
@@ -391,7 +391,7 @@ export default function Post({
                 </div>
                 <div className="mt-2">
                   <SocialShare
-                    size={22}
+                    size={28}
                     title={post.attributes.title}
                     slug={post.attributes.slug}
                   />

diff --git a/pages/toolbox/[slug].js b/pages/toolbox/[slug].js
@@ -316,7 +316,7 @@ const ToolContent = ({
                   </div>
                   <div className="mt-2">
                     <SocialShare
-                      size={22}
+                      size={28}
                       title={post.attributes.title}
                       slug={post.attributes.slug}
                     />