Skip to content

Commit f7d5abd

Browse files
DanGouldDanGould
authored
Merge pull request #121 from payjoin/add-bull-bitcoin
Edit carousels
2 parents 4b2507b + 3917e2f commit f7d5abd

11 files changed

Lines changed: 92 additions & 83 deletions

File tree

‎src/components/HeaderContent/index.tsx‎

Lines changed: 28 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import Marquee from "react-fast-marquee";
2+
import styles from "./styles.module.css";
23

34
// Button component remains unchanged
45
export function Button({ children, variant }) {
@@ -15,14 +16,19 @@ export function Button({ children, variant }) {
1516
);
1617
}
1718

18-
const Testimonial = ({ text, name, image }) => (
19-
<div className="flex flex-col items-start justify-between gap-4 mx-4 w-96 bg-tertiary rounded-lg p-6 shadow-lg">
20-
<blockquote className="border-l-secondary text-left italic text-sm">{text}</blockquote>
21-
<div className="flex items-center">
22-
<img src={image} alt={name} className="w-8 h-8 rounded-full mr-4" />
23-
<span className="font-bold">{name}</span>
24-
</div>
25-
</div>
19+
/*
20+
* ADDING A NEW WALLET LOGO:
21+
* 1. Add logo image to /static/img/ (PNG or SVG)
22+
* 2. Crop image tightly - no excess padding
23+
* 3. For square/tall logos (aspect ratio < 2:1), add text prop for visual balance
24+
* Example: text="Wallet Name"
25+
* 4. Wide horizontal logos (aspect ratio > 2:1) don't need text
26+
*/
27+
const WalletLogo = ({ href, src, alt, text }) => (
28+
<a href={href} className="flex items-center gap-3 mx-10 no-underline hover:no-underline">
29+
<img className={styles.logoImg} src={src} alt={alt} />
30+
{text && <span className={styles.logoText}>{text}</span>}
31+
</a>
2632
);
2733

2834
export default function HeaderContent() {
@@ -49,42 +55,20 @@ export default function HeaderContent() {
4955
</a>
5056
</div>
5157
</div>
52-
<div className="w-full overflow-hidden">
53-
<Marquee
54-
gradient={true}
55-
gradientColor="#46192b"
56-
>
57-
<div className="flex items-start">
58-
<Testimonial
59-
text="Payjoin usage improves the privacy of all bitcoiners by breaking the common input ownership heuristic - you can no longer assume all inputs belong to the sender."
60-
name="ODELL"
61-
image="https://avatars.githubusercontent.com/u/50266466?v=4"
62-
/>
63-
<Testimonial
64-
text="Payjoin doesn't even have to be widely used to make the common input ownership heuristic unusable. Since payjoins are indistinguishable on-chain, it should suffice to have payjoin optionally available in most wallets."
65-
name="El Flaco"
66-
image="https://pbs.twimg.com/profile_images/1819046599768612871/S2BADZaw_400x400.jpg"
67-
/>
68-
<Testimonial
69-
text="More payjoin adoption would be a good thing. payjoin = https"
70-
name="Gigi"
71-
image="https://dergigi.com/assets/images/avatar.jpg"
72-
/>
73-
<Testimonial
74-
text="Wallet side p2p PayJoin is the future IMO... Bitcoin needs more PayJoin and p2p capable PayJoin wallet interop."
75-
name="Adam Back"
76-
image="https://pbs.twimg.com/profile_images/1364645619705511936/IGTT_tnL_400x400.jpg"
77-
/>
78-
<Testimonial
79-
text="Using Payjoin when spending is so underrated.
80-
81-
The ability to break common-input-ownership heuristic *and* completely obfuscate amount sent is extremely powerful."
82-
name="Seth For Privacy"
83-
image="https://pbs.twimg.com/profile_images/1507020330954489862/MNnJ320U_400x400.jpg"
84-
/>
85-
</div>
86-
</Marquee>
87-
</div>
58+
<Marquee
59+
className="bg-tertiary w-32 h-[24vh]"
60+
gradient={true}
61+
gradientColor="#46192b"
62+
>
63+
<WalletLogo href="https://bitmask.app" src="/img/bitmask.svg" alt="bitmasklogo" />
64+
<WalletLogo href="https://bluewallet.io" src="/img/bluewallet.svg" alt="bluewallet logo" />
65+
<WalletLogo href="https://btcpayserver.org" src="/img/btcpay.svg" alt="btcpayserver logo" />
66+
<WalletLogo href="https://cakewallet.com" src="/img/cakewallet.svg" alt="Cake Wallet logo" />
67+
<WalletLogo href="https://wallet.bullbitcoin.com" src="/img/bullbitcoin.png" alt="BULL wallet logo" />
68+
<WalletLogo href="https://github.com/JoinMarket-Org/joinmarket-clientserver" src="/img/joinmarket.png" alt="joinmarket logo" />
69+
<WalletLogo href="https://sparrowwallet.com" src="/img/sparrow.png" alt="sparrow logo" text="Sparrow Wallet" />
70+
<WalletLogo href="https://wasabiwallet.io" src="/img/wasabi.svg" alt="wasabi logo" />
71+
</Marquee>
8872
</div>
8973
);
9074
}

src/components/UsedBy/styles.module.css renamed to src/components/HeaderContent/styles.module.css

File renamed without changes.

‎src/components/Testimonials/index.tsx‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import Marquee from "react-fast-marquee";
2+
3+
/*
4+
* Avatar source URLs (for future updates):
5+
* - odell: https://avatars.githubusercontent.com/u/50266466
6+
* - elflaco: https://x.com/AureoliAugust
7+
* - gigi: https://dergigi.com/assets/images/avatar.jpg
8+
* - adamback: https://x.com/adam3us
9+
* - sethforprivacy: https://x.com/saborprivacy
10+
*/
11+
12+
const Testimonial = ({ text, name, image }) => (
13+
<div className="flex flex-col items-start justify-between gap-4 mx-4 w-96 bg-tertiary rounded-lg p-6 shadow-lg">
14+
<blockquote className="border-l-secondary text-left italic text-sm">{text}</blockquote>
15+
<div className="flex items-center">
16+
<img src={image} alt={name} className="w-8 h-8 rounded-full mr-4" />
17+
<span className="font-bold">{name}</span>
18+
</div>
19+
</div>
20+
);
21+
22+
export default function Testimonials() {
23+
return (
24+
<section className="flex flex-col items-center justify-center gap-12 py-20 w-full">
25+
<h2 className="text-4xl">What people are saying</h2>
26+
<Marquee
27+
gradient={true}
28+
gradientColor="#46192b"
29+
>
30+
<div className="flex items-stretch">
31+
<Testimonial
32+
text="Payjoin usage improves the privacy of all bitcoiners by breaking the common input ownership heuristic - you can no longer assume all inputs belong to the sender."
33+
name="ODELL"
34+
image="/img/avatars/odell.jpg"
35+
/>
36+
<Testimonial
37+
text="Payjoin doesn't even have to be widely used to make the common input ownership heuristic unusable. Since payjoins are indistinguishable on-chain, it should suffice to have payjoin optionally available in most wallets."
38+
name="El Flaco"
39+
image="/img/avatars/elflaco.jpg"
40+
/>
41+
<Testimonial
42+
text="More payjoin adoption would be a good thing. payjoin = https"
43+
name="Gigi"
44+
image="/img/avatars/gigi.jpg"
45+
/>
46+
<Testimonial
47+
text="Wallet side p2p PayJoin is the future IMO... Bitcoin needs more PayJoin and p2p capable PayJoin wallet interop."
48+
name="Adam Back"
49+
image="/img/avatars/adamback.jpg"
50+
/>
51+
<Testimonial
52+
text="Using Payjoin when spending is so underrated.
53+
54+
The ability to break common-input-ownership heuristic *and* completely obfuscate amount sent is extremely powerful."
55+
name="Seth For Privacy"
56+
image="/img/avatars/sethforprivacy.jpg"
57+
/>
58+
</div>
59+
</Marquee>
60+
</section>
61+
);
62+
}

‎src/components/UsedBy/index.tsx‎

Lines changed: 0 additions & 37 deletions
This file was deleted.

‎src/pages/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import Layout from "@theme/Layout";
33
import WhyPayjoin from "../components/HomepageFeatures";
44
import HeaderContent from "../components/HeaderContent";
55
import FigmaDemo from "../components/FigmaDemo";
6-
import WalletsUsingPayjoin from "../components/UsedBy";
6+
import Testimonials from "../components/Testimonials";
77
import { LearnMore } from "../components/LearnMore";
88

99
export default function Home(): JSX.Element {
@@ -17,7 +17,7 @@ export default function Home(): JSX.Element {
1717
<div className="flex flex-col items-center max-sm:gap-20">
1818
<HeaderContent />
1919
<WhyPayjoin />
20-
<WalletsUsingPayjoin />
20+
<Testimonials />
2121
<FigmaDemo />
2222
<LearnMore />
2323
</div>

‎static/img/avatars/adamback.jpg‎

28.1 KB
Loading

‎static/img/avatars/elflaco.jpg‎

31.1 KB
Loading

‎static/img/avatars/gigi.jpg‎

11.7 KB
Loading

‎static/img/avatars/odell.jpg‎

231 KB
Loading

‎static/img/avatars/sethforprivacy.jpg‎

15.4 KB
Loading

0 commit comments

Comments
 (0)