chore: minor fixes

components/hero.js

@@ -130,6 +130,7 @@ const CTAPrimary = styled.a`
   height: 2.81rem;
   cursor: pointer;
   padding: 0 3.5rem;
+  text-align: center;
   margin: 0 0 10px 0;
   border-radius: 7px;
   line-height: 2.8rem;

components/paths.js

@@ -151,7 +151,7 @@ const IMPLEMENTATIONS = [
     description: 'Create an account with one of the supported providers to get started immediately. Like your preferred email service, the provider handles all of the nuts-and-bolts behinds the scenes and is the easiest way to get started with your Lightning Address.',
     image: '/images/data4.svg',
     linkText: 'Get Started',
-    link: 'https://google.com',
+    link: '#providers',
     isSecondary: false
   },
   {

components/providers.js

@@ -23,7 +23,7 @@ const ProvidersInner = styled.div`
   flex-direction: column;
   justify-content: center;
 
-  ${media.tablet`
+  ${media.largeTablet`
     max-width: 1000px;
     flex-direction: row;
   `}
@@ -32,7 +32,7 @@ const ProvidersInner = styled.div`
 const ProvidersLeft = styled.div`
   padding-bottom: 60px;
 
-  ${media.tablet`
+  ${media.largeTablet`
     flex: 1;
     padding-bottom: 0;
     padding-right: 10px;
@@ -40,13 +40,13 @@ const ProvidersLeft = styled.div`
 `;
 
 const ProvidersRight = styled.div`
-  ${media.tablet`
+  ${media.largeTablet`
     flex: 1;
   `}
 `;
 
 const ProvidersRightInner = styled.div`
-  ${media.tablet`
+  ${media.largeTablet`
     padding-left: 100px;
   `}
 `;
@@ -61,9 +61,12 @@ const ProvidersTitle = styled.div`
   text-align: center;
   letter-spacing: -1px;
 
+  ${media.largeTablet`
+    text-align: left;
+  `}
+
   ${media.tablet`
     padding: 0;
-    text-align: left;
   `}
 `;
 
@@ -78,10 +81,13 @@ const ProvidersDescription = styled.div`
   letter-spacing: -0.5px;
   margin: 20px auto 40px auto;
 
+  ${media.largeTablet`
+    text-align: left;
+  `}
+
   ${media.tablet`
     padding: 0;
     font-size: 20px;
-    text-align: left;
     line-height: 1.6;
     letter-spacing: -1px;
     margin: 20px auto 0 auto;
@@ -132,7 +138,7 @@ const ProvidersEmailButtonText = styled.div`
 `;
 
 const ProviderCard = styled.div`
-  margin: 20px;
+  margin: 20px auto 20px auto;
   display: flex;
   padding: 16px;
   min-height: 100px;
@@ -153,7 +159,7 @@ const ProviderCard = styled.div`
   `}
 `;
 
-const ProviderSignUpButton = styled.div`
+const ProviderSignUpButton = styled.a`
   color: #fff;
   width: 140px;
   height: 2.81rem;
@@ -163,6 +169,7 @@ const ProviderSignUpButton = styled.div`
   border-radius: 7px;
   margin: 15px 0 0 0;
   line-height: 2.8rem;
+  text-decoration: none;
   background-color: #0070f3;
   box-shadow: 0 4px 14px 0 rgb(0 118 255 / 39%);
 
@@ -192,19 +199,19 @@ export const Providers = () => (
         </ProvidersDescription>
         <ProviderCard>
           <ZEBEDEEImage src={'/images/zebedee.svg'} alt="ZEBEDEE" style={{ marginLeft: '10px' }} />
-          <ProviderSignUpButton href="https://zebedee.io/wallet">Download App</ProviderSignUpButton>
+          <ProviderSignUpButton target="_blank" href="https://zebedee.io/wallet">Download App</ProviderSignUpButton>
         </ProviderCard>
         <ProviderCard>
           <ZEBEDEEImage src={'/images/lntxbot.png'} alt="LNTXBot" style={{ marginLeft: '15px' }}  />
-          <ProviderSignUpButton href="http://lntxbot.fiatjaf.com/">Open Telegram</ProviderSignUpButton>
+          <ProviderSignUpButton target="_blank" href="http://lntxbot.fiatjaf.com/">Open Telegram</ProviderSignUpButton>
         </ProviderCard>
         <ProviderCard>
           <ZEBEDEEImage src={'/images/lnbits.png'} alt="LNBits" />
-          <ProviderSignUpButton href="https://lnbits.com">Create Account</ProviderSignUpButton>
+          <ProviderSignUpButton target="_blank" href="https://lnbits.com">Create Account</ProviderSignUpButton>
         </ProviderCard>
         <ProviderCard>
           <ZEBEDEEImage src={'/images/coinos.png'} alt="coinos" />
-          <ProviderSignUpButton href="https://coinos.io">Sign Up</ProviderSignUpButton>
+          <ProviderSignUpButton target="_blank" href="https://coinos.io">Sign Up</ProviderSignUpButton>
         </ProviderCard>
       </ProvidersLeft>
       <ProvidersRight>

public/images/data3.svg

@@ -1 +1 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300" width="406" height="306" class="illustration styles_illustrationTablet__1DWOa"><polygon points="198.79 251.33 159.59 251.33 159.59 248.33 195.79 248.33 195.79 195.01 198.79 195.01 198.79 251.33" fill="#e6e6e6"></polygon><path d="M276.48,129.37c-.93,0-1.84.06-2.74.15,0-.43,0-.86,0-1.29a39,39,0,0,0-39-39c-.55,0-1.1,0-1.65,0A46.65,46.65,0,1,0,141,101a39,39,0,0,0,1.47,77.93h134a24.77,24.77,0,0,0,0-49.54Z" fill="#68e1fd"></path><rect x="155.27" y="153.28" width="92.99" height="58.61" fill="#ffd200"></rect><rect x="155.27" y="153.28" width="92.99" height="58.61" opacity="0.09"></rect><rect x="147.25" y="128.68" width="109.38" height="28.75" fill="#ffd200"></rect><rect x="159.59" y="139.24" width="65.26" height="6.69" fill="#24285b"></rect><circle cx="238.79" cy="143.58" r="5.46" fill="#fff"></circle><rect x="147.25" y="163.34" width="109.38" height="28.75" fill="#ffd200"></rect><rect x="159.59" y="173.89" width="65.26" height="6.69" fill="#24285b"></rect><circle cx="238.79" cy="178.24" r="5.46" fill="#fff"></circle><rect x="147.25" y="198" width="109.38" height="28.75" fill="#ffd200"></rect><rect x="159.59" y="208.55" width="65.26" height="6.69" fill="#24285b"></rect><circle cx="238.79" cy="212.9" r="5.46" fill="#fff"></circle><rect x="197.29" y="248.33" width="36.04" height="3" fill="#e6e6e6"></rect><circle cx="161.18" cy="249.95" r="5.9" fill="#c1c1c1"></circle><circle cx="233.33" cy="249.95" r="5.9" fill="#c1c1c1"></circle></svg>
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300" width="406" height="306" class="illustration styles_illustrationTablet__1DWOa"><polygon points="198.79 251.33 159.59 251.33 159.59 248.33 195.79 248.33 195.79 195.01 198.79 195.01 198.79 251.33" fill="#e6e6e6"></polygon><path d="M276.48,129.37c-.93,0-1.84.06-2.74.15,0-.43,0-.86,0-1.29a39,39,0,0,0-39-39c-.55,0-1.1,0-1.65,0A46.65,46.65,0,1,0,141,101a39,39,0,0,0,1.47,77.93h134a24.77,24.77,0,0,0,0-49.54Z" fill="#0070f3"></path><rect x="155.27" y="153.28" width="92.99" height="58.61" fill="#ffd200"></rect><rect x="155.27" y="153.28" width="92.99" height="58.61" opacity="0.09"></rect><rect x="147.25" y="128.68" width="109.38" height="28.75" fill="#ffd200"></rect><rect x="159.59" y="139.24" width="65.26" height="6.69" fill="#24285b"></rect><circle cx="238.79" cy="143.58" r="5.46" fill="#fff"></circle><rect x="147.25" y="163.34" width="109.38" height="28.75" fill="#ffd200"></rect><rect x="159.59" y="173.89" width="65.26" height="6.69" fill="#24285b"></rect><circle cx="238.79" cy="178.24" r="5.46" fill="#fff"></circle><rect x="147.25" y="198" width="109.38" height="28.75" fill="#ffd200"></rect><rect x="159.59" y="208.55" width="65.26" height="6.69" fill="#24285b"></rect><circle cx="238.79" cy="212.9" r="5.46" fill="#fff"></circle><rect x="197.29" y="248.33" width="36.04" height="3" fill="#e6e6e6"></rect><circle cx="161.18" cy="249.95" r="5.9" fill="#c1c1c1"></circle><circle cx="233.33" cy="249.95" r="5.9" fill="#c1c1c1"></circle></svg>