From 915730aed94c8359bb8157598c7e54ee2da7e570 Mon Sep 17 00:00:00 2001
From: Tomas Valenta <valenta.and.thomas@gmail.com>
Date: Thu, 28 Jul 2022 17:28:07 +0000
Subject: [PATCH] Tweak blue; Update readme

---
 README.md                                     | 23 ++++++++-----------
 .../CodeBlock/VideoPlayer/styles.module.css   |  2 +-
 2 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/README.md b/README.md
index cd7f30e..34e263d 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,5 @@
 # Devbook Docusaurus Video Plugin
-The Devbook Docusaurus plugin allows you to attach videos to code blocks in your [Docusaurus](https://docusaurus.io/) docs.
-
-## Demo
-Check the [demo](./example/) here.
+The Devbook Docusaurus video plugin allows you to attach videos to code blocks in your [Docusaurus](https://docusaurus.io/) docs.
 
 ## Usage
 Install plugin:
@@ -18,7 +15,7 @@ module.exports = {
 ```
 
 ### Add video to a code snippet
-In the **Markdown** add `youtubeID` attribute to the code block:
+In **Markdown** add `youtubeID` attribute to the code block:
 
     ```js youtubeID=4HGNqFdaD34
     function main() {
@@ -26,7 +23,7 @@ In the **Markdown** add `youtubeID` attribute to the code block:
     }
     ```
 
-If you are using **MDX/JSX/TSX** `CodeBlock` add the `youtubeID` prop:
+If you are using **MDX/JSX/TSX** [`CodeBlock`](https://docusaurus.io/docs/markdown-features/code-blocks) add the `youtubeID` prop:
 
 ```jsx
 import CodeBlock from '@theme/CodeBlock';
@@ -35,13 +32,13 @@ import MyComponentSource from '!!raw-loader!./myComponent';
 <CodeBlock youtubeID="4HGNqFdaD34" language="jsx">{MyComponentSource}</CodeBlock>
 ```
 
-> You need to pass just the YouTube video ID, not the whole URL. You can get the ID from the normal URL - `https://www.youtube.com/watch?v=`**`[youtubeID]`**, or from the embed URL - `https://www.youtube.com/embed/`**`[youtubeID]`**.
+> You need to pass just the YouTube video ID, not the whole URL. You can get the ID from the normal video URL - `https://www.youtube.com/watch?v=`**`[youtubeID]`**, or from the embed URL - `https://www.youtube.com/embed/`**`[youtubeID]`**.
 
-### Add code highlights at set video timestamps
-The highlight attribute is in the format `start-end=(range)`.
+### Add code highlights at video timestamps
+The video highlights are in the format `start-end=(range)`.
 The start and the end timestamps are in the `H:M:S` format and the hours are optional (`M:S`).
 
-In the **Markdown** add highlight attributes to the code block:
+In **Markdown** add highlight attributes to the code block:
 
     ```js youtubeID=4HGNqFdaD34 0:10-1:00=(1) 1:10-1:20=(1,2-3)
     function main() {
@@ -49,7 +46,7 @@ In the **Markdown** add highlight attributes to the code block:
     }
     ```
 
-If you are using **MDX/JSX/TSX** `CodeBlock` add the attributes as props:
+If you are using **MDX/JSX/TSX** [`CodeBlock`](https://docusaurus.io/docs/markdown-features/code-blocks) add the highlight attributes as props:
 
 ```jsx
 import CodeBlock from '@theme/CodeBlock';
@@ -58,9 +55,9 @@ import MyComponentSource from '!!raw-loader!./myComponent';
 <CodeBlock youtubeID="4HGNqFdaD34" "0:10-1:00"="(1)" "1:10-1:20"="(1,2-3)" language="jsx">{MyComponentSource}</CodeBlock>
 ```
 
-> The highlight range format is the same as in the Docusaurus code blocks - https://docusaurus.io/docs/markdown-features/code-blocks#highlighting-with-metadata-string, just with the `()` parentheses instead of the `{}` parentheses.
+> The highlight range format is the same as in the [Docusaurus code blocks]( https://docusaurus.io/docs/markdown-features/code-blocks#highlighting-with-metadata-string), just with the `()` parentheses instead of the `{}` parentheses.
 
-> You can change the video line highlight style by customizing the `docusaurus-highlight-code-line` class - the same way you would change the default Docusaurus highlight style.
+> You can change the video line highlight style by customizing the `docusaurus-highlight-code-line` class - the same way you would change the [default Docusaurus highlight style](https://docusaurus.io/docs/markdown-features/code-blocks#line-highlighting).
 
 ## Supported video sources
 - YouTube
diff --git a/src/theme/CodeBlock/VideoPlayer/styles.module.css b/src/theme/CodeBlock/VideoPlayer/styles.module.css
index 78b9d5f..ea3a7b7 100644
--- a/src/theme/CodeBlock/VideoPlayer/styles.module.css
+++ b/src/theme/CodeBlock/VideoPlayer/styles.module.css
@@ -47,7 +47,7 @@
   -ms-user-select: none;
 
   height: 100%;
-  filter: brightness(0.8) blur(3px);
+  filter: brightness(0.9) blur(2px);
 }
 
 .play {