fix: put back link on notes

factchain · Jan 1, 1970 · 1421fdd · 1421fdd
1 parent 6cb9bff
commit 1421fdd
Show file tree

Hide file tree

Showing 6 changed files with 34 additions and 14 deletions.
diff --git a/fc-community-extension/src/pages/components/FCNote.js b/fc-community-extension/src/pages/components/FCNote.js
@@ -4,7 +4,12 @@ const FCNote = (props) => {
   // assuming `postUrl` looks like: https://x.com/foo/status/<id>
   const postId = props.postUrl.split('/').slice(-1)[0];
   return (
-    <div className="bg-fcGrey/70 rounded-md p-2 text-xs space-y-2 shadow">
+    <a
+      href={props.postUrl}
+      target="_blank"
+      rel="noreferrer noopener"
+      className="bg-fcGrey/70 rounded-md p-2 text-xs space-y-2 shadow block hover:bg-fcGrey/90"
+    >
       <div className="flex items-center gap-2">
         <div className="shrink-0 w-[24px] h-[24px] rounded-full bg-pink-400/30"></div>
         <div className="truncate">
@@ -30,7 +35,7 @@ const FCNote = (props) => {
           </div>
         </div>
       </div>
-    </div>
+    </a>
   );
 };
 

diff --git a/fc-community-extension/src/pages/createNote.js b/fc-community-extension/src/pages/createNote.js
@@ -36,7 +36,9 @@ export function FCCreateNote({ postUrl, createNote }) {
       <div>
         <div style="font-size: 120%">
           Provide additional context for{' '}
-          <a href={postUrl}>{cutText(postUrl, 35)}</a>
+          <a className="link" href={postUrl}>
+            {cutText(postUrl, 35)}
+          </a>
         </div>
         <div>
           <textarea
@@ -55,7 +57,11 @@ export function FCCreateNote({ postUrl, createNote }) {
               </div>
               <div style="margin-bottom: 10px; font-size: 90%; text-align: center; position: relative; top:50%; left: 50%; transform: translate(-50%, -50%);">
                 View transaction on{' '}
-                <a href={makeTransactionUrl(transactionHash())} target="_blank">
+                <a
+                  className="link"
+                  href={makeTransactionUrl(transactionHash())}
+                  target="_blank"
+                >
                   etherscan
                 </a>
                 .

diff --git a/fc-community-extension/src/pages/mintFactchainNote.js b/fc-community-extension/src/pages/mintFactchainNote.js
@@ -74,7 +74,7 @@ export function FCMintFactchainNote({
             </div>
             <div style="margin-bottom: 10px; font-size: 150%; text-align: center; position: relative; top:50%; left: 50%; transform: translate(-50%, -50%);">
               Head over to{' '}
-              <a href={openseaUrl()} target="_blank">
+              <a className="link" href={openseaUrl()} target="_blank">
                 OpenSea
               </a>{' '}
               to buy one for yourself!
@@ -86,14 +86,18 @@ export function FCMintFactchainNote({
             </div>
             <div style="margin-bottom: 10px; font-size: 110%; text-align: center; position: relative; top:50%; left: 50%; transform: translate(-50%, -50%);">
               Check it out on{' '}
-              <a href={openseaUrl()} target="_blank">
+              <a className="link" href={openseaUrl()} target="_blank">
                 OpenSea
               </a>
               .
             </div>
             <div style="margin-bottom: 10px; font-size: 90%; text-align: center; position: relative; top:50%; left: 50%; transform: translate(-50%, -50%);">
               View transaction on{' '}
-              <a href={makeTransactionUrl(transactionHash())} target="_blank">
+              <a
+                className="link"
+                href={makeTransactionUrl(transactionHash())}
+                target="_blank"
+              >
                 etherscan
               </a>
               .

diff --git a/fc-community-extension/src/pages/mintXNote.js b/fc-community-extension/src/pages/mintXNote.js
@@ -62,14 +62,18 @@ export function FCMintXNote({ noteUrl, content, mintXNote, contractAddress }) {
             </div>
             <div style="margin-bottom: 10px; font-size: 110%; text-align: center; position: relative; top:50%; left: 50%; transform: translate(-50%, -50%);">
               Check it out on{' '}
-              <a href={openseaUrl()} target="_blank">
+              <a className="link" href={openseaUrl()} target="_blank">
                 OpenSea
               </a>
               .
             </div>
             <div style="margin-bottom: 10px; font-size: 90%; text-align: center; position: relative; top:50%; left: 50%; transform: translate(-50%, -50%);">
               View transaction on{' '}
-              <a href={makeTransactionUrl(transactionHash())} target="_blank">
+              <a
+                className="link"
+                href={makeTransactionUrl(transactionHash())}
+                target="_blank"
+              >
                 etherscan
               </a>
               .

diff --git a/fc-community-extension/src/pages/rateNotes.js b/fc-community-extension/src/pages/rateNotes.js
@@ -60,7 +60,11 @@ function FCRateNote({ note, rateNote }) {
               </div>
               <div style="margin-bottom: 10px; font-size: 90%; text-align: center; position: relative; top:50%; left: 50%; transform: translate(-50%, -50%);">
                 View transaction on{' '}
-                <a href={makeTransactionUrl(transactionHash())} target="_blank">
+                <a
+                  className="link"
+                  href={makeTransactionUrl(transactionHash())}
+                  target="_blank"
+                >
                   etherscan
                 </a>
                 .

diff --git a/fc-community-extension/src/pages/style.css b/fc-community-extension/src/pages/style.css
@@ -56,10 +56,7 @@ body {
   cursor: pointer;
 }
 
-a:link {
-  color: #00adb5;
-}
-a:visited {
+a.link:visited {
   color: #00adb5;
 }