docs: update all readmes

argos-ci · Nov 28, 2024 · 7f750c5 · 7f750c5
1 parent dc2e71e
commit 7f750c5
Show file tree

Hide file tree

Showing 17 changed files with 96 additions and 23 deletions.
diff --git a/examples/circleci/README.md b/examples/circleci/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos running on CircleCI
 
 This example showcases Argos Visual Testing running on [CircleCI](https://circleci.com/).

diff --git a/examples/cypress/README.md b/examples/cypress/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + Cypress
 
 This example showcases Argos Visual Testing integrated to [Cypress](https://www.cypress.io/) testing framework.

diff --git a/examples/github-actions/README.md b/examples/github-actions/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos running on GitHub Actions
 
 This example showcases Argos Visual Testing running on [GitHub Actions](https://github.com/features/actions).

diff --git a/examples/nextjs/README.md b/examples/nextjs/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + Next.js
 
 This example showcases Argos Visual Testing integrated to [Next.js](https://nextjs.org/).

diff --git a/examples/playwright/README.md b/examples/playwright/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + Playwright
 
 This example showcases Argos Visual Testing integrated to [Playwright](https://playwright.dev/) testing framework.

diff --git a/examples/puppeteer/README.md b/examples/puppeteer/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + Puppeteer
 
 This example showcases Argos Visual Testing integrated to [Puppeteer](https://pptr.dev/).

diff --git a/examples/remix/README.md b/examples/remix/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + Remix
 
 This example showcases Argos Visual Testing integrated to [Remix](https://remix.run/).

diff --git a/examples/storybook-legacy/README.md b/examples/storybook-legacy/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + Storybook and Storycap
 
 This example showcases Argos Visual Testing integrated to [Storybook](https://storybook.js.org/) using [Storycap](https://github.com/reg-viz/storycap) to capture screenshots.

diff --git a/examples/storybook/README.md b/examples/storybook/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + Storybook
 
 This example showcases Argos Visual Testing integrated to [Storybook](https://storybook.js.org/) testing framework.

diff --git a/examples/travis/README.md b/examples/travis/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos running on Travis
 
 This example showcases Argos Visual Testing running on [Travis](https://www.travis-ci.com/).

diff --git a/examples/webdriver-io/README.md b/examples/webdriver-io/README.md
@@ -1,9 +1,14 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
+
 # Example of Argos + WebdriverIO
 
 This example showcases Argos Visual Testing integrated to [WebdriverIO](https://webdriver.io/) testing framework.

diff --git a/packages/browser/README.md b/packages/browser/README.md
@@ -1,10 +1,13 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
-_Argos is a visual testing solution that fits in your workflow to avoid visual regression. Takes screenshots on each commit and be notified if something changes._
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
 
 # Argos Browser
 

diff --git a/packages/cli/README.md b/packages/cli/README.md
@@ -1,10 +1,13 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
-_Argos is a visual testing solution that fits in your workflow to avoid visual regression. Takes screenshots on each commit and be notified if something changes._
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
 
 # Argos Command Line Interface
 

diff --git a/packages/core/README.md b/packages/core/README.md
@@ -1,10 +1,13 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
-_Argos is a visual testing solution that fits in your workflow to avoid visual regression. Takes screenshots on each commit and be notified if something changes._
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
 
 # Argos JavaScript SDK Core
 

diff --git a/packages/playwright/README.md b/packages/playwright/README.md
@@ -1,10 +1,13 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
-_Argos is a visual testing solution that fits in your workflow to avoid visual regression. Takes screenshots on each commit and be notified if something changes._
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
 
 # Official Argos Playwright integration
 

diff --git a/packages/storybook/README.md b/packages/storybook/README.md
@@ -1,10 +1,13 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
-_Argos is a visual testing solution that fits in your workflow to avoid visual regression. Takes screenshots on each commit and be notified if something changes._
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
 
 # Official Argos Storybook integration
 

diff --git a/packages/util/README.md b/packages/util/README.md
@@ -1,10 +1,13 @@
 <p align="center">
   <a href="https://argos-ci.com/?utm_source=github&utm_medium=logo" target="_blank">
-    <img src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/logo-github-readme.png" alt="Argos" width="300" height="61">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-dark.png">
+    <img alt="Argos" src="https://raw.githubusercontent.com/argos-ci/argos/main/resources/logos/github-readme-logo-light.png" width="360" height="70">
+  </picture>
   </a>
 </p>
 
-_Argos is a visual testing solution that fits in your workflow to avoid visual regression. Takes screenshots on each commit and be notified if something changes._
+<p align="center"><strong>The open source visual testing plaform for modern engineering teams.</strong></p>
 
 # Argos Utilities