diff --git a/README.md b/README.md
index bb4c193a..c59297f3 100644
--- a/README.md
+++ b/README.md
@@ -7,15 +7,7 @@
[io-doc]: https://cpp-linter.github.io/cpp-linter-action/inputs-outputs
[recipes-doc]: https://cpp-linter.github.io/cpp-linter-action/examples
-[format-annotations-preview]: https://raw.githubusercontent.com/cpp-linter/cpp-linter-action/main/docs/images/annotations-clang-format.png
-[tidy-annotations-preview]: https://raw.githubusercontent.com/cpp-linter/cpp-linter-action/main/docs/images/annotations-clang-tidy.png
-[thread-comment-preview]: https://raw.githubusercontent.com/cpp-linter/cpp-linter-action/main/docs/images/comment.png
-[step-summary-preview]: https://raw.githubusercontent.com/cpp-linter/cpp-linter-action/main/docs/images/step-summary.png
-[tidy-review-preview]: https://raw.githubusercontent.com/cpp-linter/cpp-linter-action/main/docs/images/tidy-review.png
-[format-review-preview]: https://raw.githubusercontent.com/cpp-linter/cpp-linter-action/main/docs/images/format-review.png
-[format-suggestion-preview]: https://raw.githubusercontent.com/cpp-linter/cpp-linter-action/main/docs/images/format-suggestion.png
-
-
+
# C/C++ Linter Action | clang-format & clang-tidy
@@ -71,49 +63,78 @@ For all explanations of our available input parameters and output variables, see
See also our [example recipes][recipes-doc].
+
## Example
### Annotations
-Using [`file-annotations`][file-annotations]:
+Using [`--file-annotations`][file-annotations]:
#### clang-format annotations
-![clang-format annotations][format-annotations-preview]
+
+
+
+
+
#### clang-tidy annotations
-![clang-tidy annotations][tidy-annotations-preview]
+
+
+
+
+
### Thread Comment
-Using [`thread-comments`][thread-comments]:
+Using [`--thread-comments`][thread-comments]:
-![sample thread-comment][thread-comment-preview]
+
+
+
+
+
### Step Summary
-Using [`step-summary`][step-summary]:
+Using [`--step-summary`][step-summary]:
-![step summary][step-summary-preview]
+
+
+
+
+
### Pull Request Review
-#### Only clang-tidy
-
-Using [`tidy-review`][tidy-review]:
+
+
+
+
+
-![sample tidy-review][tidy-review-preview]
+#### clang-tidy suggestion
-#### Only clang-format
+Using [`--tidy-review`][tidy-review]:
-Using [`format-review`][format-review]:
+
+
+
+
+
-![sample format-review][format-review-preview]
+#### clang-format suggestion
-![sample format-suggestion][format-suggestion-preview]
+Using [`--format-review`][format-review]:
+
+
+
+
+
+
## Add C/C++ Linter Action badge in README
You can show C/C++ Linter Action status with a badge in your repository README
diff --git a/docs/images/annotations-clang-format.png b/docs/images/annotations-clang-format.png
deleted file mode 100644
index 2175c94b..00000000
Binary files a/docs/images/annotations-clang-format.png and /dev/null differ
diff --git a/docs/images/annotations-clang-tidy.png b/docs/images/annotations-clang-tidy.png
deleted file mode 100644
index 1ac02e6c..00000000
Binary files a/docs/images/annotations-clang-tidy.png and /dev/null differ
diff --git a/docs/images/comment.png b/docs/images/comment.png
deleted file mode 100644
index 2c41fcd7..00000000
Binary files a/docs/images/comment.png and /dev/null differ
diff --git a/docs/images/format-annotation-dark.png b/docs/images/format-annotation-dark.png
new file mode 100644
index 00000000..ea637fdd
Binary files /dev/null and b/docs/images/format-annotation-dark.png differ
diff --git a/docs/images/format-annotation-light.png b/docs/images/format-annotation-light.png
new file mode 100644
index 00000000..0335b16d
Binary files /dev/null and b/docs/images/format-annotation-light.png differ
diff --git a/docs/images/format-review-dark.png b/docs/images/format-review-dark.png
new file mode 100644
index 00000000..05ce8a48
Binary files /dev/null and b/docs/images/format-review-dark.png differ
diff --git a/docs/images/format-review-light.png b/docs/images/format-review-light.png
new file mode 100644
index 00000000..718fcbf6
Binary files /dev/null and b/docs/images/format-review-light.png differ
diff --git a/docs/images/format-review.png b/docs/images/format-review.png
deleted file mode 100644
index 30be6b30..00000000
Binary files a/docs/images/format-review.png and /dev/null differ
diff --git a/docs/images/format-suggestion.png b/docs/images/format-suggestion.png
deleted file mode 100644
index 02168619..00000000
Binary files a/docs/images/format-suggestion.png and /dev/null differ
diff --git a/docs/images/review-summary-dark.png b/docs/images/review-summary-dark.png
new file mode 100644
index 00000000..484cfccf
Binary files /dev/null and b/docs/images/review-summary-dark.png differ
diff --git a/docs/images/review-summary-light.png b/docs/images/review-summary-light.png
new file mode 100644
index 00000000..1ad3adac
Binary files /dev/null and b/docs/images/review-summary-light.png differ
diff --git a/docs/images/step-summary-dark.png b/docs/images/step-summary-dark.png
new file mode 100644
index 00000000..6656f95d
Binary files /dev/null and b/docs/images/step-summary-dark.png differ
diff --git a/docs/images/step-summary-light.png b/docs/images/step-summary-light.png
new file mode 100644
index 00000000..a62f0db3
Binary files /dev/null and b/docs/images/step-summary-light.png differ
diff --git a/docs/images/step-summary.png b/docs/images/step-summary.png
deleted file mode 100644
index f23e68d4..00000000
Binary files a/docs/images/step-summary.png and /dev/null differ
diff --git a/docs/images/thread-comment-dark.png b/docs/images/thread-comment-dark.png
new file mode 100644
index 00000000..fc5861fd
Binary files /dev/null and b/docs/images/thread-comment-dark.png differ
diff --git a/docs/images/thread-comment-expanded-dark.png b/docs/images/thread-comment-expanded-dark.png
new file mode 100644
index 00000000..ff3599e3
Binary files /dev/null and b/docs/images/thread-comment-expanded-dark.png differ
diff --git a/docs/images/thread-comment-expanded-light.png b/docs/images/thread-comment-expanded-light.png
new file mode 100644
index 00000000..315b3e63
Binary files /dev/null and b/docs/images/thread-comment-expanded-light.png differ
diff --git a/docs/images/thread-comment-light.png b/docs/images/thread-comment-light.png
new file mode 100644
index 00000000..598d7a3c
Binary files /dev/null and b/docs/images/thread-comment-light.png differ
diff --git a/docs/images/tidy-annotation-dark.png b/docs/images/tidy-annotation-dark.png
new file mode 100644
index 00000000..551af767
Binary files /dev/null and b/docs/images/tidy-annotation-dark.png differ
diff --git a/docs/images/tidy-annotation-light.png b/docs/images/tidy-annotation-light.png
new file mode 100644
index 00000000..e19e2521
Binary files /dev/null and b/docs/images/tidy-annotation-light.png differ
diff --git a/docs/images/tidy-review-dark.png b/docs/images/tidy-review-dark.png
new file mode 100644
index 00000000..64f83bf7
Binary files /dev/null and b/docs/images/tidy-review-dark.png differ
diff --git a/docs/images/tidy-review-light.png b/docs/images/tidy-review-light.png
new file mode 100644
index 00000000..c70130e2
Binary files /dev/null and b/docs/images/tidy-review-light.png differ
diff --git a/docs/images/tidy-review.png b/docs/images/tidy-review.png
deleted file mode 100644
index 8b58a41d..00000000
Binary files a/docs/images/tidy-review.png and /dev/null differ
diff --git a/docs/index.md b/docs/index.md
index 9a55fa3f..4271b345 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -7,16 +7,67 @@
[io-doc]: inputs-outputs.md
[recipes-doc]: examples/index.md
-[format-annotations-preview]: images/annotations-clang-format.png
-[tidy-annotations-preview]: images/annotations-clang-tidy.png
-[thread-comment-preview]: images/comment.png
-[step-summary-preview]: images/step-summary.png
-[tidy-review-preview]: images/tidy-review.png
-[format-review-preview]: images/format-review.png
-[format-suggestion-preview]: images/format-suggestion.png
+{%
+ include "../README.md"
+ start=""
+ end=""
+%}
+
+## Example
+
+### Annotations
+
+Using [`--file-annotations`][file-annotations]:
+
+#### clang-format annotations
+
+{ .dark-only }
+{ .light-only }
+
+#### clang-tidy annotations
+
+{ .dark-only }
+{ .light-only }
+
+### Thread Comment
+
+Using [`--thread-comments`][thread-comments]:
+
+{ .dark-only }
+{ .light-only }
+
+??? example "Expanded"
+
+ { .dark-only }
+ { .light-only }
+
+### Step Summary
+
+Using [`--step-summary`][step-summary]:
+
+{ .dark-only }
+{ .light-only }
+
+### Pull Request Review
+
+{ .dark-only }
+{ .light-only }
+
+#### clang-tidy suggestion
+
+Using [`--tidy-review`][tidy-review]:
+
+{ .dark-only }
+{ .light-only }
+
+#### clang-format suggestion
+
+Using [`--format-review`][format-review]:
+
+{ .dark-only }
+{ .light-only }
{%
- include-markdown "../README.md"
- start=""
- end=""
+ include "../README.md"
+ start=""
%}
diff --git a/docs/stylesheets/extra.css b/docs/stylesheets/extra.css
index 65f1ada6..67bd6523 100644
--- a/docs/stylesheets/extra.css
+++ b/docs/stylesheets/extra.css
@@ -2,11 +2,25 @@ th {
background-color: var(--md-default-fg-color--lightest);
}
-.md-header,
-.md-nav--primary .md-nav__title[for="__drawer"] {
+[data-md-color-scheme="default"] img.dark-only {
+ display: none;
+
+}
+
+[data-md-color-scheme="slate"] img.light-only {
+ display: none;
+}
+
+.md-header {
background-color: #4051b5;
}
+@media screen and (max-width: 76.2344em) {
+ .md-nav--primary .md-nav__title[for="__drawer"] {
+ background-color: #4051b5;
+ }
+}
+
@keyframes heart {
0%,
diff --git a/mkdocs.yml b/mkdocs.yml
index 6069e734..eb5e858f 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -84,6 +84,7 @@ markdown_extensions:
- pymdownx.highlight:
linenums_style: pymdownx-inline
- pymdownx.inlinehilite
+ - pymdownx.details
- pymdownx.snippets:
check_paths: true
- attr_list