diff --git a/apps/website/package.json b/apps/website/package.json index 43208fe6..6f9d72ce 100644 --- a/apps/website/package.json +++ b/apps/website/package.json @@ -16,6 +16,7 @@ "@radix-ui/react-dialog": "^1.0.3", "@radix-ui/react-navigation-menu": "^1.1.2", "@react-spring/web": "^9.7.2", + "react-scroll-parallax": "^3.4.2", "@scure/base": "^1.1.1", "@status-im/colors": "*", "@status-im/components": "*", diff --git a/apps/website/public/assets/communities/community-card-01.png b/apps/website/public/assets/communities/community-card-01.png new file mode 100644 index 00000000..e1366e22 Binary files /dev/null and b/apps/website/public/assets/communities/community-card-01.png differ diff --git a/apps/website/public/assets/communities/community-card-02.png b/apps/website/public/assets/communities/community-card-02.png new file mode 100644 index 00000000..182ab449 Binary files /dev/null and b/apps/website/public/assets/communities/community-card-02.png differ diff --git a/apps/website/public/assets/communities/community-card-03.png b/apps/website/public/assets/communities/community-card-03.png new file mode 100644 index 00000000..dacec056 Binary files /dev/null and b/apps/website/public/assets/communities/community-card-03.png differ diff --git a/apps/website/public/assets/communities/community-card-04.png b/apps/website/public/assets/communities/community-card-04.png new file mode 100644 index 00000000..2fbef741 Binary files /dev/null and b/apps/website/public/assets/communities/community-card-04.png differ diff --git a/apps/website/public/assets/communities/feature-01.png b/apps/website/public/assets/communities/feature-01.png new file mode 100644 index 00000000..14890884 Binary files /dev/null and b/apps/website/public/assets/communities/feature-01.png differ diff --git a/apps/website/public/assets/communities/feature-02.png b/apps/website/public/assets/communities/feature-02.png new file mode 100644 index 00000000..bcaf4963 Binary files /dev/null and b/apps/website/public/assets/communities/feature-02.png differ diff --git a/apps/website/public/assets/communities/feature-03.png b/apps/website/public/assets/communities/feature-03.png new file mode 100644 index 00000000..db587bda Binary files /dev/null and b/apps/website/public/assets/communities/feature-03.png differ diff --git a/apps/website/public/assets/communities/feature-04.png b/apps/website/public/assets/communities/feature-04.png new file mode 100644 index 00000000..61215752 Binary files /dev/null and b/apps/website/public/assets/communities/feature-04.png differ diff --git a/apps/website/public/assets/communities/feature-05.png b/apps/website/public/assets/communities/feature-05.png new file mode 100644 index 00000000..f1facb04 Binary files /dev/null and b/apps/website/public/assets/communities/feature-05.png differ diff --git a/apps/website/public/assets/communities/hero-01.png b/apps/website/public/assets/communities/hero-01.png new file mode 100644 index 00000000..83a7a76e Binary files /dev/null and b/apps/website/public/assets/communities/hero-01.png differ diff --git a/apps/website/public/assets/communities/hero-02.png b/apps/website/public/assets/communities/hero-02.png new file mode 100644 index 00000000..9ec0b9a1 Binary files /dev/null and b/apps/website/public/assets/communities/hero-02.png differ diff --git a/apps/website/public/assets/communities/hero-03.png b/apps/website/public/assets/communities/hero-03.png new file mode 100644 index 00000000..fa8bc464 Binary files /dev/null and b/apps/website/public/assets/communities/hero-03.png differ diff --git a/apps/website/public/assets/communities/hero-04.png b/apps/website/public/assets/communities/hero-04.png new file mode 100644 index 00000000..beb91578 Binary files /dev/null and b/apps/website/public/assets/communities/hero-04.png differ diff --git a/apps/website/public/assets/communities/illustration-main.png b/apps/website/public/assets/communities/illustration-main.png new file mode 100644 index 00000000..9d86e065 Binary files /dev/null and b/apps/website/public/assets/communities/illustration-main.png differ diff --git a/apps/website/public/assets/communities/section-01.png b/apps/website/public/assets/communities/section-01.png new file mode 100644 index 00000000..ec5f0f0d Binary files /dev/null and b/apps/website/public/assets/communities/section-01.png differ diff --git a/apps/website/public/assets/communities/section-02.png b/apps/website/public/assets/communities/section-02.png new file mode 100644 index 00000000..7400b756 Binary files /dev/null and b/apps/website/public/assets/communities/section-02.png differ diff --git a/apps/website/public/assets/create-community/brand-turquoise-01.png b/apps/website/public/assets/create-community/brand-turquoise-01.png new file mode 100644 index 00000000..fd15a832 Binary files /dev/null and b/apps/website/public/assets/create-community/brand-turquoise-01.png differ diff --git a/apps/website/public/assets/create-community/brand-turquoise-02.png b/apps/website/public/assets/create-community/brand-turquoise-02.png new file mode 100644 index 00000000..2633bae2 Binary files /dev/null and b/apps/website/public/assets/create-community/brand-turquoise-02.png differ diff --git a/apps/website/public/assets/create-community/brand-turquoise-03.png b/apps/website/public/assets/create-community/brand-turquoise-03.png new file mode 100644 index 00000000..d08e0bbf Binary files /dev/null and b/apps/website/public/assets/create-community/brand-turquoise-03.png differ diff --git a/apps/website/public/assets/create-community/brand-turquoise-04.png b/apps/website/public/assets/create-community/brand-turquoise-04.png new file mode 100644 index 00000000..1f861b2b Binary files /dev/null and b/apps/website/public/assets/create-community/brand-turquoise-04.png differ diff --git a/apps/website/public/assets/create-community/brand-turquoise-05.png b/apps/website/public/assets/create-community/brand-turquoise-05.png new file mode 100644 index 00000000..aaf2be85 Binary files /dev/null and b/apps/website/public/assets/create-community/brand-turquoise-05.png differ diff --git a/apps/website/public/assets/create-community/feature-01.png b/apps/website/public/assets/create-community/feature-01.png new file mode 100644 index 00000000..50ada97c Binary files /dev/null and b/apps/website/public/assets/create-community/feature-01.png differ diff --git a/apps/website/public/assets/create-community/feature-02.png b/apps/website/public/assets/create-community/feature-02.png new file mode 100644 index 00000000..1d541634 Binary files /dev/null and b/apps/website/public/assets/create-community/feature-02.png differ diff --git a/apps/website/public/assets/create-community/feature-03.png b/apps/website/public/assets/create-community/feature-03.png new file mode 100644 index 00000000..f4726af7 Binary files /dev/null and b/apps/website/public/assets/create-community/feature-03.png differ diff --git a/apps/website/public/assets/create-community/feature-04.png b/apps/website/public/assets/create-community/feature-04.png new file mode 100644 index 00000000..ae39d8b3 Binary files /dev/null and b/apps/website/public/assets/create-community/feature-04.png differ diff --git a/apps/website/public/assets/create-community/hero-01.png b/apps/website/public/assets/create-community/hero-01.png new file mode 100644 index 00000000..b0c49fc5 Binary files /dev/null and b/apps/website/public/assets/create-community/hero-01.png differ diff --git a/apps/website/public/assets/create-community/hero-02.png b/apps/website/public/assets/create-community/hero-02.png new file mode 100644 index 00000000..3f62ebd5 Binary files /dev/null and b/apps/website/public/assets/create-community/hero-02.png differ diff --git a/apps/website/public/assets/create-community/hero-03.png b/apps/website/public/assets/create-community/hero-03.png new file mode 100644 index 00000000..e122c699 Binary files /dev/null and b/apps/website/public/assets/create-community/hero-03.png differ diff --git a/apps/website/public/assets/create-community/hero-04.png b/apps/website/public/assets/create-community/hero-04.png new file mode 100644 index 00000000..874ab358 Binary files /dev/null and b/apps/website/public/assets/create-community/hero-04.png differ diff --git a/apps/website/public/assets/create-community/illustration-main.png b/apps/website/public/assets/create-community/illustration-main.png new file mode 100644 index 00000000..2655379a Binary files /dev/null and b/apps/website/public/assets/create-community/illustration-main.png differ diff --git a/apps/website/public/assets/create-community/screenshot-01.png b/apps/website/public/assets/create-community/screenshot-01.png new file mode 100644 index 00000000..bbb81f83 Binary files /dev/null and b/apps/website/public/assets/create-community/screenshot-01.png differ diff --git a/apps/website/public/assets/create-community/section-01.png b/apps/website/public/assets/create-community/section-01.png new file mode 100644 index 00000000..23b189d5 Binary files /dev/null and b/apps/website/public/assets/create-community/section-01.png differ diff --git a/apps/website/public/assets/create-community/section-02.png b/apps/website/public/assets/create-community/section-02.png new file mode 100644 index 00000000..fafa57f4 Binary files /dev/null and b/apps/website/public/assets/create-community/section-02.png differ diff --git a/apps/website/public/assets/homepage/communities-01.png b/apps/website/public/assets/homepage/communities-01.png new file mode 100644 index 00000000..1aea82c8 Binary files /dev/null and b/apps/website/public/assets/homepage/communities-01.png differ diff --git a/apps/website/public/assets/homepage/communities-03.png b/apps/website/public/assets/homepage/communities-03.png new file mode 100644 index 00000000..c5c957da Binary files /dev/null and b/apps/website/public/assets/homepage/communities-03.png differ diff --git a/apps/website/public/assets/homepage/communities-04.png b/apps/website/public/assets/homepage/communities-04.png new file mode 100644 index 00000000..3fc94a2d Binary files /dev/null and b/apps/website/public/assets/homepage/communities-04.png differ diff --git a/apps/website/public/assets/homepage/illustration-dark-01.png b/apps/website/public/assets/homepage/illustration-dark-01.png new file mode 100644 index 00000000..0c3d95fe Binary files /dev/null and b/apps/website/public/assets/homepage/illustration-dark-01.png differ diff --git a/apps/website/public/assets/homepage/illustration-dark-02.png b/apps/website/public/assets/homepage/illustration-dark-02.png new file mode 100644 index 00000000..86438e1d Binary files /dev/null and b/apps/website/public/assets/homepage/illustration-dark-02.png differ diff --git a/apps/website/public/assets/homepage/illustration-keycard.png b/apps/website/public/assets/homepage/illustration-keycard.png new file mode 100644 index 00000000..0153ae91 Binary files /dev/null and b/apps/website/public/assets/homepage/illustration-keycard.png differ diff --git a/apps/website/public/assets/homepage/messenger-02.png b/apps/website/public/assets/homepage/messenger-02.png new file mode 100644 index 00000000..23a3f064 Binary files /dev/null and b/apps/website/public/assets/homepage/messenger-02.png differ diff --git a/apps/website/public/assets/homepage/messenger-03.png b/apps/website/public/assets/homepage/messenger-03.png new file mode 100644 index 00000000..4027edfd Binary files /dev/null and b/apps/website/public/assets/homepage/messenger-03.png differ diff --git a/apps/website/public/assets/homepage/messenger-04.png b/apps/website/public/assets/homepage/messenger-04.png new file mode 100644 index 00000000..f1935b6c Binary files /dev/null and b/apps/website/public/assets/homepage/messenger-04.png differ diff --git a/apps/website/public/assets/homepage/section-01.png b/apps/website/public/assets/homepage/section-01.png new file mode 100644 index 00000000..57f02cea Binary files /dev/null and b/apps/website/public/assets/homepage/section-01.png differ diff --git a/apps/website/public/assets/homepage/wallet-01.png b/apps/website/public/assets/homepage/wallet-01.png new file mode 100644 index 00000000..180d84e9 Binary files /dev/null and b/apps/website/public/assets/homepage/wallet-01.png differ diff --git a/apps/website/public/assets/homepage/wallet-02.png b/apps/website/public/assets/homepage/wallet-02.png new file mode 100644 index 00000000..08e11ccd Binary files /dev/null and b/apps/website/public/assets/homepage/wallet-02.png differ diff --git a/apps/website/public/assets/homepage/wallet-03.png b/apps/website/public/assets/homepage/wallet-03.png new file mode 100644 index 00000000..b134d3cf Binary files /dev/null and b/apps/website/public/assets/homepage/wallet-03.png differ diff --git a/apps/website/public/assets/homepage/wallet-04.png b/apps/website/public/assets/homepage/wallet-04.png new file mode 100644 index 00000000..bbbec6ec Binary files /dev/null and b/apps/website/public/assets/homepage/wallet-04.png differ diff --git a/apps/website/public/assets/messenger/feature-01.png b/apps/website/public/assets/messenger/feature-01.png new file mode 100644 index 00000000..32e92a60 Binary files /dev/null and b/apps/website/public/assets/messenger/feature-01.png differ diff --git a/apps/website/public/assets/messenger/feature-02.png b/apps/website/public/assets/messenger/feature-02.png new file mode 100644 index 00000000..ce031aab Binary files /dev/null and b/apps/website/public/assets/messenger/feature-02.png differ diff --git a/apps/website/public/assets/messenger/feature-03.png b/apps/website/public/assets/messenger/feature-03.png new file mode 100644 index 00000000..c33f036e Binary files /dev/null and b/apps/website/public/assets/messenger/feature-03.png differ diff --git a/apps/website/public/assets/messenger/feature-04.png b/apps/website/public/assets/messenger/feature-04.png new file mode 100644 index 00000000..88976cc4 Binary files /dev/null and b/apps/website/public/assets/messenger/feature-04.png differ diff --git a/apps/website/public/assets/messenger/feature-05.png b/apps/website/public/assets/messenger/feature-05.png new file mode 100644 index 00000000..05e167be Binary files /dev/null and b/apps/website/public/assets/messenger/feature-05.png differ diff --git a/apps/website/public/assets/messenger/feature-06.png b/apps/website/public/assets/messenger/feature-06.png new file mode 100644 index 00000000..7ee2830a Binary files /dev/null and b/apps/website/public/assets/messenger/feature-06.png differ diff --git a/apps/website/public/assets/messenger/feature-07.png b/apps/website/public/assets/messenger/feature-07.png new file mode 100644 index 00000000..be8d64a0 Binary files /dev/null and b/apps/website/public/assets/messenger/feature-07.png differ diff --git a/apps/website/public/assets/messenger/feature-08.png b/apps/website/public/assets/messenger/feature-08.png new file mode 100644 index 00000000..4e4d743c Binary files /dev/null and b/apps/website/public/assets/messenger/feature-08.png differ diff --git a/apps/website/public/assets/messenger/feature-09.png b/apps/website/public/assets/messenger/feature-09.png new file mode 100644 index 00000000..bc2eefbf Binary files /dev/null and b/apps/website/public/assets/messenger/feature-09.png differ diff --git a/apps/website/public/assets/messenger/hero-01.png b/apps/website/public/assets/messenger/hero-01.png new file mode 100644 index 00000000..fcf0c5ad Binary files /dev/null and b/apps/website/public/assets/messenger/hero-01.png differ diff --git a/apps/website/public/assets/messenger/hero-02.png b/apps/website/public/assets/messenger/hero-02.png new file mode 100644 index 00000000..f4bb7d4d Binary files /dev/null and b/apps/website/public/assets/messenger/hero-02.png differ diff --git a/apps/website/public/assets/messenger/hero-03.png b/apps/website/public/assets/messenger/hero-03.png new file mode 100644 index 00000000..0ef17969 Binary files /dev/null and b/apps/website/public/assets/messenger/hero-03.png differ diff --git a/apps/website/public/assets/messenger/hero-04.png b/apps/website/public/assets/messenger/hero-04.png new file mode 100644 index 00000000..98c4a4b5 Binary files /dev/null and b/apps/website/public/assets/messenger/hero-04.png differ diff --git a/apps/website/public/assets/messenger/illustration-security-01.png b/apps/website/public/assets/messenger/illustration-security-01.png new file mode 100644 index 00000000..0608f126 Binary files /dev/null and b/apps/website/public/assets/messenger/illustration-security-01.png differ diff --git a/apps/website/public/assets/messenger/illustration-security-02.png b/apps/website/public/assets/messenger/illustration-security-02.png new file mode 100644 index 00000000..867e371b Binary files /dev/null and b/apps/website/public/assets/messenger/illustration-security-02.png differ diff --git a/apps/website/public/assets/messenger/section-01.png b/apps/website/public/assets/messenger/section-01.png new file mode 100644 index 00000000..be1175bd Binary files /dev/null and b/apps/website/public/assets/messenger/section-01.png differ diff --git a/apps/website/public/assets/messenger/section-02.png b/apps/website/public/assets/messenger/section-02.png new file mode 100644 index 00000000..ea4d69b5 Binary files /dev/null and b/apps/website/public/assets/messenger/section-02.png differ diff --git a/apps/website/public/assets/wallet/1.png b/apps/website/public/assets/wallet/1.png deleted file mode 100644 index 153e84b6..00000000 Binary files a/apps/website/public/assets/wallet/1.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/2.png b/apps/website/public/assets/wallet/2.png deleted file mode 100644 index 5f9ecf0c..00000000 Binary files a/apps/website/public/assets/wallet/2.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/3.png b/apps/website/public/assets/wallet/3.png deleted file mode 100644 index 5177ebb5..00000000 Binary files a/apps/website/public/assets/wallet/3.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/4.png b/apps/website/public/assets/wallet/4.png deleted file mode 100644 index 86232d4f..00000000 Binary files a/apps/website/public/assets/wallet/4.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/5.png b/apps/website/public/assets/wallet/5.png deleted file mode 100644 index bcaca385..00000000 Binary files a/apps/website/public/assets/wallet/5.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/6.png b/apps/website/public/assets/wallet/6.png deleted file mode 100644 index 2e47bbb8..00000000 Binary files a/apps/website/public/assets/wallet/6.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/7.png b/apps/website/public/assets/wallet/7.png deleted file mode 100644 index 98580675..00000000 Binary files a/apps/website/public/assets/wallet/7.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/8.png b/apps/website/public/assets/wallet/8.png deleted file mode 100644 index 1d2a2f45..00000000 Binary files a/apps/website/public/assets/wallet/8.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/cube.png b/apps/website/public/assets/wallet/cube.png deleted file mode 100644 index 756afbdf..00000000 Binary files a/apps/website/public/assets/wallet/cube.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/duck.png b/apps/website/public/assets/wallet/duck.png deleted file mode 100644 index 5136af82..00000000 Binary files a/apps/website/public/assets/wallet/duck.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/gentleman.png b/apps/website/public/assets/wallet/gentleman.png index 6ea5b3fc..31884cff 100644 Binary files a/apps/website/public/assets/wallet/gentleman.png and b/apps/website/public/assets/wallet/gentleman.png differ diff --git a/apps/website/public/assets/wallet/hero-01.png b/apps/website/public/assets/wallet/hero-01.png new file mode 100644 index 00000000..c5a955d6 Binary files /dev/null and b/apps/website/public/assets/wallet/hero-01.png differ diff --git a/apps/website/public/assets/wallet/hero-02.png b/apps/website/public/assets/wallet/hero-02.png new file mode 100644 index 00000000..7505fca9 Binary files /dev/null and b/apps/website/public/assets/wallet/hero-02.png differ diff --git a/apps/website/public/assets/wallet/hero-03.png b/apps/website/public/assets/wallet/hero-03.png new file mode 100644 index 00000000..3e45f95f Binary files /dev/null and b/apps/website/public/assets/wallet/hero-03.png differ diff --git a/apps/website/public/assets/wallet/hero-04.png b/apps/website/public/assets/wallet/hero-04.png new file mode 100644 index 00000000..3f0eca75 Binary files /dev/null and b/apps/website/public/assets/wallet/hero-04.png differ diff --git a/apps/website/public/assets/wallet/illustration-hands-desktop.png b/apps/website/public/assets/wallet/illustration-hands-desktop.png new file mode 100644 index 00000000..d55e1fea Binary files /dev/null and b/apps/website/public/assets/wallet/illustration-hands-desktop.png differ diff --git a/apps/website/public/assets/wallet/illustration-hands-mobile.png b/apps/website/public/assets/wallet/illustration-hands-mobile.png new file mode 100644 index 00000000..de7e8c55 Binary files /dev/null and b/apps/website/public/assets/wallet/illustration-hands-mobile.png differ diff --git a/apps/website/public/assets/wallet/megaphone.png b/apps/website/public/assets/wallet/megaphone.png deleted file mode 100644 index 68e3af90..00000000 Binary files a/apps/website/public/assets/wallet/megaphone.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/nft.png b/apps/website/public/assets/wallet/nft.png deleted file mode 100644 index 1f2247f9..00000000 Binary files a/apps/website/public/assets/wallet/nft.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/pizza.png b/apps/website/public/assets/wallet/pizza.png deleted file mode 100644 index 3fc25108..00000000 Binary files a/apps/website/public/assets/wallet/pizza.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/section-01.png b/apps/website/public/assets/wallet/section-01.png new file mode 100644 index 00000000..63857e59 Binary files /dev/null and b/apps/website/public/assets/wallet/section-01.png differ diff --git a/apps/website/public/assets/wallet/section-02.png b/apps/website/public/assets/wallet/section-02.png new file mode 100644 index 00000000..59fd578f Binary files /dev/null and b/apps/website/public/assets/wallet/section-02.png differ diff --git a/apps/website/public/assets/wallet/section-03.png b/apps/website/public/assets/wallet/section-03.png new file mode 100644 index 00000000..efff2e5b Binary files /dev/null and b/apps/website/public/assets/wallet/section-03.png differ diff --git a/apps/website/public/assets/wallet/section-04.png b/apps/website/public/assets/wallet/section-04.png new file mode 100644 index 00000000..d33fd3cd Binary files /dev/null and b/apps/website/public/assets/wallet/section-04.png differ diff --git a/apps/website/public/assets/wallet/section-05.png b/apps/website/public/assets/wallet/section-05.png new file mode 100644 index 00000000..7b3bc39a Binary files /dev/null and b/apps/website/public/assets/wallet/section-05.png differ diff --git a/apps/website/public/assets/wallet/skull.png b/apps/website/public/assets/wallet/skull.png deleted file mode 100644 index 7df64018..00000000 Binary files a/apps/website/public/assets/wallet/skull.png and /dev/null differ diff --git a/apps/website/public/assets/wallet/vegas.png b/apps/website/public/assets/wallet/vegas.png deleted file mode 100644 index 92fb9e11..00000000 Binary files a/apps/website/public/assets/wallet/vegas.png and /dev/null differ diff --git a/apps/website/public/images/help/communities.png b/apps/website/public/images/help/communities.png deleted file mode 100644 index c1264be8..00000000 Binary files a/apps/website/public/images/help/communities.png and /dev/null differ diff --git a/apps/website/public/images/help/profile-and-preferences.png b/apps/website/public/images/help/profile-and-preferences.png deleted file mode 100644 index 4d5a8a46..00000000 Binary files a/apps/website/public/images/help/profile-and-preferences.png and /dev/null differ diff --git a/apps/website/public/images/help/using-status.png b/apps/website/public/images/help/using-status.png deleted file mode 100644 index 9c9fea81..00000000 Binary files a/apps/website/public/images/help/using-status.png and /dev/null differ diff --git a/apps/website/public/images/help/wallet.png b/apps/website/public/images/help/wallet.png deleted file mode 100644 index a6fb6db5..00000000 Binary files a/apps/website/public/images/help/wallet.png and /dev/null differ diff --git a/apps/website/public/images/illustrations/cog.png b/apps/website/public/images/illustrations/cog.png new file mode 100644 index 00000000..03d6a76e Binary files /dev/null and b/apps/website/public/images/illustrations/cog.png differ diff --git a/apps/website/public/images/illustrations/doge.png b/apps/website/public/images/illustrations/doge.png new file mode 100644 index 00000000..104f044c Binary files /dev/null and b/apps/website/public/images/illustrations/doge.png differ diff --git a/apps/website/public/images/illustrations/duck.png b/apps/website/public/images/illustrations/duck.png new file mode 100644 index 00000000..542a1dec Binary files /dev/null and b/apps/website/public/images/illustrations/duck.png differ diff --git a/apps/website/public/images/illustrations/flower.png b/apps/website/public/images/illustrations/flower.png new file mode 100644 index 00000000..bfc43c1a Binary files /dev/null and b/apps/website/public/images/illustrations/flower.png differ diff --git a/apps/website/public/images/illustrations/hand.png b/apps/website/public/images/illustrations/hand.png new file mode 100644 index 00000000..69adfa5b Binary files /dev/null and b/apps/website/public/images/illustrations/hand.png differ diff --git a/apps/website/public/images/illustrations/lock.png b/apps/website/public/images/illustrations/lock.png new file mode 100644 index 00000000..716b5b0f Binary files /dev/null and b/apps/website/public/images/illustrations/lock.png differ diff --git a/apps/website/public/images/illustrations/megaphone.png b/apps/website/public/images/illustrations/megaphone.png new file mode 100644 index 00000000..a49710ab Binary files /dev/null and b/apps/website/public/images/illustrations/megaphone.png differ diff --git a/apps/website/public/images/illustrations/mushroom.png b/apps/website/public/images/illustrations/mushroom.png new file mode 100644 index 00000000..9d92b096 Binary files /dev/null and b/apps/website/public/images/illustrations/mushroom.png differ diff --git a/apps/website/public/images/illustrations/nft-frame.png b/apps/website/public/images/illustrations/nft-frame.png new file mode 100644 index 00000000..8e459627 Binary files /dev/null and b/apps/website/public/images/illustrations/nft-frame.png differ diff --git a/apps/website/public/images/illustrations/pizza.png b/apps/website/public/images/illustrations/pizza.png new file mode 100644 index 00000000..f87cf9b5 Binary files /dev/null and b/apps/website/public/images/illustrations/pizza.png differ diff --git a/apps/website/public/images/illustrations/rubik-cube.png b/apps/website/public/images/illustrations/rubik-cube.png new file mode 100644 index 00000000..11eece23 Binary files /dev/null and b/apps/website/public/images/illustrations/rubik-cube.png differ diff --git a/apps/website/public/images/help/getting-started.png b/apps/website/public/images/illustrations/skull.png similarity index 100% rename from apps/website/public/images/help/getting-started.png rename to apps/website/public/images/illustrations/skull.png diff --git a/apps/website/public/images/illustrations/triangle.png b/apps/website/public/images/illustrations/triangle.png new file mode 100644 index 00000000..5492e0b4 Binary files /dev/null and b/apps/website/public/images/illustrations/triangle.png differ diff --git a/apps/website/public/images/illustrations/ufo.png b/apps/website/public/images/illustrations/ufo.png new file mode 100644 index 00000000..b1c978bb Binary files /dev/null and b/apps/website/public/images/illustrations/ufo.png differ diff --git a/apps/website/public/images/stickers/cube.png b/apps/website/public/images/stickers/cube.png new file mode 100644 index 00000000..4d8e2c49 Binary files /dev/null and b/apps/website/public/images/stickers/cube.png differ diff --git a/apps/website/public/images/stickers/doge.png b/apps/website/public/images/stickers/doge.png new file mode 100644 index 00000000..616cc2e4 Binary files /dev/null and b/apps/website/public/images/stickers/doge.png differ diff --git a/apps/website/public/images/stickers/gamepad.png b/apps/website/public/images/stickers/gamepad.png new file mode 100644 index 00000000..96a7679f Binary files /dev/null and b/apps/website/public/images/stickers/gamepad.png differ diff --git a/apps/website/public/images/stickers/grumpy-cat.png b/apps/website/public/images/stickers/grumpy-cat.png new file mode 100644 index 00000000..bb861aeb Binary files /dev/null and b/apps/website/public/images/stickers/grumpy-cat.png differ diff --git a/apps/website/public/images/stickers/megaphone.png b/apps/website/public/images/stickers/megaphone.png new file mode 100644 index 00000000..d280a723 Binary files /dev/null and b/apps/website/public/images/stickers/megaphone.png differ diff --git a/apps/website/public/images/stickers/pizza.png b/apps/website/public/images/stickers/pizza.png new file mode 100644 index 00000000..ec20b70d Binary files /dev/null and b/apps/website/public/images/stickers/pizza.png differ diff --git a/apps/website/public/images/stickers/punk.png b/apps/website/public/images/stickers/punk.png new file mode 100644 index 00000000..78047fd8 Binary files /dev/null and b/apps/website/public/images/stickers/punk.png differ diff --git a/apps/website/public/images/stickers/smudge-cat.png b/apps/website/public/images/stickers/smudge-cat.png new file mode 100644 index 00000000..1f68281d Binary files /dev/null and b/apps/website/public/images/stickers/smudge-cat.png differ diff --git a/apps/website/public/images/tokens/eth.png b/apps/website/public/images/tokens/eth.png new file mode 100644 index 00000000..de7c0d52 Binary files /dev/null and b/apps/website/public/images/tokens/eth.png differ diff --git a/apps/website/public/images/tokens/pepe.png b/apps/website/public/images/tokens/pepe.png new file mode 100644 index 00000000..9f5fab92 Binary files /dev/null and b/apps/website/public/images/tokens/pepe.png differ diff --git a/apps/website/public/images/tokens/snt.png b/apps/website/public/images/tokens/snt.png new file mode 100644 index 00000000..bf91bb47 Binary files /dev/null and b/apps/website/public/images/tokens/snt.png differ diff --git a/apps/website/src/components/cards/section.tsx b/apps/website/src/components/cards/section.tsx index bad785f5..d29f3c83 100644 --- a/apps/website/src/components/cards/section.tsx +++ b/apps/website/src/components/cards/section.tsx @@ -1,145 +1,120 @@ import { Text } from '@status-im/components' import { PopupIcon } from '@status-im/icons' -import { cva } from 'class-variance-authority' +import { cx } from 'class-variance-authority' import Image from 'next/image' -import { Border } from './border' +import { type Illustration, illustrations } from '@/config/illustrations' + +import { ScreenshotImage } from '../screenshot-image' import type { StaticImageData } from 'next/image' type Props = { - direction?: 'ltr' | 'rtl' + icon: Illustration title: string description: string + explanation?: string + secondaryTitle: string + secondaryDescription: string + secondaryExplanation?: string image: StaticImageData imageAlt: string - imageSecondary: StaticImageData - imageSecondaryAlt: string - secondaryDescription: string - secondaryTitle: string customNode?: React.ReactNode - color: 'yellow' | 'turquoise' | 'purple' - information?: string + color: 'yellow' | 'turquoise' | 'purple' // | 'none' + reverse?: boolean + dark?: boolean } -const containerClassNames = cva( - [ - 'relative flex w-full justify-center', - 'overflow-hidden', - 'max-h-[854px]', - 'max-w-[582px]', - 'rounded-[32px]', - 'py-[65px]', - ], - { - variants: { - color: { - yellow: ['bg-customisation-yellow/10'], - turquoise: ['bg-customisation-turquoise/10'], - purple: ['bg-customisation-purple/10'], - }, - }, - } -) - -const imageClassNames = cva( - ['rounded-3xl', 'border-4', 'h-auto max-h-[724px] w-auto'], - { - variants: { - color: { - yellow: ['border-customisation-yellow/5'], - turquoise: ['border-customisation-turquoise/5'], - purple: ['border-customisation-purple/5'], - }, - }, - } -) - -const borderContainerClassNames = cva( - ['absolute left-0 top-0', 'w-full', 'h-[100%]'], - { - variants: { - color: { - yellow: ['text-customisation-yellow/5'], - turquoise: ['text-customisation-turquoise/5'], - purple: ['text-customisation-purple/5'], - }, - }, - } -) - const Section = (props: Props) => { const { title, color, description, + explanation, image, imageAlt, - imageSecondary, - imageSecondaryAlt, + icon, secondaryDescription, secondaryTitle, - direction = 'ltr', + secondaryExplanation, + reverse, + dark = false, } = props - const directionOrder = direction === 'ltr' ? 'order-0' : 'order-1' + const illustration = illustrations[icon] return ( -
-
+
+
-
-
- -
-
- {imageAlt} -
-
-
-
- {imageSecondaryAlt} - -
- - {title} - -
- {description} -
-
- -
- - {secondaryTitle} - -
- - {secondaryDescription} - {props.information && ( - - - - )} +
+
+ {illustration.alt} +
+ + {title} +
+ + {description} + {explanation && ( + + + + )} + +
- {props.customNode && ( -
{props.customNode}
- )} +
+ + {secondaryTitle} + +
+ + {secondaryDescription} + {secondaryExplanation && ( + + + + )} + +
+ + {props.customNode && ( +
{props.customNode}
+ )} +
+ +
+ +
diff --git a/apps/website/src/components/feature-list.tsx b/apps/website/src/components/feature-list.tsx new file mode 100644 index 00000000..0b9c2097 --- /dev/null +++ b/apps/website/src/components/feature-list.tsx @@ -0,0 +1,49 @@ +import { Text } from '@status-im/components' +import { cx } from 'class-variance-authority' +import Image from 'next/image' + +import type { illustrations } from '@/config/illustrations' + +type Item = { + title: string + description: string + image: (typeof illustrations)[keyof typeof illustrations] +} + +type Props = { + list: Item[] + dark?: boolean +} + +export const FeatureList = (props: Props) => { + const { list, dark = false } = props + return ( +
+
+ {list.map(({ title, image, description }, i) => ( +
+ {image.alt} +
+ + {title} + + + {description} + +
+
+ ))} +
+
+ ) +} diff --git a/apps/website/src/components/hero.tsx b/apps/website/src/components/hero.tsx new file mode 100644 index 00000000..0b4c3294 --- /dev/null +++ b/apps/website/src/components/hero.tsx @@ -0,0 +1,118 @@ +import { Button, Tag, Text } from '@status-im/components' +import { DownloadIcon, WalletIcon } from '@status-im/icons' +import { cx } from 'class-variance-authority' + +import { GridHero } from './cards' + +import type { StaticImageData } from 'next/image' + +type Props = { + type: 'Communities' | 'Create Community' | 'Wallet' | 'Messenger' + title: string + description: string + color: 'yellow' | 'turquoise' | 'purple' + images: [StaticImageData, StaticImageData, StaticImageData, StaticImageData] + maxWidth: number + dark?: boolean +} + +export const Hero = (props: Props) => { + const { type, title, description, color, images, maxWidth, dark } = props + + return ( +
+
+ {/* */} +
+
+ +
+

+ {title} +

+
+ + {description} + +
+
+ +
+
+ +
+
+
+ + + + {/*
+
+
+
+ +
+
+
+
+ wallet-2 +
+
+
+
+ wallet-3 +
+
+
+
+ wallet-4 +
+
+
+
*/} +
+ ) +} diff --git a/apps/website/src/components/image-grid.tsx b/apps/website/src/components/image-grid.tsx new file mode 100644 index 00000000..cee21bfe --- /dev/null +++ b/apps/website/src/components/image-grid.tsx @@ -0,0 +1,48 @@ +import { cx } from 'class-variance-authority' +import Image from 'next/image' + +import type { StaticImageData } from 'next/image' + +type Props = { + children: React.ReactNode +} + +const ImageGrid = (props: Props) => { + const { children } = props + + return ( +
+ {children} +
+ ) +} + +type ItemProps = { + src: StaticImageData + span: 1 | 2 | 3 | 4 | 5 | 6 + alt: string +} + +const Item = (props: ItemProps) => { + const { src, span, alt } = props + + return ( +
+ {alt} +
+ ) +} + +ImageGrid.Item = Item + +export { ImageGrid } diff --git a/apps/website/src/components/parallax-circle.tsx b/apps/website/src/components/parallax-circle.tsx new file mode 100644 index 00000000..c71d0425 --- /dev/null +++ b/apps/website/src/components/parallax-circle.tsx @@ -0,0 +1,32 @@ +import { Parallax } from 'react-scroll-parallax' + +type ParalaxProps = { + left?: number + top?: number + right?: number + bottom?: number + color: string +} + +const ParalaxCircle = (props: ParalaxProps) => { + const { color, ...position } = props + + return ( + + ) +} + +export { ParalaxCircle } diff --git a/apps/website/src/components/pre-footer.tsx b/apps/website/src/components/pre-footer.tsx index 9b132407..16e82f6e 100644 --- a/apps/website/src/components/pre-footer.tsx +++ b/apps/website/src/components/pre-footer.tsx @@ -11,11 +11,11 @@ const Prefooter = () => {
Status logo -

+

Be unstoppable

- - + + Use the open source, decentralized crypto communication super app. diff --git a/apps/website/src/components/preview-page.tsx b/apps/website/src/components/preview-page.tsx index 624734fb..6ca46a8d 100644 --- a/apps/website/src/components/preview-page.tsx +++ b/apps/website/src/components/preview-page.tsx @@ -433,7 +433,7 @@ export function PreviewPage(props: PreviewPageProps) { )}
-

+

{data.type === 'channel' && '#'} {data.info.displayName}

diff --git a/apps/website/src/components/screenshot-image.tsx b/apps/website/src/components/screenshot-image.tsx new file mode 100644 index 00000000..0e2e8d45 --- /dev/null +++ b/apps/website/src/components/screenshot-image.tsx @@ -0,0 +1,71 @@ +import { cva } from 'class-variance-authority' +import Image from 'next/image' + +import { Border } from './cards/border' + +import type { StaticImageData } from 'next/image' + +type Props = { + image: StaticImageData + alt: string + color: 'yellow' | 'turquoise' | 'purple' +} + +const containerClassNames = cva( + [ + 'relative flex max-h-[854px] w-[582px] max-w-[582px] justify-center overflow-hidden rounded-[40px] py-[65px]', + ], + { + variants: { + color: { + yellow: ['bg-customisation-yellow/10'], + turquoise: ['bg-customisation-turquoise/10'], + purple: ['bg-customisation-purple/10'], + }, + }, + } +) + +const imageClassNames = cva( + ['rounded-3xl', 'h-auto max-h-[724px] w-auto border-4'], + { + variants: { + color: { + yellow: ['border-customisation-yellow/5'], + turquoise: ['border-customisation-turquoise/5'], + purple: ['border-customisation-purple/5'], + }, + }, + } +) + +const borderContainerClassNames = cva( + ['absolute left-0 top-0', 'w-full', 'h-[100%]'], + { + variants: { + color: { + yellow: ['text-customisation-yellow/5'], + turquoise: ['text-customisation-turquoise/5'], + purple: ['text-customisation-purple/5'], + }, + }, + } +) + +export const ScreenshotImage = (props: Props) => { + const { image, color } = props + + return ( +
+
+ +
+
+ {props.alt} +
+ ) +} diff --git a/apps/website/src/components/section-desktop-screenshot.tsx b/apps/website/src/components/section-desktop-screenshot.tsx new file mode 100644 index 00000000..dd2d8fb4 --- /dev/null +++ b/apps/website/src/components/section-desktop-screenshot.tsx @@ -0,0 +1,47 @@ +import React from 'react' + +import { Text } from '@status-im/components' +import Image, { type StaticImageData } from 'next/image' + +import { type Illustration, illustrations } from '@/config/illustrations' + +type Props = { + icon: Illustration + title: string + description: string + image: StaticImageData + dark?: boolean +} + +export const SectionDesktopScreenshot = (props: Props) => { + const { icon, title, description, image, dark } = props + + const illustration = illustrations[icon] + + return ( + <> +
+
+ {illustration.alt} + +
+ + {title} + +
+ + {description} + +
+
+
+
+ {title} + + ) +} diff --git a/apps/website/src/components/section-large.tsx b/apps/website/src/components/section-large.tsx new file mode 100644 index 00000000..46571980 --- /dev/null +++ b/apps/website/src/components/section-large.tsx @@ -0,0 +1,36 @@ +import { Text } from '@status-im/components' +import { cx } from 'class-variance-authority' + +type Props = { + title: string + description: string + description2?: string + children: React.ReactNode + dark?: boolean +} + +export const SectionLarge = (props: Props) => { + const { title, description, description2, children, dark = false } = props + + return ( +
+
+

+ {title} +

+ + {description} + + {description2 && ( + <> +
…
+ + {description2} + + + )} +
+ {children} +
+ ) +} diff --git a/apps/website/src/components/video-section.tsx b/apps/website/src/components/video-section.tsx new file mode 100644 index 00000000..5f10488f --- /dev/null +++ b/apps/website/src/components/video-section.tsx @@ -0,0 +1,47 @@ +import { Text } from '@status-im/components' +import { cx } from 'class-variance-authority' +import Image from 'next/image' + +import type { StaticImageData } from 'next/image' + +// import { ParalaxCircle } from './parallax-circle' + +type Props = { + title: string + description: string + image?: StaticImageData + dark?: boolean +} + +const VideoSection = (props: Props) => { + const { title, description, image, dark } = props + + return ( +
+ {/* */} + +
+
+

+ {title} +

+ + {description} + +
+
+
+ {image && TODO} + {/* */} +
+
+ ) +} + +export { VideoSection } diff --git a/apps/website/src/components/wallet/comparision-section.tsx b/apps/website/src/components/wallet/comparision-section.tsx index 11663be3..eceee7ce 100644 --- a/apps/website/src/components/wallet/comparision-section.tsx +++ b/apps/website/src/components/wallet/comparision-section.tsx @@ -1,14 +1,9 @@ import { Button, Counter, Tag, Text } from '@status-im/components' +import { Parallax } from 'react-scroll-parallax' -import { useParalax } from '@/hooks/use-parallax' - -import { ParalaxCircle } from './parallax-circle' +import { ParalaxCircle } from '../parallax-circle' const ComparisionSection = () => { - const { top, bottom } = useParalax({ - initialTop: -690, - }) - return (
@@ -18,7 +13,7 @@ const ComparisionSection = () => {
-

+

Alice has 50 DAI on both Ethereum Mainnet and Optimism and wants to send 100 DAI to Bob on Arbitrum.

@@ -60,20 +55,18 @@ const ComparisionSection = () => { ))}
- +
-

eth:opt:arb:0xAgafhja -

+
) } diff --git a/apps/website/src/components/wallet/hands-section.tsx b/apps/website/src/components/wallet/hands-section.tsx index 59fffa8e..91511d98 100644 --- a/apps/website/src/components/wallet/hands-section.tsx +++ b/apps/website/src/components/wallet/hands-section.tsx @@ -1,11 +1,17 @@ +import gentlemanImage from '@assets/wallet/gentleman.png' +import illustartionHandsDesktop from '@assets/wallet/illustration-hands-desktop.png' import { Text } from '@status-im/components' +import Image from 'next/image' + +// import illustartionHandsMobile from '@assets/wallet/illustration-hands-mobile.png' +import { illustrations } from '@/config/illustrations' const HandsSection = () => { return (
-

+

Take control
of your crypto @@ -19,41 +25,53 @@ const HandsSection = () => {

-
- skull -
- - Ethereum based assets - - - We support all assets in the Uniswap Labs default tokenlist and - those minted by communities using Status. - + {[ + { + icon: illustrations.skull, + title: 'Ethereum based assets', + description: + 'We support all assets in the Uniswap Labs default tokenlist and those minted by communities using Status.', + }, + { + icon: illustrations.nft, + title: 'NFTs and collectibles', + description: + 'We will display any NFTs or collectibles listed on OpenSea plus those minted by communities using Status.', + }, + ].map(item => ( +
+ {item.icon.alt} +
+ + Ethereum based assets + + + We support all assets in the Uniswap Labs default tokenlist and + those minted by communities using Status. + +
-
-
- nft -
- - NFTs and collectibles - - - We will display any NFTs or collectibles listed on OpenSea plus - those minted by communities using Status. - -
-
+ ))}
- hands - gentleman
) diff --git a/apps/website/src/components/wallet/hero-section.tsx b/apps/website/src/components/wallet/hero-section.tsx deleted file mode 100644 index 2111c23c..00000000 --- a/apps/website/src/components/wallet/hero-section.tsx +++ /dev/null @@ -1,73 +0,0 @@ -import { Button, Tag, Text } from '@status-im/components' -import { DownloadIcon, WalletIcon } from '@status-im/icons' -import image1 from 'public/assets/wallet/1.png' -import image2 from 'public/assets/wallet/2.png' -import image3 from 'public/assets/wallet/3.png' -import image4 from 'public/assets/wallet/vegas.png' - -import { GridHero } from '../cards/grid-hero' -import { ParalaxCircle } from './parallax-circle' - -const HeroSection = () => { - return ( -
-
- -
-
- -
-

- The future -
- is multi-chain -

- - - L2s made simple - send and manage your crypto easily and safely - across multiple networks. - - -
- -
-
- -
-
-
- -
- ) -} - -export { HeroSection } diff --git a/apps/website/src/components/wallet/index.tsx b/apps/website/src/components/wallet/index.tsx index 149c6e29..6fda6706 100644 --- a/apps/website/src/components/wallet/index.tsx +++ b/apps/website/src/components/wallet/index.tsx @@ -1,5 +1,3 @@ export { ComparisionSection } from './comparision-section' export { HandsSection } from './hands-section' -export { HeroSection } from './hero-section' -export { ParalaxCircle } from './parallax-circle' export { VideoSection } from './video-section' diff --git a/apps/website/src/components/wallet/parallax-circle.tsx b/apps/website/src/components/wallet/parallax-circle.tsx deleted file mode 100644 index dc620dd2..00000000 --- a/apps/website/src/components/wallet/parallax-circle.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { useParalax } from '@/hooks/use-parallax' - -type ParalaxProps = { - initialLeft?: number - initialTop?: number - initialRight?: number - initialBottom?: number -} - -const ParalaxCircle = (props: ParalaxProps) => { - const { top, bottom } = useParalax(props) - - return ( -
- ) -} - -export { ParalaxCircle } diff --git a/apps/website/src/components/wallet/video-section.tsx b/apps/website/src/components/wallet/video-section.tsx index 258acd99..dd9d488b 100644 --- a/apps/website/src/components/wallet/video-section.tsx +++ b/apps/website/src/components/wallet/video-section.tsx @@ -1,14 +1,18 @@ import { ContextTag, Text } from '@status-im/components' -import { ParalaxCircle } from './parallax-circle' +import { ParalaxCircle } from '../parallax-circle' const VideoSection = () => { return (
- +
-

+

Fully
Decentralized diff --git a/apps/website/src/config/illustrations.ts b/apps/website/src/config/illustrations.ts new file mode 100644 index 00000000..ce5e17f4 --- /dev/null +++ b/apps/website/src/config/illustrations.ts @@ -0,0 +1,103 @@ +import cog from '@images/illustrations/cog.png' +import doge from '@images/illustrations/doge.png' +import duck from '@images/illustrations/duck.png' +import flower from '@images/illustrations/flower.png' +import hand from '@images/illustrations/hand.png' +import lock from '@images/illustrations/lock.png' +import megaphone from '@images/illustrations/megaphone.png' +import mushroom from '@images/illustrations/mushroom.png' +import nft from '@images/illustrations/nft-frame.png' +import pizza from '@images/illustrations/pizza.png' +import rubik from '@images/illustrations/rubik-cube.png' +import skull from '@images/illustrations/skull.png' +import triangle from '@images/illustrations/triangle.png' +import ufo from '@images/illustrations/ufo.png' + +export type Illustration = keyof typeof illustrations + +export const illustrations = { + cog: { + src: cog, + alt: 'Cog', + width: 48, + height: 48, + }, + doge: { + src: doge, + alt: 'Doge', + width: 48, + height: 48, + }, + duck: { + src: duck, + alt: 'Duck', + width: 48, + height: 48, + }, + flower: { + src: flower, + alt: 'Flower', + width: 48, + height: 48, + }, + hand: { + src: hand, + alt: 'Hand', + width: 48, + height: 48, + }, + lock: { + src: lock, + alt: 'Lock', + width: 48, + height: 48, + }, + megaphone: { + src: megaphone, + alt: 'Megaphone', + width: 48, + height: 48, + }, + nft: { + src: nft, + alt: 'NFT', + width: 48, + height: 48, + }, + pizza: { + src: pizza, + alt: 'Pizza', + width: 48, + height: 48, + }, + rubik: { + src: rubik, + alt: 'Rubik', + width: 48, + height: 48, + }, + skull: { + src: skull, + alt: 'Skull', + width: 48, + height: 48, + }, + triangle: { + src: triangle, + alt: 'Triangle', + width: 48, + height: 48, + }, + ufo: { + src: ufo, + alt: 'UFO', + width: 48, + height: 48, + }, + mushroom: { + src: mushroom, + alt: 'Mushroom', + width: 48, + height: 48, + }, +} as const diff --git a/apps/website/src/config/routes.ts b/apps/website/src/config/routes.ts index d9e0715f..0e248271 100644 --- a/apps/website/src/config/routes.ts +++ b/apps/website/src/config/routes.ts @@ -1,16 +1,16 @@ import { - AdvancedIcon, - AirdropIcon, - CommunitiesIcon, - TokenIcon, + GithubIcon, + StatusIcon, + TwitterIcon, + YoutubeIcon, } from '@status-im/icons' export const ROUTES = { Features: [ { name: 'Communities', href: '/features/communities' }, + { name: 'Create Communiy', href: '/features/create-community' }, { name: 'Messenger', href: '/features/messenger' }, { name: 'Wallet', href: '/features/wallet' }, - { name: 'Browser', href: '/features/browser' }, ], Platforms: [ { name: 'Mobile', href: '/platforms/mobile' }, @@ -21,7 +21,6 @@ export const ROUTES = { { name: 'Mission', href: '/' }, { name: 'Principles', href: '/' }, { name: 'Team', href: '/' }, - { name: 'Partners', href: '/' }, { name: 'Press Kit', href: '/' }, ], Help: [ @@ -37,19 +36,19 @@ export const ROUTES = { { name: 'Feature upvote', href: '/' }, { name: 'Blog', href: '/blog' }, { name: 'Translations', href: '/' }, - { name: 'Community groups', href: '/' }, + // { name: 'Community groups', href: '/' }, { name: 'Jobs', href: '/' }, ], Developers: [ { name: 'Repos', href: 'https://github.com/status-im' }, - { name: 'Insights', href: '/insights' }, + { name: 'Insights', href: '/insights/epics' }, { name: 'Integrations', href: '/' }, ], SNT: [ - { name: 'Token', href: '/' }, + // { name: 'Token', href: '/' }, { name: 'Governance', href: '/' }, - { name: 'Curate', href: '/' }, - { name: 'Exchanges', href: '/' }, + { name: 'Curate', href: 'https://curate.status.app' }, + // { name: 'Exchanges', href: '/' }, ], } as const @@ -57,23 +56,23 @@ export const ROUTES = { export const SOCIALS = { status: { name: 'Status', - href: '', - icon: CommunitiesIcon, + href: 'TODO', + icon: StatusIcon, }, twitter: { name: 'Twitter', href: 'https://twitter.com/ethstatus', - icon: TokenIcon, + icon: TwitterIcon, }, github: { name: 'GitHub', href: 'https://github.com/status-im', - icon: AirdropIcon, + icon: GithubIcon, }, youtube: { name: 'YouTube', href: 'https://youtube.com/', - icon: AdvancedIcon, + icon: YoutubeIcon, }, } diff --git a/apps/website/src/config/stickers.ts b/apps/website/src/config/stickers.ts new file mode 100644 index 00000000..bfb6aeae --- /dev/null +++ b/apps/website/src/config/stickers.ts @@ -0,0 +1,61 @@ +import cube from '@images/stickers/cube.png' +import doge from '@images/stickers/doge.png' +import gamepad from '@images/stickers/gamepad.png' +import grumpyCat from '@images/stickers/grumpy-cat.png' +import megaphone from '@images/stickers/megaphone.png' +import pizza from '@images/stickers/pizza.png' +import punk from '@images/stickers/punk.png' +import smudgeCat from '@images/stickers/smudge-cat.png' + +export type Sticker = keyof typeof stickers + +export const stickers = { + doge: { + src: doge, + alt: 'doge', + width: 114, + height: 114, + }, + grumpyCat: { + src: grumpyCat, + alt: 'grumpyCat', + width: 114, + height: 114, + }, + pizza: { + src: pizza, + alt: 'pizza', + width: 114, + height: 114, + }, + punk: { + src: punk, + alt: 'punk', + width: 114, + height: 114, + }, + smudgeCat: { + src: smudgeCat, + alt: 'smudgeCat', + width: 114, + height: 114, + }, + gamepad: { + src: gamepad, + alt: 'gamepad', + width: 132, + height: 132, + }, + megaphone: { + src: megaphone, + alt: 'megaphone', + width: 120, + height: 120, + }, + cube: { + src: cube, + alt: 'rubic cube', + width: 102, + height: 102, + }, +} as const diff --git a/apps/website/src/config/tokens.ts b/apps/website/src/config/tokens.ts new file mode 100644 index 00000000..9092e1ad --- /dev/null +++ b/apps/website/src/config/tokens.ts @@ -0,0 +1,26 @@ +import eth from '@images/tokens/eth.png' +import pepe from '@images/tokens/pepe.png' +import snt from '@images/tokens/snt.png' + +export type Token = keyof typeof tokens + +export const tokens = { + eth: { + src: eth, + alt: 'ETH token', + width: 102, + height: 108, + }, + pepe: { + src: pepe, + alt: 'Pepe the frog token', + width: 82, + height: 90, + }, + snt: { + src: snt, + alt: 'SNT token', + width: 96, + height: 88, + }, +} as const diff --git a/apps/website/src/hooks/use-parallax.ts b/apps/website/src/hooks/use-parallax.ts deleted file mode 100644 index a12b976b..00000000 --- a/apps/website/src/hooks/use-parallax.ts +++ /dev/null @@ -1,34 +0,0 @@ -import { useEffect, useState } from 'react' - -type ParalaxProps = { - initialLeft?: number - initialTop?: number - initialRight?: number - initialBottom?: number -} - -const PARALLAX_SPEED = 4 - -function useParalax(props?: ParalaxProps) { - const initialTop = props?.initialTop || 0 - const initialBottom = props?.initialBottom || 0 - - const [top, setTop] = useState(initialTop) - - const [bottom, setBottom] = useState(initialBottom) - - useEffect(() => { - const handleScroll = () => { - const scrollY = window.scrollY - - setTop(scrollY / PARALLAX_SPEED + initialTop) - setBottom(scrollY / PARALLAX_SPEED + initialBottom) - } - window.addEventListener('scroll', handleScroll, { passive: true }) - return () => window.removeEventListener('scroll', handleScroll) - }, [initialBottom, initialTop]) - - return { top, bottom } -} - -export { useParalax } diff --git a/apps/website/src/layouts/app-layout.tsx b/apps/website/src/layouts/app-layout.tsx index 8ae685b9..ea56d296 100644 --- a/apps/website/src/layouts/app-layout.tsx +++ b/apps/website/src/layouts/app-layout.tsx @@ -1,5 +1,5 @@ -import { Text } from '@status-im/components' -import { ChevronRightIcon } from '@status-im/icons' +import { cx } from 'class-variance-authority' +import { ParallaxProvider } from 'react-scroll-parallax' import { Footer } from '@/components/footer/footer' import { FooterMobile } from '@/components/footer/footer-mobile' @@ -8,7 +8,7 @@ import { NavDesktop } from '@/components/navigation/nav-desktop' import { NavMobile } from '@/components/navigation/nav-mobile' import { Prefooter } from '@/components/pre-footer' -import type { ReactElement } from 'react' +import type { ReactElement, ReactNode } from 'react' type AppLayoutProps = { hasPreFooter?: boolean @@ -27,12 +27,14 @@ export const AppLayout: React.FC = ({ {/* ROUNDED WHITE BG */} -
- {/* TODO Check max-width to use */} -
+ +
+ {/* TODO Check max-width to use */} + {/*
*/} + {children}
-
+ {hasPreFooter && }