diff --git a/.gitignore b/.gitignore
index 2267bee28..b1bdbe351 100644
--- a/.gitignore
+++ b/.gitignore
@@ -15,6 +15,9 @@ build
!.yarn/releases
!.yarn/sdks
!.yarn/versions
+**/.yarn/install-state.gz
# Docusaurus
.docusaurus
+
+
diff --git a/website/.yarn/install-state.gz b/website/.yarn/install-state.gz
deleted file mode 100644
index c2dc964f8..000000000
Binary files a/website/.yarn/install-state.gz and /dev/null differ
diff --git a/website/docs/12.x/index.md b/website/docs/12.x/index.md
index 85466e690..a4680e18a 100644
--- a/website/docs/12.x/index.md
+++ b/website/docs/12.x/index.md
@@ -2,10 +2,12 @@
pageType: home
hero:
- name: 'React Native Testing Library'
image:
- src: /img/owl.png
- tagline: Helps you to write better tests with less effort.
+ src:
+ light: /img/logo-light.svg
+ dark: /img/logo-dark.svg
+ name: JavaScript Integration testing for React Native
+ tagline: The more your tests resemble the way your software is used, the more confidence they can give you.
— Kent C. Dodds
actions:
- theme: brand
text: Quick Start
@@ -16,11 +18,11 @@ hero:
features:
- title: Maintainable
details: Write maintainable tests for your React Native apps.
- icon: ✨
+ icon: 
- title: Reliable
details: Promotes testing public APIs and avoiding implementation details.
- icon: ✅
+ icon: 
- title: Community Driven
details: Supported by React Native community and its core contributors.
- icon: ❤️
+ icon: 
---
diff --git a/website/docs/13.x/index.md b/website/docs/13.x/index.md
index c63bc712a..2cde35928 100644
--- a/website/docs/13.x/index.md
+++ b/website/docs/13.x/index.md
@@ -2,10 +2,12 @@
pageType: home
hero:
- name: 'React Native Testing Library'
image:
- src: /img/owl.png
- tagline: Helps you to write better tests with less effort.
+ src:
+ light: /img/logo-light.svg
+ dark: /img/logo-dark.svg
+ name: JavaScript Integration testing for React Native
+ tagline: The more your tests resemble the way your software is used, the more confidence they can give you.
— Kent C. Dodds
actions:
- theme: brand
text: Quick Start
@@ -16,11 +18,11 @@ hero:
features:
- title: Maintainable
details: Write maintainable tests for your React Native apps.
- icon: ✨
+ icon:
- title: Reliable
details: Promotes testing public APIs and avoiding implementation details.
- icon: ✅
+ icon:
- title: Community Driven
details: Supported by React Native community and its core contributors.
- icon: ❤️
+ icon:
---
diff --git a/website/docs/14.x/index.md b/website/docs/14.x/index.md
index fffa816ae..0bb05eccd 100644
--- a/website/docs/14.x/index.md
+++ b/website/docs/14.x/index.md
@@ -2,10 +2,12 @@
pageType: home
hero:
- name: 'React Native Testing Library'
image:
- src: /img/owl.png
- tagline: Helps you to write better tests with less effort.
+ src:
+ light: /img/logo-light.svg
+ dark: /img/logo-dark.svg
+ name: JavaScript Integration testing for React Native
+ tagline: The more your tests resemble the way your software is used, the more confidence they can give you.
— Kent C. Dodds
actions:
- theme: brand
text: Quick Start
@@ -16,11 +18,11 @@ hero:
features:
- title: Maintainable
details: Write maintainable tests for your React Native apps.
- icon: ✨
+ icon:
- title: Reliable
details: Promotes testing public APIs and avoiding implementation details.
- icon: ✅
+ icon:
- title: Community Driven
details: Supported by React Native community and its core contributors.
- icon: ❤️
+ icon:
---
diff --git a/website/docs/public/img/icon-check-double.svg b/website/docs/public/img/icon-check-double.svg
new file mode 100644
index 000000000..39fd6a02e
--- /dev/null
+++ b/website/docs/public/img/icon-check-double.svg
@@ -0,0 +1,3 @@
+
diff --git a/website/docs/public/img/icon-code.svg b/website/docs/public/img/icon-code.svg
new file mode 100644
index 000000000..84b89912c
--- /dev/null
+++ b/website/docs/public/img/icon-code.svg
@@ -0,0 +1,16 @@
+
diff --git a/website/docs/public/img/icon-users.svg b/website/docs/public/img/icon-users.svg
new file mode 100644
index 000000000..5f9aefd0a
--- /dev/null
+++ b/website/docs/public/img/icon-users.svg
@@ -0,0 +1,10 @@
+
diff --git a/website/docs/public/img/logo-dark.png b/website/docs/public/img/logo-dark.png
new file mode 100644
index 000000000..7937fe72a
Binary files /dev/null and b/website/docs/public/img/logo-dark.png differ
diff --git a/website/docs/public/img/logo-dark.svg b/website/docs/public/img/logo-dark.svg
new file mode 100644
index 000000000..92af095a3
--- /dev/null
+++ b/website/docs/public/img/logo-dark.svg
@@ -0,0 +1,29 @@
+
diff --git a/website/docs/public/img/logo-light.png b/website/docs/public/img/logo-light.png
new file mode 100644
index 000000000..37957ff7e
Binary files /dev/null and b/website/docs/public/img/logo-light.png differ
diff --git a/website/docs/public/img/logo-light.svg b/website/docs/public/img/logo-light.svg
new file mode 100644
index 000000000..91a339679
--- /dev/null
+++ b/website/docs/public/img/logo-light.svg
@@ -0,0 +1,29 @@
+
diff --git a/website/docs/styles/index.css b/website/docs/styles/index.css
index c1eec7ec4..f67606c9b 100644
--- a/website/docs/styles/index.css
+++ b/website/docs/styles/index.css
@@ -287,30 +287,30 @@ p.rspress-home-hero-text {
}
}
-/* Hero Image (Owl Logo) Sizing */
-[class*='heroImage-'] {
- width: 96px !important;
- height: 96px !important;
- min-width: 96px !important;
- min-height: 96px !important;
+/* Hero Image (Logo) Sizing */
+[class*='heroImage-'],
+.rp-home-hero__image-img {
+ height: 24px !important;
+ width: auto !important;
+ margin-left: 0 !important;
+ margin-right: auto !important;
}
-@media (min-width: 640px) {
- [class*='heroImage-'] {
- width: 120px !important;
- height: 120px !important;
- min-width: 120px !important;
- min-height: 120px !important;
- }
+/* Hero Image Dark/Light Mode */
+.rp-home-hero__image-img--dark {
+ display: none;
}
-@media (min-width: 768px) {
- [class*='heroImage-'] {
- width: 144px !important;
- height: 144px !important;
- min-width: 144px !important;
- min-height: 144px !important;
- }
+.rp-home-hero__image-img--light {
+ display: block;
+}
+
+.dark .rp-home-hero__image-img--dark {
+ display: block;
+}
+
+.dark .rp-home-hero__image-img--light {
+ display: none;
}
/* Feature Card Icons (Emojis) Sizing */
diff --git a/website/rspress.config.ts b/website/rspress.config.ts
index 6f73dd90e..37c1a10d7 100644
--- a/website/rspress.config.ts
+++ b/website/rspress.config.ts
@@ -362,9 +362,11 @@ export default defineConfig({
base: '/react-native-testing-library/',
title: 'React Native Testing Library',
description: 'Helps you to write better tests with less effort.',
- icon: '/img/owl.png',
- logo: '/img/owl.png',
- logoText: 'React Native Testing Library',
+ icon: '/img/logo-light.png',
+ logo: {
+ light: '/img/logo-light.svg',
+ dark: '/img/logo-dark.svg',
+ },
outDir: 'build',
globalStyles: path.join(__dirname, 'docs/styles/index.css'),
markdown: {