Rework the README (#2135)

Major README.md cleaning

Additions:
* Add the invidious logo
* Add Quickstart section
* Add relevant links (instance list, documentation, contribute, donate) directly in the header

Badges:
* Add badges for open issues and PRs
* Add "Awesome Humane Tech" badge, as we're listed there
* Move CI passed/translated badges to the top
* Replace the "license feature" with a proper badge

Major section changes:
* Reword titles
* Rewrite features list
* Promote the screenshots sections. People like screenshots!
* Move "donate" to the end, there is a link at the top anyway
* Move section "made with invidious" after all the other invidious related sections + rename it to "Projects using Invidious"

Other fixes:
* Remove useless HTML in the screenshots table
* Remove extra columns in H2 titles
* Remove all useless lines between sections
* Use markdown for git commands + add the staging step
* Promote invidious redirect in "Extensions"
* Update preference screenshots

README.md

@@ -1,73 +1,133 @@
-<h1 align="center">Invidious</h1>
+<div align="center">
+  <img src="assets/android-chrome-192x192.png">
+  <h1>Invidious</h1>
 
-<h2 align="center">Invidious is an alternative front-end to YouTube.</h2>
+  <a href="https://www.gnu.org/licenses/agpl-3.0.en.html">
+    <img alt="License: AGPLv3+" src="https://shields.io/badge/License-AGPL%20v3+-blue.svg">
+  </a>
+  <a href="https://github.com/iv-org/invidious/actions">
+    <img alt="Build Status" src="https://github.com/iv-org/invidious/workflows/Invidious%20CI/badge.svg">
+  </a>
+  <a href="https://github.com/iv-org/invidious/issues">
+    <img alt="GitHub issues" src="https://img.shields.io/github/issues/iv-org/invidious?color=important">
+  </a>
+  <a href="https://github.com/iv-org/invidious/pulls">
+    <img alt="GitHub pull requests" src="https://img.shields.io/github/issues-pr/iv-org/invidious?color=blueviolet">
+  </a>
+  <a href="https://hosted.weblate.org/engage/invidious/">
+    <img alt="Translation Status" src="https://hosted.weblate.org/widgets/invidious/-/translations/svg-badge.svg">
+  </a>
+  <a href="https://github.com/humanetech-community/awesome-humane-tech">
+    <img alt="Awesome Humane Tech" src="https://raw.githubusercontent.com/humanetech-community/awesome-humane-tech/main/humane-tech-badge.svg?sanitize=true">
+  </a>
 
----
+  <h3>An open source alternative front-end to YouTube</h3>
 
-## Invidious instances:
+  <a href="https://instances.invidious.io/">Instances list</a>
+  &nbsp;•&nbsp; 
+  <a href="#documentation">Documentation</a>
+  &nbsp;•&nbsp;
+  <a href="#contribute">Contribute</a>
+  &nbsp;•&nbsp;
+  <a href="#donate">Donate</a>
   
-Public Invidious instances are listed on the documentation website: https://instances.invidious.io/
+  <h5>Chat with us:</h5>
+  <a href="https://matrix.to/#/#invidious:matrix.org">
+    <img alt="Matrix" src="https://img.shields.io/matrix/invidious:matrix.org?label=Matrix&color=darkgreen">
+  </a>
+  <a href="https://web.libera.chat/?channel=#invidious">
+    <img alt="Libera.chat (IRC)" src="https://img.shields.io/badge/IRC%20%28Libera.chat%29-%23invidious-darkgreen">
+  </a>
+</div>
 
----
 
-## Invidious features:
+## Screenshots
 
-- [Copylefted libre software](https://github.com/iv-org/invidious) (AGPLv3+ licensed)
+| Player                              | Preferences                         | Subscriptions                         |
-- Lightweight (the homepage is ~4 KB compressed)
+|-------------------------------------|-------------------------------------|---------------------------------------|
+| ![](screenshots/01_player.png)      | ![](screenshots/02_preferences.png) | ![](screenshots/03_subscriptions.png) |
+| ![](screenshots/04_description.png) | ![](screenshots/05_preferences.png) | ![](screenshots/06_subscriptions.png) |
+
+
+## Features
+
+**User features**
+- Lightweight
 - No ads
 - No tracking
-- Javascript is 100% optional
+- No JavaScript required
-- Tools for managing subscriptions:
+- Light/Dark themes
-  - Only show unseen videos
+- Customizable homepage
-  - Only show latest (or latest unseen) video from each channel
+- Subscriptions independant from Google
-  - Delivers notifications from all subscribed channels
+- Notifications for all subscribed channels
-  - Automatically redirect homepage to feed
+- Audio-only mode (with background play on mobile)
-  - Import subscriptions from YouTube
+- Support for Reddit comments
-- Audio-only mode (and no need to keep window open on mobile)
+- [Available in many languages](locales/), thanks to [our translators](#contribute)
-- Dark mode
+
-- Embed support
+**Data import/export**
-- Set default player options (speed, quality, autoplay, loop)
+- Import subscriptions from YouTube, NewPipe and Freetube
-- Support for Reddit comments in place of YouTube comments
+- Import watch history from NewPipe
-- Import/Export subscriptions, watch history, preferences
+- Export subscriptions to NewPipe and Freetube
+- Import/Export Invidious user data
+
+**Technical features**
+- Embedded video support
 - [Developer API](https://docs.invidious.io/API.md)
-- Does not use any of the official YouTube APIs
+- Does not use official YouTube APIs
-- No need to create a Google account to save subscriptions
+- No Contributor License Agreement (CLA)
-- No Code of Conduct
-- No Contributor license Agreement
-- Available in many languages, thanks to [Weblate](https://hosted.weblate.org/projects/invidious/)
 
----
 
-## Screenshots:
+## Quick start
 
-| Player                                                                                                                  | Preferences                                                                                                             | Subscriptions                                                                                                               |
+**Using invidious:**
-| ----------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------- |
-| [<img src="screenshots/01_player.png?raw=true" height="140" width="280">](screenshots/01_player.png?raw=true)           | [<img src="screenshots/02_preferences.png?raw=true" height="140" width="280">](screenshots/02_preferences.png?raw=true) | [<img src="screenshots/03_subscriptions.png?raw=true" height="140" width="280">](screenshots/03_subscriptions.png?raw=true) |
-| [<img src="screenshots/04_description.png?raw=true" height="140" width="280">](screenshots/04_description.png?raw=true) | [<img src="screenshots/05_preferences.png?raw=true" height="140" width="280">](screenshots/05_preferences.png?raw=true) | [<img src="screenshots/06_subscriptions.png?raw=true" height="140" width="280">](screenshots/06_subscriptions.png?raw=true) |
 
----
+- [Select a public instance from the list](https://instances.invidious.io) and start watching videos right now!
 
-## Donate:
+**Hosting invidious:**
 
-Bitcoin (BTC): [bc1qfhe7rq3lqzuayzjxzyt9waz9ytrs09kla3tsgr](bitcoin:bc1qfhe7rq3lqzuayzjxzyt9waz9ytrs09kla3tsgr)
+- [Follow the installation instructions](https://docs.invidious.io/Installation.md)
 
-Monero (XMR): [41nMCtek197boJtiUvGnTFYMatrLEpnpkQDmUECqx5Es2uX3sTKKWVhSL76suXsG3LXqkEJBrCZBgPTwJrDp1FrZJfycGPR](monero:41nMCtek197boJtiUvGnTFYMatrLEpnpkQDmUECqx5Es2uX3sTKKWVhSL76suXsG3LXqkEJBrCZBgPTwJrDp1FrZJfycGPR)
 
----
+## Documentation
 
-## Documentation:
+The full documentation can be accessed online at https://docs.invidious.io/
 
-The complete documentation is available on https://docs.invidious.io/ (or alternatively on its own [Github repository](https://github.com/iv-org/documentation)).
+The documentation's source code is available in this repository:
+https://github.com/iv-org/documentation
 
----
+### Extensions
 
-## Extensions:
+We highly recommend the use of [Privacy Redirect](https://github.com/SimonBrazell/privacy-redirect#get),
+a browser extension that automatically redirects Youtube URLs to any Invidious instance and replaces
+embedded youtube videos on other websites with invidious.
 
-[Extensions](https://docs.invidious.io/Extensions.md) can be found in the wiki, as well as documentation for integrating it into other projects.
+The documentation contains a list of browser extensions that we recommended to use along with Invidious.
 
----
+You can read more here: https://docs.invidious.io/Extensions.md
 
-## Made with Invidious:
+
+## Contribute
+
+### Code
+
+1.  Fork it ( https://github.com/iv-org/invidious/fork ).
+1.  Create your feature branch (`git checkout -b my-new-feature`).
+1.  Stage your files (`git add .`).
+1.  Commit your changes (`git commit -am 'Add some feature'`).
+1.  Push to the branch (`git push origin my-new-feature`).
+1.  Create a new pull request ( https://github.com/iv-org/invidious/compare ).
+
+### Translations
+
+We use [Weblate](https://weblate.org) to manage Invidious translations.
+
+You can suggest new translations and/or correction here: https://hosted.weblate.org/engage/invidious/.
+
+Creating an account is not required, but recommended, especially if you want to contribute regularly.
+Weblate also allows you to log-in with major SSO providers like Github, Gitlab, BitBucket, Google, ...
+
+
+## Projects using Invidious
 
 - [FreeTube](https://github.com/FreeTubeApp/FreeTube): A libre software YouTube app for privacy.
 - [CloudTube](https://sr.ht/~cadence/tube/): A JavaScript-rich alternate YouTube player.
@@ -75,33 +135,21 @@ The complete documentation is available on https://docs.invidious.io/ (or altern
 - [MusicPiped](https://github.com/deep-gaurav/MusicPiped): A material design music player that streams music from YouTube.
 - [HoloPlay](https://github.com/stephane-r/HoloPlay): Funny Android application connecting on Invidious API's with search, playlists and favoris.
 
----
 
-## Contributing:
+## Donate
 
-[![Build Status](https://github.com/iv-org/invidious/workflows/Invidious%20CI/badge.svg)](https://github.com/iv-org/invidious/actions) [![Translation Status](https://hosted.weblate.org/widgets/invidious/-/translations/svg-badge.svg)](https://hosted.weblate.org/engage/invidious/)
+Bitcoin (BTC): [bc1qfhe7rq3lqzuayzjxzyt9waz9ytrs09kla3tsgr](bitcoin:bc1qfhe7rq3lqzuayzjxzyt9waz9ytrs09kla3tsgr)
 
-1.  Fork it ( https://github.com/iv-org/invidious/fork ).
+Monero (XMR): [41nMCtek197boJtiUvGnTFYMatrLEpnpkQDmUECqx5Es2uX3sTKKWVhSL76suXsG3LXqkEJBrCZBgPTwJrDp1FrZJfycGPR](monero:41nMCtek197boJtiUvGnTFYMatrLEpnpkQDmUECqx5Es2uX3sTKKWVhSL76suXsG3LXqkEJBrCZBgPTwJrDp1FrZJfycGPR)
-2.  Create your feature branch (git checkout -b my-new-feature).
-3.  Commit your changes (git commit -am 'Add some feature').
-4.  Push to the branch (git push origin my-new-feature).
-5.  Create a new pull request.
 
-### Translation:
 
-- Log in with an account you have elsewhere, or register an account and start translating at [Hosted Weblate](https://hosted.weblate.org/engage/invidious/).
+## Liability
 
----
+We take no responsibility for the use of our tool, or external instances
-
+provided by third parties. We strongly recommend you abide by the valid
-## Contact:
+official regulations in your country. Furthermore, we refuse liability
-
+for any inappropriate use of Invidious, such as illegal downloading.
-Feel free to join our [Matrix room](https://matrix.to/#/#invidious:matrix.org).
+This tool is provided to you in the spirit of free, open software.
-
----
-
-## Liability:
-
-We take no responsibility for the use of our tool, or external instances provided by third parties. We strongly recommend you abide by the valid official regulations in your country. Furthermore, we refuse liability for any inappropriate use of Invidious, such as illegal downloading. This tool is provided to you in the spirit of free, open software.
 
 You may view the LICENSE in which this software is provided to you [here](./LICENSE).