FAQ - Styles on Links (#1833)

* ExternalLink styles + Add icon * remove external link icon * Fix code style issues with Prettier Co-authored-by: Lint Action <[email protected]>
gnosis · Nov 16, 2021 · 60acdfb · 60acdfb
1 parent 770b94f
commit 60acdfb
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 22 deletions.
diff --git a/package.json b/package.json
@@ -210,4 +210,4 @@
     "simple-sitemap-renderer": "^1.1.0",
     "timeago.js": "^4.0.2"
   }
-}
+}
diff --git a/src/custom/pages/Faq/index.tsx b/src/custom/pages/Faq/index.tsx
@@ -6,7 +6,16 @@ import { Link } from 'react-router-dom'
 import { ExternalLink as ExternalLinkTheme, StyledInternalLink } from 'theme'
 import { LinkScrollable } from 'components/Link'
 
-const ExternalLink = styled(ExternalLinkTheme)``
+const ExternalLink = styled(ExternalLinkTheme)`
+  color: ${({ theme }) => theme.text1};
+  text-decoration: underline;
+  font-weight: normal;
+  transition: color 0.2s ease-in-out;
+
+  &:hover {
+    color: ${({ theme }) => theme.textLink};
+  }
+`
 
 const Wrapper = styled.div`
   #table-container {
@@ -55,22 +64,6 @@ const Wrapper = styled.div`
   }
 
   ${Content} {
-    > div ${ExternalLink}, > p ${ExternalLink}, > p ${StyledInternalLink} {
-      color: ${({ theme }) => theme.text1};
-      text-decoration: underline;
-      font-weight: 400;
-      transition: color 0.2s ease-in-out;
-
-      &:hover {
-        color: ${({ theme }) => theme.textLink};
-      }
-    }
-
-    > div > ${ExternalLink} {
-      font-size: 16px;
-      font-weight: bold;
-    }
-
     > div > ul {
       margin: 12px 0 24px;
       padding: 0 0 0 20px;
@@ -910,13 +903,13 @@ export default function Faq() {
             <li>
               The production version:{' '}
               <ExternalLink href="https://cowswap.exchange" target="_blank" rel="noopener noreferrer">
-                <strong>https://cowswap.exchange</strong>
+                https://cowswap.exchange
               </ExternalLink>
             </li>
             <li>
               The public test version:{' '}
               <ExternalLink href="https://barn.cowswap.exchange" target="_blank" rel="noopener noreferrer">
-                <strong>https://barn.cowswap.exchange</strong>
+                https://barn.cowswap.exchange
               </ExternalLink>
             </li>
           </ul>
@@ -928,11 +921,11 @@ export default function Faq() {
           <p>
             Thus, when accessing{' '}
             <ExternalLink href="https://cowswap.exchange" target="_blank" rel="noopener noreferrer">
-              <strong>https://cowswap.exchange</strong>
+              https://cowswap.exchange
             </ExternalLink>{' '}
             you&apos;ll see orders/trades placed only using this interface. The same is true for orders/trades placed on{' '}
             <ExternalLink href="https://barn.cowswap.exchange" target="_blank" rel="noopener noreferrer">
-              <strong>https://barn.cowswap.exchange</strong>
+              https://barn.cowswap.exchange
             </ExternalLink>
             .
           </p>
-Original file line number
+Diff line change
@@ Expand Up / @@ -210,4 +210,4 @@ @@
         "simple-sitemap-renderer": "^1.1.0",
         "timeago.js": "^4.0.2"
       }
-    }
+    }