From 16c0a76a647bca3061aaa6a4d4043a94582b35e0 Mon Sep 17 00:00:00 2001 From: Kirill Zyusko Date: Wed, 18 Dec 2024 14:19:04 +0100 Subject: [PATCH] docs: added trusted by section (#734) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## 📜 Description Added apps/templates/frameworks that use this library or recommend to use it. ## 💡 Motivation and Context To encourage/convince devs to use this library and show/prove that this library powers many popular `react-native` apps/boilerplates and trusted by many developers. I also added a link to submit a PR for devs who wanted to show, that they also use this lib. I don't think I violate any legal rules, because all that information is publicly available: https://github.com/kirillzyusko/react-native-keyboard-controller/network/dependents As time passes on I'll periodically update this table 😊 ## 📢 Changelog ### Docs - added trusted by section on landing page. ## 🤔 How Has This Been Tested? Tested on localhost:3000. ## 📸 Screenshots (if appropriate): image ## 📝 Checklist - [x] CI successfully passed - [x] I added new mocks and corresponding unit-tests if library API was changed --- cspell.json | 5 +- docs/src/pages/index.module.css | 39 ++++++++++++ docs/src/pages/index.tsx | 102 ++++++++++++++++++++++++++++++++ 3 files changed, 145 insertions(+), 1 deletion(-) diff --git a/cspell.json b/cspell.json index dc1a11f1df..6b46e2b671 100644 --- a/cspell.json +++ b/cspell.json @@ -126,7 +126,10 @@ "focusable", "iphonesimulator", "suspendable", - "libc" + "libc", + "chatwoot", + "obytes", + "kitsu" ], "ignorePaths": [ "node_modules", diff --git a/docs/src/pages/index.module.css b/docs/src/pages/index.module.css index 9f71a5da77..dade002aaf 100644 --- a/docs/src/pages/index.module.css +++ b/docs/src/pages/index.module.css @@ -21,3 +21,42 @@ align-items: center; justify-content: center; } + +.trustedBySection { + text-align: center; + display: flex; + flex-direction: column; + align-items: center; + overflow: hidden; + padding-bottom: 4rem; +} + +.trustedByTitle { + padding-bottom: 16px; +} + +.trustedByImg { + margin: 0px 15px; + border-radius: 25px; + width: 100px; + height: 100px; + box-shadow: 5px 5px 51px -29px rgba(139, 139, 139, 1); +} + +.trustedByContainer { + display: flex; + flex-direction: row; + justify-content: center; + flex-wrap: wrap; + max-width: 1200px; + max-height: 460px; /* 3 rows only */ + row-gap: 15px; + overflow: hidden; +} + +.addYourApp { + width: 100%; + max-width: 1200px; + text-align: right; + margin-right: 20px; +} diff --git a/docs/src/pages/index.tsx b/docs/src/pages/index.tsx index 36fa3ddfa2..26b82973a8 100644 --- a/docs/src/pages/index.tsx +++ b/docs/src/pages/index.tsx @@ -28,6 +28,107 @@ function HomepageHeader() { ); } +const trustedBy = [ + { + img: "https://avatars.githubusercontent.com/u/476779?s=200&v=4", + alt: "Expensify Mobile App", + link: "https://github.com/Expensify/App", + name: "Expensify", + }, + { + img: "https://avatars.githubusercontent.com/u/94650532?s=200&v=4", + alt: "BlueSky Mobile App", + link: "https://github.com/bluesky-social/social-app", + name: "BlueSky", + }, + { + img: "https://avatars.githubusercontent.com/u/12504344?s=200&v=4", + alt: "Expo framework", + link: "https://docs.expo.dev/guides/keyboard-handling/", + name: "Expo", + }, + { + img: "https://avatars.githubusercontent.com/u/3902527?s=200&v=4", + alt: "InfiniteRed Ignite react native project boilerplate", + link: "https://github.com/infinitered/ignite", + name: "Ignite", + }, + { + img: "https://avatars.githubusercontent.com/u/88587596?s=200&v=4", + alt: "TonKeeper Wallet app", + link: "https://github.com/tonkeeper/wallet", + name: "TON Wallet", + }, + { + img: "https://avatars.githubusercontent.com/u/23416667?s=200&v=4", + alt: "Chatwoot mobile app", + link: "https://github.com/chatwoot/chatwoot-mobile-app", + name: "Chatwoot", + }, + { + img: "https://avatars.githubusercontent.com/u/4201786?s=200&v=4", + alt: "Obytes react native project template", + link: "https://github.com/obytes/react-native-template-obytes", + name: "Obytes", + }, + { + img: "https://avatars.githubusercontent.com/u/431672?s=200&v=4", + alt: "Minds app", + link: "https://github.com/Minds/mobile-native", + name: "Minds", + }, + { + img: "https://avatars.githubusercontent.com/u/79029086?s=200&v=4", + alt: "Showtime mobile app", + link: "https://github.com/showtime-xyz/showtime-frontend", + name: "Showtime", + }, + { + img: "https://avatars.githubusercontent.com/u/97704884?s=200&v=4", + alt: "Converse Messenger", + link: "https://github.com/ephemeraHQ/converse-app", + name: "Converse", + }, + { + img: "https://avatars.githubusercontent.com/u/6613230?s=200&v=4", + alt: "Edge App", + link: "https://github.com/EdgeApp/edge-react-gui", + name: "Edge", + }, + { + img: "https://avatars.githubusercontent.com/u/7648832?s=200&v=4", + alt: "Kitsu App", + link: "https://github.com/hummingbird-me/kitsu-mobile", + name: "Kitsu", + }, +]; + +function TrustedBy(): JSX.Element { + return ( +
+

Trusted by

+
+ {trustedBy.map((item, index) => ( + + {item.alt} +

{item.name}

+ + ))} +
+

+ Would like to show your project here?{" "} + + Submit a PR + +

+
+ ); +} + export default function Home(): JSX.Element { const { siteConfig } = useDocusaurusContext(); @@ -39,6 +140,7 @@ export default function Home(): JSX.Element {
+
);