Update docs

README.md

@@ -1,134 +1,122 @@
 
 # Markdown Viewer / Browser Extension
 
-**Install: [Chrome]** / **[Firefox]** / **[Opera]** / **[Edge]**
-
+**Install: [Chrome]** / **[Firefox]** / **[Edge]** / **[Opera]**  / **[Brave]** / **[Chromium]** / **[Vivaldi]**
 
 # Features
 
-- Renders local and remote URLs
+- Secure by design
+- Render local and remote file URLs
 - Granular access to remote origins
 - Multiple markdown parsers
-- Full control over the [compiler options](#compiler-options) ([marked][marked] or [remark][remark])
-- Themes (including [GitHub theme][themes0]) ([jasonm23][themes1], [mixu][themes2], [cobalt][themes3])
-- [GitHub Flavored Markdown][gfm] (GFM)
+- Full control over the compiler options ([marked][marked], [remark][remark])
+- 30+ Themes ([cleanrmd], [GitHub][github-theme])
+- GitHub Flavored Markdown (GFM)
 - Auto reload on file change
 - Syntax highlighted code blocks ([prism][prism])
-- Table of Contents (TOC)
-- [MathJax][mathjax] support
-- [Mermaid][mermaid] support
-- Emoji support (Icons provided free by [EmojiOne][emojione])
-- Remembers scroll position
+- Table of Contents (ToC)
+- MathJax formulas ([mathjax])
+- Mermaid diagrams ([mermaid])
+- Convert emoji shortnames (icons provided free by [EmojiOne][emojione])
+- Remember scroll position
 - Markdown Content-Type detection
-- URL detection using RegExp
-- Toggle Content Security Policy (CSP)
-- Override page encoding
+- Configurable Markdown file path detection
 - Settings synchronization
 - Raw and rendered markdown views
-- Built as [event page][event-page]
 - Free and Open Source
 
-
 # Table of Contents
 
 - **[After Install](#after-install)**
-  - [Local Files](#local-files) / [Remote Files](#remote-files)
 - **[Compiler Options](#compiler-options)**
-  - [Marked](#marked) / [Remark](#remark)
 - **[Content Options](#content-options)**
-  - [Autoreload](#autoreload) / [TOC](#toc) / [MathJax](#mathjax) / [Emoji](#emoji) / [Scroll](#scroll)
-- **[Advanced Options](#advanced-options)**
-  - [Add Origin](#add-origin) / [Allow All Origins](#allow-all-origins)
-  - [Header Detection](#header-detection) / [Path Matching](#path-matching) / [Path Matching Priority](#path-matching-priority)
-  - [Remove Origin](#remove-origin) / [Refresh Origin](#refresh-origin)
-  - [Disable CSP](#disable-content-security-policy) / [Character Encoding](#character-encoding)
-- **[Markdown Syntax and Features](#markdown-syntax-and-features)**
-- **[More Compilers](#more-compilers)**
-
+- **[Themes](#themes)**
+- **[Manage Origins](#manage-origins)**
+- **[Markdown Detection](#markdown-detection)**
+- **[Syntax Examples](#syntax-examples)**
 
 # After Install
 
 ## Local Files
 
 1. Navigate to `chrome://extensions`
-2. Locate Markdown Viewer and click on the `DETAILS` button
+2. Locate the Markdown Viewer extension and click on the `Details` button
 3. Make sure that the `Allow access to file URLs` switch is turned on
 
-![file-urls]
-
-> Navigate to `file:///` in your browser and locate the markdown files that you want to read
-
+![img-extensions]
+![img-file-access]
 
 ## Remote Files
 
-1. Click on the Markdown Viewer icon and select [Advanced Options](#advanced-options)
+1. Click on the Markdown Viewer icon and select [Advanced Options](#manage-origins)
 2. Add the origins that you want enabled for the Markdown Viewer extension
 
+---
 
 # Compiler Options
 
-## Marked
+Markdown Viewer can be used with any markdown parser/compiler. Currently the following compilers are supported: [marked], [remark], [showdown], [markdown-it], [remarkable], [commonmark], and officially it ships with Marked and Remark:
 
-Option          | Default | Description
-:---            | :---    | :---
-**breaks**      | `false` | Enable GFM [line breaks][gfm]. This option requires the gfm option to be true.
-**gfm**         | `true`  | Enable GFM [GitHub Flavored Markdown][gfm].
-**pedantic**    | `false` | Conform to obscure parts of markdown.pl as much as possible. Don't fix any of the original markdown bugs or poor behavior.
-**sanitize**    | `false` | Sanitize the output. Ignore any HTML that has been input.
-**smartLists**  | `false` | Use smarter list behavior than the original markdown. May eventually be default with the old behavior moved into pedantic.
-**smartypants** | `false` | Use "smart" typographic punctuation for things like quotes and dashes.
+## Marked
 
+| Option          | Default | Description
+| :-              | :-:     | :-
+| **breaks**      | `false` | Enable [GFM] line breaks. This option requires the gfm option to be true.
+| **gfm**         | `true`  | Enable [GFM] GitHub Flavored Markdown.
+| **pedantic**    | `false` | Conform to obscure parts of markdown.pl as much as possible. Don't fix any of the original markdown bugs or poor behavior.
+| **sanitize**    | `false` | Sanitize the output. Ignore any HTML that has been input.
+| **smartypants** | `false` | Use "smart" typographic punctuation for things like quotes and dashes.
 
 ## Remark
 
-Option          | Default | Description
-:---            | :---    | :---
-**breaks**      | `false` | Enable GFM [line breaks][gfm]. This option requires the gfm option to be true.
-**footnotes**   | `false` | Toggle reference footnotes and inline footnotes.
-**gfm**         | `true`  | Enable GFM [GitHub Flavored Markdown][gfm].
-**sanitize**    | `false` | Sanitize the output. Ignore any HTML that has been input.
+| Option          | Default | Description
+| :-              | :-:     | :-
+| **breaks**      | `false` | Enable [GFM] line breaks. This option requires the gfm option to be true.
+| **gfm**         | `true`  | Enable [GFM] GitHub Flavored Markdown.
+| **sanitize**    | `false` | Sanitize the output. Ignore any HTML that has been input.
 
+For any other supported compiler that you may want to use, follow the [Manual Install](#manual-install) steps.
 
-# Content Options
+---
 
-Option          | Default | Description
-:---            | :---    | :---
-**autoreload**  | `false` | Auto reload on file change
-**toc**         | `false` | Generate Table of Contents
-**mathjax**     | `false` | Render TeX and LaTeX math blocks
-**mermaid**     | `false` | Render Mermaid diagrams
-**emoji**       | `false` | Convert emoji :shortnames: into EmojiOne images
-**scroll**      | `true`  | Remember scroll position
+# Content Options
 
+| Option          | Default | Description
+| :-              | :-:     | :-
+| **autoreload**  | `false` | Auto reload on file change
+| **toc**         | `false` | Generate Table of Contents
+| **syntax**      | `true`  | Syntax highlighted fenced code blocks
+| **mathjax**     | `false` | Render MathJax formulas
+| **mermaid**     | `false` | Render Mermaid diagrams
+| **emoji**       | `false` | Convert emoji :shortnames: into EmojiOne images
+| **scroll**      | `true`  | Remember scroll position
 
 ## Autoreload
 
-When enabled the extension will make a GET request every second to:
+When enabled the extension will make a GET request every second to markdown files hosted on:
 
-- `file://` URLs
+- `file:///` URLs
 - any host that resolves to localhost IPv4 `127.0.0.1` or IPv6 `::1`
 
+## Emoji
 
-## TOC
-
-- Generates Table of Contents (TOC) based on the headers found in the markdown document.
+Convert emoji :shortnames: into EmojiOne images:
 
+- Emoji shortnames like: `:sparkles:` will be converted to :sparkles: using EmojiOne images.
+- Currently unicode symbols like `✨` and ASCII emoji like `:D` are not supported.
 
 ## MathJax
 
-The following `mathjax` delimiters are supported:
+The following MathJax delimiters are supported:
 
 - inline math: `\(math\)` and `$math$`
 - display math: `\[math\]` and `$$math$$`
 
-The following rules apply to your content when `mathjax` is enabled:
+The following rules apply to your markdown content when MathJax is enabled:
 
 - Regular dollar sign `$` in text that is not part of a math formula should be escaped: `\$`
 - Regular markdown escaping for parentheses: `\(` and `\)`, and brackets: `\[` and `\]` is not supported. MathJax will convert anything between these delimiters to math formulas, unless they are wrapped in backticks: `` `\(` `` or fenced code blocks.
 
-> The MathJax support currently works only on local file URLs and remote origins without strict *Content Security Policy (CSP)* set. For example it won't work for files hosted on the GitHub's `raw.githubusercontent.com` origin. However you can bypass this by enabling the [Disable CSP](#disable-content-security-policy) switch for that origin.
-
-
 ## Mermaid
 
 Render Mermaid diagrams wrapped in `mmd` or `mermaid` fenced code blocks:
@@ -137,208 +125,234 @@ Render Mermaid diagrams wrapped in `mmd` or `mermaid` fenced code blocks:
     sequenceDiagram
     ```
 
-## Emoji
+## Scroll
 
-- Emoji shortnames like: `:sparkles:` will be converted to :sparkles: using [EmojiOne][emojione] images.
-- Currently unicode symbols like `✨` and ASCII emoji like `:D` are not supported.
+Remember scroll position:
 
-> The Emoji support currently works only on local file URLs and remote origins without strict *Content Security Policy (CSP)* set. For example it won't work for files hosted on the GitHub's `raw.githubusercontent.com` origin. However you can bypass this by enabling the [Disable CSP](#disable-content-security-policy) switch for that origin.
+- When enabled, the `scroll` option remembers the current scroll position and scrolls back to it after page reload.
+- When disabled, the `scroll` option will either scroll to the top of the document or to a certain header (anchor) if a hash URL fragment was present.
 
+## Syntax
 
-## Scroll
+Syntax highlighting for fenced code blocks:
 
-- When enabled, the `scroll` option remembers the current scroll position and scrolls back to it after page load.
-- When disabled, the `scroll` option either scrolls to the top of the document or to a certain header (anchor) if a hash URL fragment is present.
+    ```js
+    var hello = 'hi'
+    ```
 
+The full list of enabled languages and their names can be found [here][prism-lang].
 
-# Advanced Options
+## ToC
 
-Detecting and rendering [local file URLs](#local-files) can be enabled by using the `Allow access to file URLs` option for the extension.
+Generates Table of Contents (ToC) based on the headers found in the markdown document.
 
-Access to remote URLs however, needs to be enabled manually.
+---
 
+# Themes
 
-## Add Origin
+All themes support the following width options:
+
+- `auto` - automatically adjust the content width based on the screen size
+- `full` - 100% screen width
+- `wide` - fixed at 1400px
+- `large` - fixed at 1200px
+- `medium` - fixed at 992px
+- `small` - fixed at 768px
+- `tiny` - fixed at 576px
+
+The `auto` option on the `github` and `github-dark` themes has a fixed width with a surrounding border identical to a rendered README.md file for a repository on github.com
+
+---
 
-Here is how you can enable the extension for the `https://raw.githubusercontent.com` origin:
+# Manage Origins
+
+Access to [local file URLs](#local-files) can be enabled by using the `Allow access to file URLs` option for the extension.
+
+Access to remote origins, however, have to be enabled explicitly.
+
+## Add Origin
 
-![add-origin]
+Here is how you can enable the extension on the `https://raw.githubusercontent.com` origin:
 
-The origin consists of *protocol* part and *domain* part. The *protocol* can be either `https`, `http`, or a `*` to match both `https` and `http`.
+![img-add-origin]
 
+The origin consists of a *protocol* and a *domain* part. The *protocol* can be either `https`, `http`, or a `*` to match both `https` and `http`.
 
 ## Allow All Origins
 
 In case you really want to you can enable the extension for **all** origins:
 
-![all-origins]
+![img-all-origins]
 
 Alternatively you can use the `Allow All` button.
 
-> **Note:** Take a look at the [Path Matching Priority](#path-matching-priority) section below to see how the Markdown content is being included for or excluded from rendering!
+Take a look at the [Path Matching Priority](#path-matching-priority) section below on how the Markdown content can be included for or excluded from rendering when access to all origins is enabled!
+
+## Remove Origin
+
+Click on the `REMOVE` button for the origin that you want to remove. This removes the permission itself so that the extension no longer has access to that origin.
+
+## Refresh Origin
+
+The extension synchronizes your preferences across all of your devices using Google Sync. The list of your allowed origins is being synced too. However, the actual permissions that you grant using the Chrome's consent popup cannot be synced.
+
+In case you have added a new origin on some of your devices you will have to explicitly allow it on your other devices. In this case an additional **`refresh`** label will be shown on each origin that needs to be _refreshed_. This label will be present only on those devices and origins that needs to be _refreshed_, meaning currently the extension does not have access to those origins. Expanding the origin will reveal an additional `REFRESH` button:
+
+![img-refresh-origin]
 
+---
+
+# Markdown Detection
+
+Markdown Viewer can only access explicitly allowed remote origins and the file origin, if enabled. However, not all content served on those origins will be a Markdown file.
 
 ## Header Detection
 
-When this option is enabled the extension will check for the presence of the `text/markdown` and `text/x-markdown` *content-type* header before trying to match the path:
+When this option is enabled the extension will check for the existence of the `text/markdown` and `text/x-markdown` *content-type* header before trying to match the path:
 
 ![header-detection]
 
-
 ## Path Matching
 
 If the header detection is disabled or a proper *content-type* header is missing, the extension will check if the URL is ending with a markdown file extension.
 
 The default regular expression is: `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
-It's a simple regular expression that matches URLs ending with:
+It is a simple regular expression that matches URLs ending with:
 
 - markdown file extension: `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)`
-- and optionally anchor or querystring after that: `(?:#.*|\?.*)?`
+- and optionally a hash or a querystring after that: `(?:#.*|\?.*)?`
 
 > The `?:` used in `(?:match)` stands for *non-capturing group* and it's there for performance reasons.
 
 You can modify the path matching regular expression for each enabled origin individually. The settings are being updated as you type.
 
-
 ## Path Matching Priority
 
-The enabled origins are matched from most specific to least specific:
+The enabled origins are matched from most to least specific:
 
 1. `https://raw.githubusercontent.com` or `http://raw.githubusercontent.com`
 2. `*://raw.githubusercontent.com`
 3. `*://*`
 
-Only the first matching origin is picked and then its Path Matching RegExp is used to match the entire URL. If it fails no other attempts are made to match the URL.
+Only the first matching origin is picked and then its Path Matching RegExp is used to match the entire URL. If it fails then no other attempts are being made to match the URL.
+
+> It is recommended to explicitly allow only the origins that you want the extension to have access to.
 
 ### Custom Path
 
-- __`*://website.com`__ - `\/some\/custom\/path\/to\/serve\/markdown\/$`
-- __`*://*`__ - `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
+- **`*://website.com`** - specific origin with custom Path Matching RegExp:<br>
+  `\/some\/custom\/path\/to\/serve\/markdown\/$`
 
-In this example we have allowed all origins (the last entry). It uses the default Path Matching RegExp that is going to match only URLs ending with markdown file extension.
+- **`*://*`** - match all origins using the default Path Matching RegExp:<br>
+  `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
-In case we want to match a custom path we have to add a more specific origin and specify its Path Matching RegExp accordingly.
+In case we want to match a custom path we have to add a more specific origin and set its Path Matching RegExp accordingly.
 
 ### Exclude Origin
 
-- __`*://github.com`__ - `something impossible to match !!!`
-- __`*://*`__ - `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
+- **`*://github.com`** - specific origin with invalid Path Matching RegExp:<br>
+  `something impossible to match !!!`
 
-In this example we have allowed all origins (the last entry). It uses the default Path Matching RegExp that is going to match only URLs ending with markdown file extension.
+- **`*://*`** - match all origins using the default Path Matching RegExp:<br>
+  `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
-The problem is that some origins may serve rendered HTML content on URLs ending with markdown file extension.
+Some origins may serve rendered HTML content on URLs ending with markdown file extension:
 
 GitHub:
-- https://github.com/simov/markdown-syntax/blob/master/README.md - *HTML*
-- https://raw.githubusercontent.com/simov/markdown-syntax/master/README.md - *Markdown*
+- https://github.com/simov/markdown-syntax/blob/main/README.md - *HTML*
+- https://raw.githubusercontent.com/simov/markdown-syntax/main/README.md - *Markdown*
 
-In this case we want to exclude the `github.com` origin altogether and for that we have to add more specific origin and set its Path Matching RegExp to something that's impossible to match.
+In this case we want to exclude the `github.com` origin altogether and for that we have to add a more specific origin and set its Path Matching RegExp to something that's impossible to match.
 
 ### Exclude Path
 
-- __`*://bitbucket.org`__ - `.*\/raw\/.*\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
-- __`*://gitlab.com`__ - `.*\/raw\/.*\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
-- __`*://*`__ - `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
+- **`*://bitbucket.org`** - specific origin with custom Path Matching RegExp:<br>
+  `.*\/raw\/.*\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
-In this example we have allowed all origins (the last entry). It uses the default Path Matching RegExp that is going to match only URLs ending with markdown file extension.
+- **`*://gitlab.com`** - specific origin with custom Path Matching RegExp:<br>
+  `.*\/raw\/.*\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
-The problem is that some origins may serve rendered HTML content on URLs ending with markdown file extension.
+- **`*://*`** - match all origins using the default Path Matching RegExp:<br>
+  `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
+
+Some origins may serve rendered HTML content on URLs ending with markdown file extension:
 
 BitBucket:
-- https://bitbucket.org/simovelichkov/markdown-syntax/src/master/README.md - *HTML*
-- https://bitbucket.org/simovelichkov/markdown-syntax/raw/master/README.md - *Markdown*
+- https://bitbucket.org/simovelichkov/markdown-syntax/src/main/README.md - *HTML*
+- https://bitbucket.org/simovelichkov/markdown-syntax/raw/main/README.md - *Markdown*
 
 GitLab:
-- https://gitlab.com/simovelichkov/markdown-syntax/blob/master/README.md - *HTML*
-- https://gitlab.com/simovelichkov/markdown-syntax/raw/master/README.md - *Markdown*
-
-In this case we want to match only URLs containing the `raw` word in their path and for that we have to add more specific origins and set their Path Matching RegExp accordingly.
-
-
-## Remove Origin
-
-At any point click on the `REMOVE` button for the origin that you want to remove. This actually removes the permission itself so that the extension is no longer able to inject code into that origin.
-
-Note that the Chrome's consent popup shows up only when you add the origin for the first time. In case you re-add it you'll no longer see that popup. That's a Chrome thing and it's not controllable through the extension.
-
-
-## Refresh Origin
-
-The extension synchronizes your preferences across all of your devices using Google Sync. The list of your allowed origins is being synced too. However, the actual permissions that you grant using the Chrome's consent popup cannot be synced.
-
-In case you've recently added a new origin on one of your devices you'll have to explicitly allow it on your other devices. In this case additional **`refresh`** label will be shown for each origin that needs to be _refreshed_. This label is present **only** on those devices that needs to be _refreshed_. Expanding the origin will reveal additional `REFRESH` button:
+- https://gitlab.com/simovelichkov/markdown-syntax/blob/main/README.md - *HTML*
+- https://gitlab.com/simovelichkov/markdown-syntax/raw/main/README.md - *Markdown*
 
-![refresh-origin]
+In this case we want to match Markdown files only when their path contains the `raw` word, and for that we have to add a more specific origin and update its Path Matching RegExp accordingly.
 
+---
 
-## Disable Content Security Policy
+# Syntax Examples
 
-Some remote origins may serve its content with a `content-security-policy` header set that prevents the extension from executing certain JavaScript code inside the content of that page. For example on `raw.githubusercontent.com` certain things such as remembering your scroll position, generating TOC, displaying MathJax or Emojis won't work.
+A separate repository containing examples about the Markdown syntax and all features available in Markdown Viewer can be found on [GitHub][syntax-github], [GitLab][syntax-gitlab] and [BitBucket][syntax-bitbucket]:
 
-Using the `Disable Content Security Policy` switch you can optionally tell the extension to strip that header from the incoming request and therefore allow its full functionality to work:
+- **elements.md** - quick overview of the Markdown syntax and all features available in Markdown Viewer
+- **syntax.md** - extensive list of Markdown syntax examples with different combinations and edge cases
+- **prism.md** - syntax highlighting examples, for the full list of currently supported languages take a look at [this file][prism-lang]
+- **mermaid.md** - different types of Mermaid diagrams
+- **mathjax.md** - MathJax examples and support documentation
 
-![disable-csp]
+Allow the appropriate remote origin and update its path matching regexp if needed:
 
-Note that the Content Security Policy header will be stripped **only** if the URL matches the corresponding [Path Matching RegExp](#path-matching) for that origin.
+- **`raw.githubusercontent.com`** using the default Path Matching RegExp:<br>
+  `\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
-Even if you have [Allowed All Origins](#allow-all-origins) and disabled the Content Security Policy at the same time, the header will be stripped **only** for those requests with URL that matches your explicitly set [Path Matching RegExp](#path-matching) for the Allow All origin `*://*`
+- **`bitbucket.org`** only paths containing the `raw` word and ending with the default Path Matching RegExp:<br>
+  `.*\/raw\/.*\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
+- **`gitlab.com`** only paths containing the `raw` word and ending with the default Path Matching RegExp:<br>
+  `.*\/raw\/.*\.(?:markdown|mdown|mkdn|md|mkd|mdwn|mdtxt|mdtext|text)(?:#.*|\?.*)?$`
 
-## Character Encoding
-
-By default Markdown Viewer uses the browser's built-in encoding detection. In case you want to force certain Character Encoding for an origin - use the Encoding select control.
-
-The Character Encoding set for origin is used only when the markdown content is served with explicit `Content-Type` header and explicit `charset`. In all other cases Chrome picks the correct encoding by default.
-
-In Firefox the character encoding is set always when enabled.
-
-
-# Markdown Syntax and Features
-
-A separate repository containing examples about: markdown syntax, syntax highlighting in code blocks, mathjax etc. is hosted on all major Git hosting providers: [GitHub][syntax-github], [GitLab][syntax-gitlab], [BitBucket][syntax-bitbucket].
-
-Allow the appropriate origin to render the raw markdown files directly on: [GitHub][syntax-raw-github], [GitLab][syntax-raw-gitlab], [BitBucket][syntax-raw-bitbucket], or pull any of these repositories locally and play around with the extension's options.
-
-
-# More Compilers
-
-Markdown Viewer can be used with any markdown parser/compiler. Currently the following compilers are implemented: [marked], [remark], [showdown], [markdown-it], [remarkable], [commonmark], [markdown-js].
-
-1. Clone the [compilers][compilers] branch
-2. Follow the [Manual Install](#manual-install) steps
+Alternatively, pull any of those repositories and access them on the `file:///` origin locally.
 
+---
 
 # Manual Install
 
-## Chrome / Opera
+The following instructions applies for: Chrome, Edge, Opera, Brave, Chromium and Vivaldi.
 
-1. Clone this repository
-2. Navigate to `chrome://extensions`
-3. Make sure that the `Developer mode` checkbox is checked at the top
-4. Disable the Markdown Viewer extension downloaded from the Chrome Store
-5. Click on the `Load unpacked extension...` button and select the cloned directory
+Note that in any of the following cases you won't receive any future updates automatically!
 
-> Note that in this case you won't receive any future updates automatically.
+## Load packed .crx
 
+1. Go to [releases] and pick a release that you want to install
+2. Download the markdown-viewer.crx file
+3. Navigate to `chrome://extensions`
+4. Make sure that the `Developer mode` switch is enabled
+5. Drag and drop the markdown-viewer.crx file into the chrome://extensions page
 
-## Firefox
+## Load unpacked .zip
 
-1. Clone this repository
-2. Rename `manifest.json` to `manifest.chrome.json`, then rename `manifest.firefox.json` to `manifest.json`
-3. Navigate to `about:addons` and disable the Markdown Viewer extension downloaded from Firefox Store
-4. Navigate to `about:debugging#addons`
-5. Click on the `Load Temporary Add-on...` button and select the cloned directory
+1. Go to [releases] and pick a release that you want to install
+2. Download the markdown-viewer.zip file and extract it
+3. Navigate to `chrome://extensions`
+4. Make sure that the `Developer mode` switch is enabled
+5. Click on the `Load unpacked` button and select the extracted directory
 
-> Note that in this case you won't receive any future updates automatically.
+## Build
 
+1. Clone this repository
+2. Execute `sh build/package.sh chrome` (append `compilers` to include all available compilers)
+3. Navigate to `chrome://extensions`
+4. Make sure that the `Developer mode` switch is enabled
+5. Click on the `Load unpacked` button and select the cloned directory
 
-# Opera
-
-You can use the [Opera's official browser extension][opera-extensions] for installing Chrome extensions from Google Chrome Web Store to install Markdown Viewer.
+## Manifest v2
 
-Alternatively you can [install it manually](#manual-install).
+1. Clone the [mv2] or [compilers-mv2] branch (Markdown Viewer v4.0)
+2. Navigate to `chrome://extensions`
+3. Make sure that the `Developer mode` switch is enabled
+4. Click on the `Load unpacked` button and select the cloned directory
 
+---
 
 # License
 
@@ -367,10 +381,11 @@ SOFTWARE.
 
   [chrome]: https://chrome.google.com/webstore/detail/markdown-viewer/ckkdlimhmcjmikdlpkmbgfkaikojcbjk
   [firefox]: https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer-chrome/
-  [opera]: #opera
   [edge]: https://microsoftedge.microsoft.com/addons/detail/markdown-viewer/cgfmehpekedojlmjepoimbfcafopimdg
-  [paypal]: https://www.paypal.me/simeonvelichkov
-  [donate]: https://img.shields.io/badge/paypal-donate-blue.svg?style=flat-square (Donate on Paypal)
+  [opera]: https://chrome.google.com/webstore/detail/markdown-viewer/ckkdlimhmcjmikdlpkmbgfkaikojcbjk
+  [brave]: https://chrome.google.com/webstore/detail/markdown-viewer/ckkdlimhmcjmikdlpkmbgfkaikojcbjk
+  [chromium]: https://chrome.google.com/webstore/detail/markdown-viewer/ckkdlimhmcjmikdlpkmbgfkaikojcbjk
+  [vivaldi]: https://chrome.google.com/webstore/detail/markdown-viewer/ckkdlimhmcjmikdlpkmbgfkaikojcbjk
 
   [marked]: https://github.com/markedjs/marked
   [remark]: https://github.com/remarkjs/remark
@@ -378,32 +393,28 @@ SOFTWARE.
   [markdown-it]: https://github.com/markdown-it/markdown-it
   [remarkable]: https://github.com/jonschlinkert/remarkable
   [commonmark]: https://github.com/commonmark/commonmark.js
-  [markdown-js]: https://github.com/evilstreak/markdown-js
 
   [emojione]: https://emojione.com
   [mathjax]: https://www.mathjax.org
   [mermaid]: https://mermaid-js.github.io/mermaid/
-  [gfm]: https://guides.github.com/features/mastering-markdown/#GitHub-flavored-markdown
-  [themes0]: https://github.com/sindresorhus/github-markdown-css
-  [themes1]: https://github.com/jasonm23/markdown-css-themes
-  [themes2]: https://github.com/mixu/markdown-styles
-  [themes3]: https://github.com/nWODT-Cobalt/markown-utilities
-  [prism]: https://prismjs.com/
-  [gfm-tables]: https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet#tables
+  [prism]: https://prismjs.com
+  [github-theme]: https://github.com/sindresorhus/github-markdown-css
+  [cleanrmd]: https://pkg.garrickadenbuie.com/cleanrmd/#themes
+
+  [gfm]: https://github.github.com/gfm/
   [compilers]: https://github.com/simov/markdown-viewer/tree/compilers
-  [event-page]: https://developer.chrome.com/extensions/background_pages
-  [opera-extensions]: https://addons.opera.com/en/extensions/details/install-chrome-extensions/
+  [releases]: https://github.com/simov/markdown-viewer/releases
+  [mv2]: https://github.com/simov/markdown-viewer/tree/mv2
+  [compilers-mv2]: https://github.com/simov/markdown-viewer/tree/compilers-mv2
+  [prism-lang]: https://github.com/simov/markdown-viewer/blob/main/build/prism/prism.json
 
   [syntax-github]: https://github.com/simov/markdown-syntax
-  [syntax-raw-github]: https://raw.githubusercontent.com/simov/markdown-syntax/master/README.md
   [syntax-gitlab]: https://gitlab.com/simovelichkov/markdown-syntax
-  [syntax-raw-gitlab]: https://gitlab.com/simovelichkov/markdown-syntax/raw/master/README.md
   [syntax-bitbucket]: https://bitbucket.org/simovelichkov/markdown-syntax
-  [syntax-raw-bitbucket]: https://bitbucket.org/simovelichkov/markdown-syntax/raw/master/README.md
 
-  [file-urls]: https://i.imgur.com/MpzsT5g.png
-  [add-origin]: https://i.imgur.com/GnKmkRG.png
-  [all-origins]: https://i.imgur.com/4GH3EuP.png
+  [img-extensions]: https://i.imgur.com/kzullaI.png
+  [img-file-access]: https://i.imgur.com/VVcPv0T.png
+  [img-add-origin]: https://i.imgur.com/GnKmkRG.png
+  [img-all-origins]: https://i.imgur.com/4GH3EuP.png
+  [img-refresh-origin]: https://i.imgur.com/6COtyrP.png
   [header-detection]: https://i.imgur.com/bdz3Reg.png
-  [disable-csp]: https://i.imgur.com/3Qbez1l.png
-  [refresh-origin]: https://i.imgur.com/UYSgelE.png