mirror of
https://github.com/aljazceru/lightning-address.git
synced 2025-12-17 05:14:22 +01:00
feature: adding new community section
feature: new copy/text for whole site feature: adding new modules
This commit is contained in:
Andre Neves
38
README.md
38
README.md
@@ -2,37 +2,71 @@
|
||||
|
||||
# Lightning Address
|
||||
|
||||
### **Like an email address, but for your money.**
|
||||
### **Like an email address, but for your Bitcoin.**
|
||||
|
||||
## General Information
|
||||
------------------------------------------------------------------------
|
||||
|
||||
The Lightning Address is an [Internet Identifier](https://datatracker.ietf.org/doc/html/rfc5322#section-3.4.1) that allows anyone to send you Bitcoin over the Lightning Network. No scanning of QR codes or pasting invoices necessary.
|
||||
|
||||
For more information check out the website: [lightningaddress.com](https://lightningaddress.com)
|
||||
|
||||
## Developers
|
||||
------------------------------------------------------------------------
|
||||
|
||||
If you are a developer aiming to introduce support for Lightning Addresses in your application, wallet, check the [DIY](./DIY.md) section.
|
||||
|
||||
## Bridge Servers
|
||||
------------------------------------------------------------------------
|
||||
|
||||
If you don't want to roll out an entire HTTP / LNURL server on your own setup/infrastructure, but already have a Lightning node you want to use for your Lightning Address? You can use a Bridge Server to ensure your Lightning Node can properly receive payments from your Lightning Address. Check the [Bridge Server](./BRIDGE.md) instructions for a plug-n-play solution.
|
||||
|
||||
## Wallets Supported
|
||||
------------------------------------------------------------------------
|
||||
|
||||
_Bitcoin Lightning wallets that support sending and receiving to **Lightning Addresses**_.
|
||||
|
||||
| Wallet | Sending | Receiving |
|
||||
| :--- | :-------: | :-----: |
|
||||
| [Blixt](https://blixtwallet.github.io/) | ☑️ | ----- |
|
||||
| [BlueWallet](https://bluewallet.io/) | | |
|
||||
| [Breez](https://breez.technology/) | | |
|
||||
| [coinos](https://coinos.io/) | WIP | WIP |
|
||||
| [LNbits](https://lnbits.org/) | ☑️ | ---- |
|
||||
| [@lntxbot](https://t.me/lntxbot) | ☑️ | ☑️ |
|
||||
| [Muun](https://muun.com/) | | |
|
||||
| [Phoenix](https://phoenix.acinq.co/) | | |
|
||||
| [ThunderHub](https://github.com/apotdevin/thunderhub) | | |
|
||||
| [Wallet of Satoshi](https://www.walletofsatoshi.com/) | | |
|
||||
| [Zap](https://www.zaphq.io/) | | |
|
||||
| [SBW](https://lightning-wallet.com/) | ☑️ | ---- |
|
||||
| [ZEBEDEE](https://zebedee.io/wallet) (and [Bots](https://zebedee.io/bots/), and [Extensions](https://zebedee.io/wallet)) | ☑️ | ☑️ |
|
||||
| [Zeus](https://github.com/ZeusLN/zeus) | WIP | ---- |
|
||||
|
||||
## TLDR
|
||||
------------------------------------------------------------------------
|
||||
|
||||
Here's a quick primer on how Lightning Address works and how it relies on the [LNURL Pay protocol](https://github.com/fiatjaf/lnurl-rfc/blob/master/lnurl-pay.md).
|
||||
|
||||
|
||||
|
||||
## Diagrams
|
||||
### Diagrams
|
||||
------------------------------------------------------------------------
|
||||
|
||||
All illustrative and informative diagrams are available under the [DIAGRAMS](./diagrams/README.md) folder.
|
||||
|
||||
### Videos & Podcasts
|
||||
------------------------------------------------------------------------
|
||||
|
||||
- [Introducing The Lightning Address]() - a recorded presentation on the explanations of why Lightning Address was created and the problems this protocol aims to solve
|
||||
|
||||
## Contributions
|
||||
------------------------------------------------------------------------
|
||||
|
||||
Contributions are welcome, for both the lightningaddress.com website as well as the Lightning Address protocol itself. Please submit a PR here or on the core [LNURL RFC repository](https://github.com/fiatjaf/lnurl-rfc).
|
||||
|
||||
## Donations
|
||||
------------------------------------------------------------------------
|
||||
|
||||
If this project is important to you, consider donating to the contributors, creators, and developers pushing this initiative forward.
|
||||
|
||||
|
||||
@@ -183,34 +183,19 @@ const CTAPrimary = styled.a`
|
||||
|
||||
const BENEFITS = [
|
||||
{
|
||||
title: 'Skip QR codes',
|
||||
description: () => <>Gone are the days that you needed to send your friend a Lightning invoice QR code in order to receive a payment. Now you can just text them to <b>"pay me at user@domain.com"</b> and go about your day.</>,
|
||||
image: '/images/qrcode.svg'
|
||||
},
|
||||
{
|
||||
title: 'Attach Comments',
|
||||
description: 'Payments to your Lightning Address can also contain attached messages. Whether it is a donation message, a comment from a fan, or a friend\'s joke, messages always improve the experience.',
|
||||
image: '/images/comments.svg'
|
||||
},
|
||||
{
|
||||
title: 'Open All Networks',
|
||||
description: 'You can finally send money to that friend who uses that other app. From Service A to App B to User C to Platform D, Lightning Addresses set your money free -- a global boundless payment identifier for anyone and everyone.',
|
||||
image: '/images/data.svg'
|
||||
},
|
||||
{
|
||||
title: 'Set Custom Properties',
|
||||
description: 'Enjoy payments from anyone anywhere, for any amount, with or without attached comments. Set minimums-&-maximums, images, and descriptions. Properties can change, but your Lightning Address stays the same.',
|
||||
image: '/images/bitcoin1.svg'
|
||||
},
|
||||
{
|
||||
title: 'Familiar Experience',
|
||||
description: 'Like an email address but for your money! You can now have the exact same flow to send money as you have when sending an email message to a friend. A familiar user experience allowing everyone to participate.',
|
||||
title: 'Easy and familiar',
|
||||
description: 'No more requesting invoices and scanning QR codes to send your friends Bitcoin. If you can send an email, you can send a transaction to a Lightning Address.',
|
||||
image: '/images/bitcoin2.svg'
|
||||
},
|
||||
{
|
||||
title: 'Be Interoperable',
|
||||
description: 'Lightning Address builds upon the LNURL Protocol which is widely adopted in Bitcoin Lightning-enabled services. The aim of LNURL is to improve user-experience around payments between apps and services.',
|
||||
image: '/images/bitcoin3.svg'
|
||||
title: 'Extended functionality',
|
||||
description: 'Set minimum and maximum payment sizes to accept, add images and comments to your transactions and more features that weren\'t possible before.',
|
||||
image: '/images/comments.svg'
|
||||
},
|
||||
{
|
||||
title: 'Sets your money free',
|
||||
description: 'Your friend uses a different app or wallet? No problem! This is a new standard designed to break the barriers between Lightning providers. We all speak Bitcoin.',
|
||||
image: '/images/data.svg'
|
||||
},
|
||||
];
|
||||
|
||||
@@ -218,7 +203,7 @@ export const Benefits = () => (
|
||||
<BenefitsModule>
|
||||
<BenefitsIntro>Users & Enthusiasts</BenefitsIntro>
|
||||
<BenefitsTitle>Why do I need a Lightning Address?</BenefitsTitle>
|
||||
<BenefitsDescription>The Lightning Address makes it simple to send and receive money over the Bitcoin Lightning Network. No more scanning of QR codes, no more sharing of payment requests. <br />Send money like you send emails -- instantly and abundantly.</BenefitsDescription>
|
||||
<BenefitsDescription>We created the Lightning Address protocol to empower everyone to send money like we send emails — instantly and abundantly. Coupled with the Lightning Network’s ability to send Bitcoin instantly and with (almost) no fees, we’re ushering in a new standard for how value moves around the world.</BenefitsDescription>
|
||||
<BenefitsCardGrid>
|
||||
{(BENEFITS || []).map((benefit) => (
|
||||
<BenefitsCard key={benefit.title}>
|
||||
@@ -237,7 +222,7 @@ export const Benefits = () => (
|
||||
))}
|
||||
</BenefitsCardGrid>
|
||||
<CTAWrapper>
|
||||
<CTAPrimary href="#providers">Get My Lightning Address</CTAPrimary>
|
||||
<CTAPrimary href="#providers">Get a Lightning Address</CTAPrimary>
|
||||
</CTAWrapper>
|
||||
</BenefitsModule>
|
||||
)
|
||||
|
||||
376
components/community.js
Normal file
376
components/community.js
Normal file
@@ -0,0 +1,376 @@
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { media } from '../utils';
|
||||
|
||||
const CommunityModule = styled.div`
|
||||
display: flex;
|
||||
background: #fff;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding: 60px 0 60px 0;
|
||||
justify-content: center;
|
||||
border-top: 1px solid #eaeaea;
|
||||
|
||||
${media.tablet`
|
||||
min-height: 700px;
|
||||
padding: 120px 0 120px 0;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityTitle = styled.div`
|
||||
margin: 0 auto;
|
||||
font-size: 30px;
|
||||
padding: 0 30px;
|
||||
max-width: 500px;
|
||||
font-weight: 800;
|
||||
line-height: 1.3;
|
||||
text-align: center;
|
||||
letter-spacing: -0.5px;
|
||||
|
||||
${media.tablet`
|
||||
padding: 0;
|
||||
font-size: 44px;
|
||||
letter-spacing: -1px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityDescription = styled.div`
|
||||
color: #666666;
|
||||
font-size: 16px;
|
||||
line-height: 1.4;
|
||||
padding: 0 30px;
|
||||
font-weight: 400;
|
||||
max-width: 800px;
|
||||
text-align: center;
|
||||
letter-spacing: -1px;
|
||||
margin: 20px auto 0 auto;
|
||||
|
||||
${media.tablet`
|
||||
padding: 0;
|
||||
font-size: 20px;
|
||||
line-height: 1.6;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityIntro = styled.p`
|
||||
color: #f38800;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
max-width: 900px;
|
||||
font-weight: 500;
|
||||
padding: 8px 12px;
|
||||
border-radius: 7px;
|
||||
margin: 0 auto 20px auto;
|
||||
background: rgba(255,97,0,0.1);
|
||||
|
||||
${media.tablet`
|
||||
font-size: 18px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityInner = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
${media.largeTablet`
|
||||
max-width: 1000px;
|
||||
flex-direction: row;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityLeft = styled.div`
|
||||
padding-bottom: 60px;
|
||||
|
||||
${media.largeTablet`
|
||||
flex: 1;
|
||||
padding-bottom: 0;
|
||||
padding-right: 10px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityRight = styled.div`
|
||||
${media.largeTablet`
|
||||
flex: 1;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityRightInner = styled.div`
|
||||
${media.largeTablet`
|
||||
padding-left: 100px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityCard = styled.div`
|
||||
margin: 20px auto 20px auto;
|
||||
display: flex;
|
||||
padding: 16px;
|
||||
min-height: 100px;
|
||||
border-radius: 6px;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
justify-content: center;
|
||||
box-shadow: 0px 30px 60px rgb(0 0 0 / 12%);
|
||||
|
||||
${media.tablet`
|
||||
width: 425px;
|
||||
height: 42px;
|
||||
margin: 20px 0;
|
||||
min-height: auto;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunitySignUpButton = styled.a`
|
||||
color: #fff;
|
||||
width: 140px;
|
||||
height: 2.81rem;
|
||||
cursor: pointer;
|
||||
min-width: 220px;
|
||||
padding: 0 0.5rem;
|
||||
text-align: center;
|
||||
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%);
|
||||
opacity: ${({ isDisabled }) => isDisabled ? '0.5' : '1'};
|
||||
|
||||
&:hover {
|
||||
background: ${({ isDisabled }) => isDisabled ? '#0070f3' : 'rgba(0,118,255,0.9)'};
|
||||
box-shadow: 0 6px 20px rgb(0 118 255 / 23%);
|
||||
}
|
||||
|
||||
${media.tablet`
|
||||
min-width: 220px;
|
||||
margin: 0 15px 0 0;
|
||||
`}
|
||||
`;
|
||||
|
||||
const Image = styled.img`
|
||||
width: 130px;
|
||||
align-self: center;
|
||||
`;
|
||||
|
||||
const ImageWrapper = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
|
||||
${media.tablet`
|
||||
padding-right: 15px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CommunityListWrapper = styled.ul`
|
||||
list-style: none;
|
||||
margin-bottom: 2rem;
|
||||
`;
|
||||
|
||||
const CommunityListItem = styled.li`
|
||||
color: #666666;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
margin-bottom: 0.35rem;
|
||||
|
||||
&:before {
|
||||
content: "-";
|
||||
color: #666666;
|
||||
margin-left: -25px;
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
}
|
||||
`;
|
||||
|
||||
const CommunitySectionTitle = styled.div`
|
||||
margin: 0 auto;
|
||||
font-size: 20px;
|
||||
padding: 0 30px;
|
||||
max-width: 500px;
|
||||
font-weight: 800;
|
||||
line-height: 1.3;
|
||||
text-align: left;
|
||||
|
||||
${media.tablet`
|
||||
padding: 0;
|
||||
font-size: 24px;
|
||||
letter-spacing: -0.5px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const Link = styled.a`
|
||||
color: #222222;
|
||||
cursor: pointer;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: #0070f3;
|
||||
}
|
||||
`;
|
||||
|
||||
const LinkDescription = styled.span`
|
||||
padding-left: 5px;
|
||||
word-break: break-word;
|
||||
`;
|
||||
|
||||
const CommunityDescriptionSmall = styled(CommunityDescription)`
|
||||
text-align: left;
|
||||
|
||||
${media.tablet`
|
||||
font-size: 18px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CTAWrapper = styled.div`
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 40px auto 20px auto;
|
||||
|
||||
${media.tablet`
|
||||
margin: 40px auto 20px -40px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const CTASecondary = styled.a`
|
||||
color: #696969;
|
||||
cursor: pointer;
|
||||
height: 2.81rem;
|
||||
background: #fff;
|
||||
width: 300px;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
margin: 10px 0 0 0;
|
||||
text-decoration: none;
|
||||
line-height: 2.8rem;
|
||||
border-radius: 7px;
|
||||
box-shadow: 0 4px 14px 0 rgb(0 0 0 / 10%);
|
||||
|
||||
&:hover {
|
||||
background: rgba(255,255,255,0.9);
|
||||
box-shadow: 0 6px 20px rgb(93 93 93 / 23%);
|
||||
}
|
||||
|
||||
${media.tablet`
|
||||
margin: 0 0 0 15px;
|
||||
`}
|
||||
`;
|
||||
|
||||
const BRIDGE_SERVERS = [
|
||||
{
|
||||
urlLink: 'https://payaddress.co',
|
||||
urlText: 'PayAddress.co',
|
||||
description: 'a something something',
|
||||
},
|
||||
{
|
||||
urlLink: 'https://bitmia.com',
|
||||
urlText: 'Bitmia.com',
|
||||
description: 'a something something',
|
||||
},
|
||||
{
|
||||
urlLink: 'https://tinytip.me',
|
||||
urlText: 'TinyTip.me',
|
||||
description: 'a something something',
|
||||
},
|
||||
{
|
||||
urlLink: 'https://paymentlink.xyz',
|
||||
urlText: 'PaymentLink.xyz',
|
||||
description: 'a something something',
|
||||
},
|
||||
{
|
||||
urlLink: 'https://ln.fitti.io/',
|
||||
urlText: 'LN.Fitti.io',
|
||||
description: 'a something something',
|
||||
},
|
||||
{
|
||||
urlLink: 'https://bridgeaddr.fiatjaf.com/',
|
||||
urlText: 'BridgeAddr',
|
||||
description: 'a server that allows you to receive payments at yourname@yourdomain.com noncustodially.',
|
||||
},
|
||||
];
|
||||
|
||||
const WALLETS = [
|
||||
{
|
||||
name: 'ZEBEDEE',
|
||||
image: '/images/zebedee.svg',
|
||||
downloadText: 'Download Wallet',
|
||||
url: 'https://zebedee.io/wallet',
|
||||
},
|
||||
{
|
||||
name: 'SBW',
|
||||
image: '/images/sbw.png',
|
||||
downloadText: 'Download Wallet',
|
||||
url: 'https://lightning-wallet.com',
|
||||
},
|
||||
{
|
||||
name: 'Blixt',
|
||||
image: '/images/blixt.png',
|
||||
downloadText: 'Download Wallet',
|
||||
url: 'https://blixtwallet.github.io/',
|
||||
},
|
||||
{
|
||||
name: 'LNBits',
|
||||
image: '/images/lnbits.png',
|
||||
downloadText: 'Open LNBits',
|
||||
url: 'https://lnbits.com/',
|
||||
},
|
||||
]
|
||||
|
||||
export const Community = () => (
|
||||
<CommunityModule>
|
||||
<CommunityIntro>Community Bridge Servers and Wallets</CommunityIntro>
|
||||
<CommunityTitle>Integrates as fast as Lightning</CommunityTitle>
|
||||
<CommunityDescription>
|
||||
We’ve made it exceedingly straightforward to start supporting Lightning Addresses on your own domain or integrate them with the apps you’re building. Set up support for this new standard today and join the era of total Lightning interoperability!
|
||||
</CommunityDescription>
|
||||
<CommunityInner>
|
||||
<CommunityLeft>
|
||||
<CommunitySectionTitle>Get a Lightning Address now!</CommunitySectionTitle>
|
||||
<CommunityDescriptionSmall>
|
||||
Get your own Lightning Address now by using one of the apps and services that already support it. You’ll be set up in seconds!
|
||||
</CommunityDescriptionSmall>
|
||||
{WALLETS.map(wallet => (
|
||||
<CommunityCard key={wallet.name}>
|
||||
<ImageWrapper>
|
||||
<Image src={wallet.image} alt={wallet.name} style={wallet.imageStyle || {}} />
|
||||
</ImageWrapper>
|
||||
<CommunitySignUpButton target="_blank" href={wallet.url}>{wallet.downloadText}</CommunitySignUpButton>
|
||||
</CommunityCard>
|
||||
))}
|
||||
<CTAWrapper>
|
||||
<CTASecondary href="https://github.com/andrerfneves/lightning-address/blob/master/README.md#wallets" target="_blank">
|
||||
View list of all supported Wallets
|
||||
</CTASecondary>
|
||||
</CTAWrapper>
|
||||
</CommunityLeft>
|
||||
<CommunityRight>
|
||||
<CommunityRightInner>
|
||||
<CommunitySectionTitle>Get a Lightning Address now!</CommunitySectionTitle>
|
||||
<CommunityDescriptionSmall>
|
||||
Get your own Lightning Address now by using one of the apps and services that already support it. You’ll be set up in seconds!
|
||||
</CommunityDescriptionSmall>
|
||||
<CommunityListWrapper>
|
||||
{BRIDGE_SERVERS.map(item => (
|
||||
<CommunityListItem key={item.urlText}>
|
||||
<Link href={item.urlLink} target="_blank">
|
||||
{item.urlText}
|
||||
</Link>
|
||||
<LinkDescription>
|
||||
- {item.description}
|
||||
</LinkDescription>
|
||||
</CommunityListItem>
|
||||
))}
|
||||
</CommunityListWrapper>
|
||||
</CommunityRightInner>
|
||||
</CommunityRight>
|
||||
</CommunityInner>
|
||||
</CommunityModule>
|
||||
)
|
||||
@@ -69,8 +69,8 @@ const Description = styled.p`
|
||||
padding: 0;
|
||||
font-size: 20px;
|
||||
padding: 0 30px;
|
||||
max-width: 800px;
|
||||
line-height: 1.6;
|
||||
max-width: 500px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: -1px;
|
||||
`}
|
||||
`;
|
||||
@@ -202,7 +202,11 @@ const LicenseLink = styled.a`
|
||||
`;
|
||||
|
||||
const Bold = styled.span`
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
padding-bottom: 5px;
|
||||
letter-spacing: -0.5px;
|
||||
`;
|
||||
|
||||
@@ -238,23 +242,22 @@ export class Hero extends PureComponent {
|
||||
</Fade>
|
||||
<Fade bottom when={showLightningAddr}>
|
||||
<Description>
|
||||
<Bold>Like an email address, but for your money!</Bold> An <Link href={URL_INTERNET_IDENTIFIER}>Internet Identifier</Link> that lets anyone send you Bitcoin instantly over the Lightning Network. No scanning QR codes or pasting invoices.
|
||||
<Bold>Like an email address, but for your Bitcoin!</Bold> A massively simpler way for anyone to send you Bitcoin instantly on the Lightning Network.
|
||||
</Description>
|
||||
<LoopWrapper>
|
||||
<FixedTextPart>you@</FixedTextPart>
|
||||
<TextLoop interval={2000} delay={1600}>
|
||||
<LoopedTextPart>your.domain</LoopedTextPart>
|
||||
<LoopedTextPart>zbd.gg</LoopedTextPart>
|
||||
<LoopedTextPart>lntxbot.com</LoopedTextPart>
|
||||
<LoopedTextPart>your.domain</LoopedTextPart>
|
||||
<LoopedTextPart>zebedee.io</LoopedTextPart>
|
||||
<LoopedTextPart>lnbits.com</LoopedTextPart>
|
||||
<LoopedTextPart>coinos.io</LoopedTextPart>
|
||||
</TextLoop>
|
||||
</LoopWrapper>
|
||||
</Fade>
|
||||
<Fade bottom when={showCTAs}>
|
||||
<CTAWrapper>
|
||||
<CTAPrimary href="#providers">Get My Lightning Address</CTAPrimary>
|
||||
<CTAPrimary href="#providers">Get a Lightning Address</CTAPrimary>
|
||||
<CTASecondary href="https://github.com/andrerfneves/lightning-address/blob/master/README.md" target="_blank">Read Documentation</CTASecondary>
|
||||
</CTAWrapper>
|
||||
<LicenseWrapper>
|
||||
|
||||
@@ -148,7 +148,7 @@ const PathsIntro = styled.p`
|
||||
const IMPLEMENTATIONS = [
|
||||
{
|
||||
title: 'Apps & Services',
|
||||
description: 'Create an account with one of the apps that support Lightning Address and get started immediately. Just like how Gmail is your email server, the app handles all of the payment infrastructure and is the easiest way to get a Lightning Address.',
|
||||
description: 'Create an account with one of the apps or services that support Lightning Address and let them handle all the infrastructure. Like using an email server such as Gmail, but for your Bitcoin payments. Get started immediately!',
|
||||
image: '/images/data4.svg',
|
||||
linkText: 'Get Started',
|
||||
link: '#providers',
|
||||
@@ -156,7 +156,7 @@ const IMPLEMENTATIONS = [
|
||||
},
|
||||
{
|
||||
title: 'Bridge Servers',
|
||||
description: 'If you already run a Bitcoin Lightning Network node and want a quick plug-n-play solution to getting your Lightning Address, this option is for you. Simply point some domain DNS settings to the Bridge Server, and you will be setup in minutes.',
|
||||
description: 'If you already run a Bitcoin Lightning Network node and want a plug-n-play solution, this option is for you. Simply point some configuration settings to one of the growing list of community-supported Bridge Servers and get set up in minutes.',
|
||||
image: '/images/data3.svg',
|
||||
linkText: 'Quick Setup',
|
||||
link: 'https://github.com/andrerfneves/lightning-address/blob/master/BRIDGE.md',
|
||||
@@ -164,9 +164,9 @@ const IMPLEMENTATIONS = [
|
||||
},
|
||||
{
|
||||
title: 'Self-Hosted',
|
||||
description: 'Lightning Address is just a set of simple protocol instructions, you can roll everything on your own. Whether you are a service provider looking to support Lightning Addresses or a user that wants to host your own setup, this option is for you.',
|
||||
description: 'Lightning Address is just a set of simple protocol instructions. Whether you are a Bitcoin service provider or simply an enthusiast interested in running your own setup, this is where you get started supporting this new standard.',
|
||||
image: '/images/data2.svg',
|
||||
linkText: 'Read More',
|
||||
linkText: 'Learn More',
|
||||
link: 'https://github.com/andrerfneves/lightning-address/blob/master/DIY.md',
|
||||
isSecondary: true
|
||||
},
|
||||
@@ -175,8 +175,10 @@ const IMPLEMENTATIONS = [
|
||||
export const Paths = () => (
|
||||
<PathsModule>
|
||||
<PathsIntro>Developers & Shadowy Coders</PathsIntro>
|
||||
<PathsTitle>How do Lightning Addresses work?</PathsTitle>
|
||||
<PathsDescription>You can choose to sign up for a service just like an email server (Gmail or Outlook), which will take care of all the payments behind-the-scenes for you. You can roll your own server that handles the connection between your Lightning Address and your Lightning node. Or you can rely on a `Bridge` server that provides an easy plug-n-play solution.</PathsDescription>
|
||||
<PathsTitle>Integrates as fast as Lightning</PathsTitle>
|
||||
<PathsDescription>
|
||||
We’ve made it exceedingly straightforward to start supporting Lightning Addresses on your own domain or integrate them with the apps you’re building. Set up support for this new standard today and join the era of total Lightning interoperability!
|
||||
</PathsDescription>
|
||||
<PathsCardGrid>
|
||||
{(IMPLEMENTATIONS || []).map((benefit) => (
|
||||
<PathsCard key={benefit.title}>
|
||||
|
||||
@@ -172,7 +172,8 @@ const ProviderSignUpButton = styled.a`
|
||||
width: 140px;
|
||||
height: 2.81rem;
|
||||
cursor: pointer;
|
||||
padding: 0 3.5rem;
|
||||
min-width: 220px;
|
||||
padding: 0 0.5rem;
|
||||
text-align: center;
|
||||
border-radius: 7px;
|
||||
margin: 15px 0 0 0;
|
||||
@@ -188,7 +189,7 @@ const ProviderSignUpButton = styled.a`
|
||||
}
|
||||
|
||||
${media.tablet`
|
||||
width: 120px;
|
||||
min-width: 220px;
|
||||
margin: 0 15px 0 0;
|
||||
`}
|
||||
`;
|
||||
@@ -198,6 +199,11 @@ const ZEBEDEEImage = styled.img`
|
||||
align-self: center;
|
||||
`;
|
||||
|
||||
const BTCPayImage = styled.img`
|
||||
width: 100px;
|
||||
align-self: center;
|
||||
`;
|
||||
|
||||
const Bold = styled.span`
|
||||
font-weight: 600;
|
||||
letter-spacing: -0.5px;
|
||||
@@ -228,14 +234,14 @@ export const Providers = () => (
|
||||
<ProvidersLeft>
|
||||
<ProvidersTitle>Get a Lightning Address now!</ProvidersTitle>
|
||||
<ProvidersDescription>
|
||||
Start receiving payments to <Bold>you@address.com</Bold> now. Choose from one of the apps and services that already support Lightning Address below and you'll be set up in seconds.
|
||||
Get your own Lightning Address now by using one of the apps and services that already support it. You’ll be set up in seconds!
|
||||
</ProvidersDescription>
|
||||
<ProviderCard>
|
||||
<ImageWrapper>
|
||||
<ZEBEDEEImage src={'/images/zebedee.svg'} alt="ZEBEDEE" style={{ marginTop: '10px', marginBottom: '3px' }} />
|
||||
<DomainURL>you@zbd.gg</DomainURL>
|
||||
</ImageWrapper>
|
||||
<ProviderSignUpButton target="_blank" href="https://zebedee.io/wallet">Download App</ProviderSignUpButton>
|
||||
<ProviderSignUpButton target="_blank" href="https://zebedee.io/wallet">Download Wallet</ProviderSignUpButton>
|
||||
</ProviderCard>
|
||||
<ProviderCard>
|
||||
<ImageWrapper>
|
||||
@@ -246,10 +252,10 @@ export const Providers = () => (
|
||||
</ProviderCard>
|
||||
<ProviderCard>
|
||||
<ImageWrapper>
|
||||
<ZEBEDEEImage src={'/images/lnbits.png'} alt="LNBits" style={{ marginTop: '-5px', marginBottom: '-15px' }} />
|
||||
<DomainURL>you@lnbits.com</DomainURL>
|
||||
<BTCPayImage src={'/images/btcpay.svg'} alt="BTCPay Server" />
|
||||
<DomainURL>you@yourbtcpay.server</DomainURL>
|
||||
</ImageWrapper>
|
||||
<ProviderSignUpButton target="_blank" href="https://lnbits.com">Create Account</ProviderSignUpButton>
|
||||
<ProviderSignUpButton isDisabled>Coming Soon</ProviderSignUpButton>
|
||||
</ProviderCard>
|
||||
<ProviderCard>
|
||||
<ImageWrapper>
|
||||
@@ -263,12 +269,12 @@ export const Providers = () => (
|
||||
<ProvidersRightInner>
|
||||
<ProvidersTitle>Your app doesn't support Lightning Addresses yet?</ProvidersTitle>
|
||||
<ProvidersDescriptionSmall>
|
||||
If your favorite Bitcoin app doesn't yet support Lightning Address, get in touch with the developer company and ask them to learn about how the protocol can help their users.
|
||||
If your favorite Bitcoin app doesn't support Lightning Addresses yet, get in touch with the developer company and ask them to learn about how the protocol can help their users.
|
||||
<br />
|
||||
<br />
|
||||
To make things easier, we created an email template you can send with just a click.
|
||||
</ProvidersDescriptionSmall>
|
||||
<ProvidersEmailButton onClick={() => window.open(`mailto:ENTER_DEVELOPER_EMAIL_HERE?subject=Introducing Lightning Address&body=Hi there,\n\n I just learnt about the Lightning Address protocol and how awesome it is for sending and receiving payments over the Bitcoin Lightning Network. I was hoping you would take a look at the lightningaddress.com website and possibly implement support for it? \n\n Lightning Addresses provide a familiar user experience with sending Lightning payments to other people online, similar to sending an email address. No more QR codes or invoices / addresses. "Just pay me at satoshi@website.com"\n\n Cheers!`)}>
|
||||
<ProvidersEmailButton onClick={() => window.open(`mailto:DEVELOPER_EMAIL_HERE?subject=Have you considered support for Lightning Address?&body=Hi there, I just learned about the Lightning Address protocol and how awesome it is for sending and receiving payments over the Bitcoin Lightning Network. I was hoping you would take a look at the lightningaddress.com website and possibly implement support for it? \n\n Lightning Addresses provide a familiar user experience with sending Lightning payments to other people online, similar to sending an email. No more QR codes or invoices / addresses. "Just pay me at satoshi@website.com"\n\n Cheers!`)}>
|
||||
<ProvidersEmailButtonImage src={'/images/email.svg'} alt='Email' />
|
||||
<ProvidersEmailButtonText>Send Email</ProvidersEmailButtonText>
|
||||
</ProvidersEmailButton>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import styled from 'styled-components';
|
||||
import Head from 'next/head';
|
||||
|
||||
import { Community } from '../components/community';
|
||||
import { Providers } from '../components/providers';
|
||||
import { Benefits } from '../components/benefits';
|
||||
import { Footer } from '../components/footer';
|
||||
@@ -43,7 +44,7 @@ export default function Home() {
|
||||
<meta name="twitter:site" content="@andreneves" />
|
||||
<meta name="twitter:creator" content="@andreneves" />
|
||||
<meta name="twitter:title" content="The Lightning Address" />
|
||||
<meta name="twitter:description" content="Like an email address, but for your money. An Internet Identifier that allows anyone to send you Bitcoin instantly over the Lightning Network. No scanning QR codes or pasting invoices." />
|
||||
<meta name="twitter:description" content="Like an email address, but for your Bitcoin. A massively simpler way for anyone to send you Bitcoin instantly on the Lightning Network. No scanning QR codes or pasting invoices." />
|
||||
<meta name="twitter:image" content="https://i.imgur.com/Plc0Dam.png" />
|
||||
|
||||
<script defer data-domain="lightningaddress.com" src="https://plausible.io/js/plausible.js" />
|
||||
@@ -53,6 +54,7 @@ export default function Home() {
|
||||
<Benefits />
|
||||
<Paths />
|
||||
<Providers />
|
||||
<Community />
|
||||
<Footer />
|
||||
</Wrapper>
|
||||
</>
|
||||
|
||||
BIN
public/images/blixt.png
Normal file
BIN
public/images/blixt.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
32
public/images/btcpay.svg
Normal file
32
public/images/btcpay.svg
Normal file
@@ -0,0 +1,32 @@
|
||||
<svg class="_Logo" onclick="window.location='/'" version="1.1" id="_Logo_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="200px" height="100px" viewBox="0 0 200 100" enable-background="new 0 0 200 100" xml:space="preserve">
|
||||
<g>
|
||||
<path fill="#CEDC21" d="M9.206,91.433c-2.684,0-4.859-2.177-4.859-4.861V13.431c0-2.685,2.176-4.861,4.859-4.861
|
||||
s4.86,2.177,4.86,4.861v73.141C14.066,89.256,11.89,91.433,9.206,91.433"></path>
|
||||
<path fill="#51B13E" d="M9.209,91.433c-1.818,0-3.561-1.025-4.394-2.777c-1.151-2.424-0.118-5.322,2.308-6.476L36.43,68.274
|
||||
L6.323,46.093c-2.16-1.593-2.621-4.635-1.029-6.796s4.636-2.622,6.795-1.03l36.647,26.999c1.377,1.016,2.12,2.678,1.956,4.381
|
||||
c-0.164,1.7-1.209,3.19-2.755,3.925L11.289,90.964C10.618,91.281,9.907,91.433,9.209,91.433"></path>
|
||||
<path fill="#CEDC21" d="M9.211,62.684c-1.493,0-2.965-0.685-3.917-1.979c-1.592-2.159-1.131-5.204,1.03-6.795L36.43,31.73
|
||||
L7.123,17.821c-2.426-1.151-3.459-4.05-2.309-6.475c1.152-2.426,4.051-3.459,6.475-2.309l36.648,17.394
|
||||
c1.546,0.733,2.591,2.225,2.755,3.926c0.164,1.702-0.579,3.364-1.956,4.379l-36.647,27C11.22,62.375,10.211,62.684,9.211,62.684"></path>
|
||||
<polygon fill="#1E7A44" points="14.066,39.725 14.066,60.278 28.01,50.006 "></polygon>
|
||||
<rect x="4.347" y="31.106" fill="#FFFFFF" width="9.72" height="23.692"></rect>
|
||||
<path fill="#CEDC21" d="M14.066,13.431c0-2.685-2.177-4.861-4.86-4.861s-4.859,2.177-4.859,4.861v61.165h9.72V13.431z"></path>
|
||||
<g class="icon-text">
|
||||
<path d="M78.355,49.412c3.114,0.884,4.84,3.704,4.84,7.238c0,5.513-3.368,8.082-7.955,8.082H64.761V35.271h9.259
|
||||
c4.504,0,7.997,2.146,7.997,7.743C82.017,45.835,80.838,48.444,78.355,49.412 M74.062,48.696c3.324,0,6.018-1.179,6.018-5.724
|
||||
c0-4.586-2.776-5.808-6.145-5.808h-7.197v11.531H74.062z M75.114,62.795c3.366,0,6.06-1.768,6.06-6.145
|
||||
c0-4.713-3.072-6.144-6.901-6.144h-7.534v12.288H75.114z"></path>
|
||||
<polygon points="102.893,35.271 102.893,37.081 94.771,37.081 94.771,64.732 92.792,64.732 92.792,37.081
|
||||
84.669,37.081 84.669,35.271 "></polygon>
|
||||
<path d="M116.738,34.85c5.01,0,9.554,2.524,10.987,8.543h-1.895c-1.348-4.923-5.303-6.732-9.134-6.732
|
||||
c-6.944,0-10.605,5.681-10.605,13.341c0,8.08,3.661,13.256,10.646,13.256c4.125,0,7.828-1.85,9.26-7.279h1.895
|
||||
c-1.264,6.271-6.229,9.174-11.154,9.174c-7.87,0-12.583-5.808-12.583-15.15C104.155,41.037,109.124,34.85,116.738,34.85"></path>
|
||||
<path d="M142.709,35.271c5.091,0,8.795,3.326,8.795,9.764c0,6.06-3.704,9.722-8.795,9.722h-7.746v9.976h-1.935
|
||||
V35.271H142.709z M142.709,52.82c3.745,0,6.816-2.397,6.816-7.827c0-5.429-2.947-7.869-6.816-7.869h-7.746V52.82H142.709z"></path>
|
||||
<path d="M151.841,64.732v-0.255l11.741-29.29h0.885l11.615,29.29v0.255h-2.062l-3.322-8.501H157.27l-3.324,8.501
|
||||
H151.841z M164.005,38.68l-6.059,15.697h12.078L164.005,38.68z"></path>
|
||||
<polygon points="193.551,35.271 195.655,35.271 195.655,35.564 186.479,52.484 186.479,64.732 184.459,64.732
|
||||
184.459,52.484 175.243,35.523 175.243,35.271 177.39,35.271 181.387,42.763 185.43,50.549 185.47,50.549 189.551,42.763 "></polygon>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
BIN
public/images/sbw.png
Normal file
BIN
public/images/sbw.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Reference in New Issue
Block a user