mkdocs-pixel-lab 0.2.0__tar.gz → 0.2.1__tar.gz

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. mkdocs_pixel_lab-0.2.1/PKG-INFO +104 -0
  2. mkdocs_pixel_lab-0.2.1/README.md +74 -0
  3. mkdocs_pixel_lab-0.2.1/docs/components/admonitions.md +93 -0
  4. mkdocs_pixel_lab-0.2.1/docs/components/alerts.md +121 -0
  5. mkdocs_pixel_lab-0.2.1/docs/components/code-blocks.md +130 -0
  6. mkdocs_pixel_lab-0.2.1/docs/components/details.md +119 -0
  7. mkdocs_pixel_lab-0.2.1/docs/components/index.md +85 -0
  8. mkdocs_pixel_lab-0.2.1/docs/components/media.md +88 -0
  9. mkdocs_pixel_lab-0.2.1/docs/components/metadata.md +79 -0
  10. mkdocs_pixel_lab-0.2.1/docs/components/tables.md +97 -0
  11. mkdocs_pixel_lab-0.2.1/docs/components/tabs.md +201 -0
  12. mkdocs_pixel_lab-0.2.1/docs/components/text.md +123 -0
  13. mkdocs_pixel_lab-0.2.1/docs/getting-started.md +91 -0
  14. mkdocs_pixel_lab-0.2.1/docs/index.md +53 -0
  15. mkdocs_pixel_lab-0.2.1/docs/reference/compatibility.md +45 -0
  16. mkdocs_pixel_lab-0.2.1/docs/reference/configuration.md +127 -0
  17. mkdocs_pixel_lab-0.2.1/docs/reference/plugins.md +67 -0
  18. mkdocs_pixel_lab-0.2.1/docs/reference/troubleshooting.md +34 -0
  19. mkdocs_pixel_lab-0.2.1/docs/reference/upgrading.md +46 -0
  20. mkdocs_pixel_lab-0.2.1/docs/setup/analytics.md +108 -0
  21. mkdocs_pixel_lab-0.2.1/docs/setup/branding.md +72 -0
  22. mkdocs_pixel_lab-0.2.1/docs/setup/colors.md +84 -0
  23. mkdocs_pixel_lab-0.2.1/docs/setup/fonts.md +54 -0
  24. mkdocs_pixel_lab-0.2.1/docs/setup/heading-permalinks.md +104 -0
  25. mkdocs_pixel_lab-0.2.1/docs/setup/icons.md +73 -0
  26. mkdocs_pixel_lab-0.2.1/docs/setup/index.md +30 -0
  27. mkdocs_pixel_lab-0.2.1/docs/setup/navigation.md +69 -0
  28. mkdocs_pixel_lab-0.2.1/docs/setup/page-actions.md +76 -0
  29. mkdocs_pixel_lab-0.2.1/docs/setup/related-sites.md +180 -0
  30. mkdocs_pixel_lab-0.2.1/docs/setup/repository.md +50 -0
  31. mkdocs_pixel_lab-0.2.1/docs/setup/search.md +62 -0
  32. mkdocs_pixel_lab-0.2.1/mkdocs.yml +74 -0
  33. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/pyproject.toml +4 -1
  34. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/css/analytics.css +1 -1
  35. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/css/style.css +43 -29
  36. mkdocs_pixel_lab-0.2.1/tests/fixture_site/docs/assets/alignment-wide.svg +4 -0
  37. mkdocs_pixel_lab-0.2.1/tests/fixture_site/docs/assets/pixel-lab-preview.svg +20 -0
  38. mkdocs_pixel_lab-0.2.1/tests/fixture_site/docs/guide/alignment.md +95 -0
  39. mkdocs_pixel_lab-0.2.1/tests/fixture_site/docs/guide/code.md +39 -0
  40. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/fixture_site/mkdocs.yml +1 -0
  41. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_analytics.py +6 -3
  42. mkdocs_pixel_lab-0.2.1/tests/test_docs_workflow.py +71 -0
  43. mkdocs_pixel_lab-0.2.1/tests/test_documentation.py +725 -0
  44. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_theme.py +130 -0
  45. mkdocs_pixel_lab-0.2.0/PKG-INFO +0 -787
  46. mkdocs_pixel_lab-0.2.0/README.md +0 -757
  47. mkdocs_pixel_lab-0.2.0/tests/fixture_site/docs/guide/code.md +0 -17
  48. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/.gitignore +0 -0
  49. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/LICENSE +0 -0
  50. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/THIRD_PARTY_LICENSES.md +0 -0
  51. /mkdocs_pixel_lab-0.2.0/tests/fixture_site/docs/assets/pixel-lab-preview.svg → /mkdocs_pixel_lab-0.2.1/docs/assets/component-preview.svg +0 -0
  52. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/__init__.py +0 -0
  53. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/analytics.html +0 -0
  54. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/favicon.png +0 -0
  55. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/fonts/ibm-plex-mono-400.woff2 +0 -0
  56. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/fonts/ibm-plex-mono-600.woff2 +0 -0
  57. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/fonts/ibm-plex-mono-700.woff2 +0 -0
  58. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/fonts/inter-latin.woff2 +0 -0
  59. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/icons/heading-link.svg +0 -0
  60. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/icons/page-edit.svg +0 -0
  61. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/icons/page-source.svg +0 -0
  62. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/icons/repository.svg +0 -0
  63. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/icons/search.svg +0 -0
  64. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/js/analytics.js +0 -0
  65. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/assets/js/main.js +0 -0
  66. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/base.html +0 -0
  67. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/git_lastmod.py +0 -0
  68. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/github_alerts.py +0 -0
  69. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/icons.html +0 -0
  70. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/main.html +0 -0
  71. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/metadata.py +0 -0
  72. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/mkdocs_theme.yml +0 -0
  73. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/page_source.html +0 -0
  74. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/robots.py +0 -0
  75. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/site_navigation.html +0 -0
  76. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/src/mkdocs_pixel_lab/sitemap.xml +0 -0
  77. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/fixture_site/docs/assets/pixel-lab-demo.mp4 +0 -0
  78. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/fixture_site/docs/assets/site-navigation-hover.svg +0 -0
  79. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/fixture_site/docs/guide/media.md +0 -0
  80. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/fixture_site/docs/guide/nested.md +0 -0
  81. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/fixture_site/docs/guide/tabs.md +0 -0
  82. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/fixture_site/docs/index.md +0 -0
  83. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/snapshots/desktop.png +0 -0
  84. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/snapshots/mobile.png +0 -0
  85. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_git_lastmod.py +0 -0
  86. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_icons.py +0 -0
  87. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_metadata.py +0 -0
  88. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_permalinks.py +0 -0
  89. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_privacy.py +0 -0
  90. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_repository.py +0 -0
  91. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_robots.py +0 -0
  92. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_site_navigation.py +0 -0
  93. {mkdocs_pixel_lab-0.2.0 → mkdocs_pixel_lab-0.2.1}/tests/test_source_links.py +0 -0
@@ -0,0 +1,104 @@
1
+ Metadata-Version: 2.5
2
+ Name: mkdocs-pixel-lab
3
+ Version: 0.2.1
4
+ Summary: A vibrant, accessible MkDocs documentation theme by Trained-by-Humans.
5
+ Project-URL: Homepage, https://github.com/trained-by-humans/mkdocs-pixel-lab
6
+ Project-URL: Documentation, https://github.com/trained-by-humans/mkdocs-pixel-lab#readme
7
+ Project-URL: Repository, https://github.com/trained-by-humans/mkdocs-pixel-lab
8
+ Project-URL: Issues, https://github.com/trained-by-humans/mkdocs-pixel-lab/issues
9
+ Project-URL: Changelog, https://github.com/trained-by-humans/mkdocs-pixel-lab/releases
10
+ Author: Trained-by-Humans
11
+ License-Expression: Apache-2.0
12
+ License-File: LICENSE
13
+ License-File: THIRD_PARTY_LICENSES.md
14
+ Classifier: Development Status :: 3 - Alpha
15
+ Classifier: Framework :: MkDocs
16
+ Classifier: License :: OSI Approved :: Apache Software License
17
+ Classifier: Programming Language :: Python :: 3
18
+ Classifier: Programming Language :: Python :: 3.10
19
+ Classifier: Programming Language :: Python :: 3.11
20
+ Classifier: Programming Language :: Python :: 3.12
21
+ Classifier: Programming Language :: Python :: 3.13
22
+ Requires-Python: >=3.10
23
+ Requires-Dist: mkdocs<2,>=1.6
24
+ Requires-Dist: pygments<3,>=2.19.1
25
+ Requires-Dist: pymdown-extensions<11,>=10
26
+ Provides-Extra: test
27
+ Requires-Dist: pytest-playwright>=0.7; extra == 'test'
28
+ Requires-Dist: pytest>=8; extra == 'test'
29
+ Description-Content-Type: text/markdown
30
+
31
+ <p align="center">
32
+ <img src="assets/pixel-lab-logo.svg" alt="Pixel Lab retro logo" width="480">
33
+ </p>
34
+
35
+ <p align="center">
36
+ <a href="https://pypi.org/project/mkdocs-pixel-lab/"><img src="https://img.shields.io/pypi/v/mkdocs-pixel-lab?style=flat-square&amp;logo=pypi&amp;logoColor=white&amp;label=PyPI&amp;color=C48800" alt="Latest PyPI release"></a>
37
+ <a href="https://pypi.org/project/mkdocs-pixel-lab/"><img src="https://img.shields.io/badge/Python-3.10%2B-2377C8?style=flat-square&amp;logo=python&amp;logoColor=white" alt="Python 3.10 or newer"></a>
38
+ <a href="https://github.com/trained-by-humans/mkdocs-pixel-lab/blob/main/LICENSE"><img src="https://img.shields.io/pypi/l/mkdocs-pixel-lab?style=flat-square&amp;label=License&amp;color=287C35" alt="Apache 2.0 license"></a>
39
+ <a href="https://www.mkdocs.org/"><img src="https://img.shields.io/badge/MkDocs-%3E%3D1.6%2C%20%3C2-7E46B6?style=flat-square" alt="MkDocs &gt;=1.6, &lt;2"></a>
40
+ </p>
41
+
42
+ <p align="center">
43
+ A retro-inspired theme for <a href="https://www.mkdocs.org/">MkDocs</a>, with pixel borders, bold colors, and arcade-style shadows.<br>
44
+ Built for modern documentation with responsive navigation, search, and rich Markdown components.
45
+ </p>
46
+
47
+ ## Preview
48
+
49
+ <table>
50
+ <tr>
51
+ <td align="center"><img src="tests/snapshots/desktop.png" alt="Pixel Lab desktop documentation preview" height="480"></td>
52
+ <td align="center"><img src="tests/snapshots/mobile.png" alt="Pixel Lab mobile documentation preview" height="480"></td>
53
+ </tr>
54
+ <tr>
55
+ <td align="center">Desktop</td>
56
+ <td align="center">Mobile</td>
57
+ </tr>
58
+ </table>
59
+
60
+ ## Demo
61
+
62
+ Visit [Pixel Lab on GitHub Pages](https://trained-by-humans.github.io/mkdocs-pixel-lab/)
63
+ to see the theme in action. The documentation site uses Pixel Lab itself and
64
+ includes examples of its components.
65
+
66
+ ## Features
67
+
68
+ - A tastefully designed, retro-inspired theme with pixel-art assets, crisp borders, and playful shadows.
69
+ - Optional metadata, Git-based sitemap dates, and `robots.txt` plugins.
70
+ - Opt-in Google Analytics 4 with consent controls.
71
+
72
+ ## Quick start
73
+
74
+ For an existing MkDocs project, install Pixel Lab:
75
+
76
+ ```bash
77
+ python -m pip install mkdocs-pixel-lab
78
+ ```
79
+
80
+ Select it in your existing `mkdocs.yml`:
81
+
82
+ ```yaml
83
+ theme:
84
+ name: pixel-lab
85
+ ```
86
+
87
+ Preview your site:
88
+
89
+ ```bash
90
+ mkdocs serve
91
+ ```
92
+
93
+ Requires Python 3.10 or newer. Installing Pixel Lab also installs MkDocs,
94
+ Pymdown Extensions, and Pygments.
95
+
96
+ Starting a new project? Follow [Get started](docs/getting-started.md) for
97
+ environment setup, a new site, and enabling Markdown extensions.
98
+
99
+ ## Documentation
100
+
101
+ - [Theme setup](docs/setup/index.md): colors, fonts, icons, branding, navigation, search, repository links, and analytics.
102
+ - [Components](docs/components/index.md): Markdown syntax, live examples, required extensions, and appearance settings.
103
+ - [Reference](docs/reference/configuration.md): configuration defaults, [bundled plugins](docs/reference/plugins.md), [compatibility](docs/reference/compatibility.md), and [troubleshooting](docs/reference/troubleshooting.md).
104
+ - [Upgrading](docs/reference/upgrading.md): migration notes and checks for existing sites.
@@ -0,0 +1,74 @@
1
+ <p align="center">
2
+ <img src="assets/pixel-lab-logo.svg" alt="Pixel Lab retro logo" width="480">
3
+ </p>
4
+
5
+ <p align="center">
6
+ <a href="https://pypi.org/project/mkdocs-pixel-lab/"><img src="https://img.shields.io/pypi/v/mkdocs-pixel-lab?style=flat-square&amp;logo=pypi&amp;logoColor=white&amp;label=PyPI&amp;color=C48800" alt="Latest PyPI release"></a>
7
+ <a href="https://pypi.org/project/mkdocs-pixel-lab/"><img src="https://img.shields.io/badge/Python-3.10%2B-2377C8?style=flat-square&amp;logo=python&amp;logoColor=white" alt="Python 3.10 or newer"></a>
8
+ <a href="https://github.com/trained-by-humans/mkdocs-pixel-lab/blob/main/LICENSE"><img src="https://img.shields.io/pypi/l/mkdocs-pixel-lab?style=flat-square&amp;label=License&amp;color=287C35" alt="Apache 2.0 license"></a>
9
+ <a href="https://www.mkdocs.org/"><img src="https://img.shields.io/badge/MkDocs-%3E%3D1.6%2C%20%3C2-7E46B6?style=flat-square" alt="MkDocs &gt;=1.6, &lt;2"></a>
10
+ </p>
11
+
12
+ <p align="center">
13
+ A retro-inspired theme for <a href="https://www.mkdocs.org/">MkDocs</a>, with pixel borders, bold colors, and arcade-style shadows.<br>
14
+ Built for modern documentation with responsive navigation, search, and rich Markdown components.
15
+ </p>
16
+
17
+ ## Preview
18
+
19
+ <table>
20
+ <tr>
21
+ <td align="center"><img src="tests/snapshots/desktop.png" alt="Pixel Lab desktop documentation preview" height="480"></td>
22
+ <td align="center"><img src="tests/snapshots/mobile.png" alt="Pixel Lab mobile documentation preview" height="480"></td>
23
+ </tr>
24
+ <tr>
25
+ <td align="center">Desktop</td>
26
+ <td align="center">Mobile</td>
27
+ </tr>
28
+ </table>
29
+
30
+ ## Demo
31
+
32
+ Visit [Pixel Lab on GitHub Pages](https://trained-by-humans.github.io/mkdocs-pixel-lab/)
33
+ to see the theme in action. The documentation site uses Pixel Lab itself and
34
+ includes examples of its components.
35
+
36
+ ## Features
37
+
38
+ - A tastefully designed, retro-inspired theme with pixel-art assets, crisp borders, and playful shadows.
39
+ - Optional metadata, Git-based sitemap dates, and `robots.txt` plugins.
40
+ - Opt-in Google Analytics 4 with consent controls.
41
+
42
+ ## Quick start
43
+
44
+ For an existing MkDocs project, install Pixel Lab:
45
+
46
+ ```bash
47
+ python -m pip install mkdocs-pixel-lab
48
+ ```
49
+
50
+ Select it in your existing `mkdocs.yml`:
51
+
52
+ ```yaml
53
+ theme:
54
+ name: pixel-lab
55
+ ```
56
+
57
+ Preview your site:
58
+
59
+ ```bash
60
+ mkdocs serve
61
+ ```
62
+
63
+ Requires Python 3.10 or newer. Installing Pixel Lab also installs MkDocs,
64
+ Pymdown Extensions, and Pygments.
65
+
66
+ Starting a new project? Follow [Get started](docs/getting-started.md) for
67
+ environment setup, a new site, and enabling Markdown extensions.
68
+
69
+ ## Documentation
70
+
71
+ - [Theme setup](docs/setup/index.md): colors, fonts, icons, branding, navigation, search, repository links, and analytics.
72
+ - [Components](docs/components/index.md): Markdown syntax, live examples, required extensions, and appearance settings.
73
+ - [Reference](docs/reference/configuration.md): configuration defaults, [bundled plugins](docs/reference/plugins.md), [compatibility](docs/reference/compatibility.md), and [troubleshooting](docs/reference/troubleshooting.md).
74
+ - [Upgrading](docs/reference/upgrading.md): migration notes and checks for existing sites.
@@ -0,0 +1,93 @@
1
+ # Admonitions
2
+
3
+ Use admonitions for callouts with custom titles and Markdown content. For
4
+ predefined titles and type-specific colors, use [Alerts](alerts.md).
5
+
6
+ ## Enable
7
+
8
+ Enable Python-Markdown's admonition extension in `mkdocs.yml`:
9
+
10
+ ```yaml
11
+ markdown_extensions:
12
+ - admonition
13
+ ```
14
+
15
+ ## Write an admonition
16
+
17
+ !!! note "Before you start"
18
+
19
+ Keep the configuration in one place and merge new settings into it.
20
+
21
+ ```markdown
22
+ !!! note "Before you start"
23
+
24
+ Keep the configuration in one place and merge new settings into it.
25
+ ```
26
+
27
+ Indent the body four spaces. The type follows `!!!`; the quoted custom title
28
+ is optional. For example, `!!! note` without a quoted title displays Note.
29
+ Admonition types currently share the same theme styling.
30
+
31
+ For expandable notes using `???` or `???+`, see [Collapsible content](details.md).
32
+
33
+ > [!NOTE]
34
+ >
35
+ > Content inside an admonition shares its outer shadow. See
36
+ > [Nest components](index.md#nest-components) for the nesting rule.
37
+
38
+ ## Customization
39
+
40
+ These theme settings customize all admonitions. Admonitions don't use the
41
+ type-specific `alert_*` colors:
42
+
43
+ ```yaml
44
+ theme:
45
+ name: pixel-lab
46
+ highlight_color: "#f5c842"
47
+ surface_color: "#fffdf2"
48
+ border_color: "#101410"
49
+ shadow_color: "#101410"
50
+ ```
51
+
52
+ | Parameter | Default | Effect |
53
+ | --- | --- | --- |
54
+ | `highlight_color` | Golden yellow · `#f5c842` | Admonition title background |
55
+ | `surface_color` | Ivory · `#fffdf2` | Admonition body background |
56
+ | `text_color` | Dark green-gray · `#182018` | Admonition body text |
57
+ | `border_color` | Near-black · `#101410` | Admonition outline and title divider |
58
+ | `shadow_color` | Near-black · `#101410` | Admonition pixel shadow |
59
+
60
+ See [Common attributes](../reference/configuration.md#common-attributes).
61
+
62
+ ### Component-wide overrides
63
+
64
+ To change every admonition's title fill, add this to your
65
+ [custom stylesheet](index.md#load-custom-css):
66
+
67
+ ```css
68
+ .admonition > .admonition-title {
69
+ background: #f5c842; /* Golden yellow */
70
+ }
71
+ ```
72
+
73
+ ### Scoped overrides
74
+
75
+ Wrap each selected admonition, following [Scope selected instances](index.md#scope-selected-instances):
76
+
77
+ ```markdown
78
+ <div class="instance-admonition" markdown="1">
79
+
80
+ !!! note "Before you start"
81
+
82
+ Keep the configuration in one place.
83
+
84
+ </div>
85
+ ```
86
+
87
+ Add the scoped rule to your stylesheet:
88
+
89
+ ```css
90
+ .instance-admonition > .admonition > .admonition-title {
91
+ background: #f5c842; /* Golden yellow */
92
+ }
93
+ ```
@@ -0,0 +1,121 @@
1
+ # Alerts
2
+
3
+ Use alerts for notes with predefined titles and semantic colors.
4
+ Their bodies support Markdown. For a custom title, use an
5
+ [admonition](admonitions.md) instead.
6
+
7
+ ## Enable
8
+
9
+ Enable the extension bundled with Pixel Lab:
10
+
11
+ ```yaml
12
+ markdown_extensions:
13
+ - mkdocs_pixel_lab.github_alerts
14
+ ```
15
+
16
+ ## Write an alert
17
+
18
+ > [!NOTE]
19
+ >
20
+ > Background information that helps explain the topic.
21
+
22
+ > [!TIP]
23
+ >
24
+ > A useful shortcut or recommendation.
25
+
26
+ > [!IMPORTANT]
27
+ >
28
+ > Something readers should know before proceeding.
29
+
30
+ > [!WARNING]
31
+ >
32
+ > A potential problem that needs attention.
33
+
34
+ > [!CAUTION]
35
+ >
36
+ > A risk of damage or an irreversible action.
37
+
38
+ ```markdown
39
+ > [!TIP]
40
+ >
41
+ > A useful shortcut or recommendation.
42
+ ```
43
+
44
+ The supported types are `NOTE`, `TIP`, `IMPORTANT`, `WARNING`, and `CAUTION`.
45
+
46
+ > [!NOTE]
47
+ >
48
+ > Rich content inside an alert uses the alert's outer shadow rather than adding
49
+ > its own. See [Nest components](index.md#nest-components).
50
+
51
+ ## Customization
52
+
53
+ Each alert type has a rail/title color and a surface color. These theme
54
+ settings customize every alert of that type:
55
+
56
+ ```yaml
57
+ theme:
58
+ name: pixel-lab
59
+ alert_tip_color: "#287c35"
60
+ alert_tip_surface_color: "#e7f5df"
61
+ alert_warning_color: "#a65f00"
62
+ alert_warning_surface_color: "#fff0bf"
63
+ ```
64
+
65
+ | Parameter | Default | Effect |
66
+ | --- | --- | --- |
67
+ | `alert_note_color` | Blue · `#2377c8` | Note rail and title |
68
+ | `alert_note_surface_color` | Pale blue · `#e4f2ff` | Note background |
69
+ | `alert_tip_color` | Dark green · `#287c35` | Tip rail and title |
70
+ | `alert_tip_surface_color` | Pale green · `#e7f5df` | Tip background |
71
+ | `alert_important_color` | Purple · `#6d28d9` | Important rail and title |
72
+ | `alert_important_surface_color` | Pale lavender · `#f0e8ff` | Important background |
73
+ | `alert_warning_color` | Amber brown · `#a65f00` | Warning rail and title |
74
+ | `alert_warning_surface_color` | Pale yellow · `#fff0bf` | Warning background |
75
+ | `alert_caution_color` | Dark red · `#b42318` | Caution rail and title |
76
+ | `alert_caution_surface_color` | Pale pink · `#ffe3df` | Caution background |
77
+
78
+ For the body text, outline, and shadow:
79
+
80
+ | Parameter | Default | Effect |
81
+ | --- | --- | --- |
82
+ | `text_color` | Dark green-gray · `#182018` | Alert body text |
83
+ | `border_color` | Near-black · `#101410` | Alert outline, except the type-specific left rail |
84
+ | `shadow_color` | Near-black · `#101410` | Alert pixel shadow |
85
+
86
+ See [Common attributes](../reference/configuration.md#common-attributes).
87
+
88
+ ### Component-wide overrides
89
+
90
+ To customize all tip alerts, add this to your
91
+ [custom stylesheet](index.md#load-custom-css):
92
+
93
+ ```css
94
+ .gh-alert--tip {
95
+ --alert-color: #287c35; /* Dark green */
96
+ --alert-surface: #e7f5df; /* Pale green */
97
+ }
98
+ ```
99
+
100
+ ### Scoped overrides
101
+
102
+ Wrap each selected alert, following [Scope selected instances](index.md#scope-selected-instances):
103
+
104
+ ```markdown
105
+ <div class="instance-alert" markdown="1">
106
+
107
+ > [!TIP]
108
+ >
109
+ > Keep the configuration in one place.
110
+
111
+ </div>
112
+ ```
113
+
114
+ Add the scoped rule to your stylesheet:
115
+
116
+ ```css
117
+ .instance-alert > .gh-alert--tip {
118
+ --alert-color: #287c35; /* Dark green */
119
+ --alert-surface: #e7f5df; /* Pale green */
120
+ }
121
+ ```
@@ -0,0 +1,130 @@
1
+ # Code blocks
2
+
3
+ Fenced code supports syntax highlighting, emphasized lines, horizontal
4
+ scrolling, and a copy button.
5
+
6
+ ## Enable
7
+
8
+ ```yaml
9
+ markdown_extensions:
10
+ - pymdownx.superfences
11
+ - pymdownx.highlight
12
+ ```
13
+
14
+ ## Write a code block
15
+
16
+ ```python
17
+ def greet(name):
18
+ # A small example with syntax colors.
19
+ return f"Hello, {name}!"
20
+
21
+ print(greet("Pixel Lab"))
22
+ ```
23
+
24
+ ````markdown
25
+ ```python
26
+ def greet(name):
27
+ # A small example with syntax colors.
28
+ return f"Hello, {name}!"
29
+
30
+ print(greet("Pixel Lab"))
31
+ ```
32
+ ````
33
+
34
+ Set the language after the opening fence. Code keeps its whitespace and
35
+ scrolls horizontally when a line is wider than the available space.
36
+
37
+ ## Emphasize lines
38
+
39
+ ```{ .python hl_lines="2" }
40
+ import math
41
+ print(math.pi)
42
+ ```
43
+
44
+ ````markdown
45
+ ```{ .python hl_lines="2" }
46
+ import math
47
+ print(math.pi)
48
+ ```
49
+ ````
50
+
51
+ ## Copy behavior
52
+
53
+ The copy button is added by the theme's JavaScript and reports success or
54
+ failure. Without JavaScript, the code remains readable and selectable.
55
+ Clipboard access may depend on the browser and a secure context such as
56
+ HTTPS or localhost.
57
+
58
+ ## Customization
59
+
60
+ These theme settings customize all code blocks:
61
+
62
+ ```yaml
63
+ theme:
64
+ name: pixel-lab
65
+ code_background_color: "#101410"
66
+ code_text_color: "#e9f1d8"
67
+ code_keyword_color: "#72d572"
68
+ code_string_color: "#f5cf54"
69
+ code_function_color: "#4cc4d2"
70
+ code_comment_color: "#7f8978"
71
+ highlight_color: "#f5c842"
72
+ ```
73
+
74
+ | Parameter | Default | Effect |
75
+ | --- | --- | --- |
76
+ | `code_background_color` | Near-black · `#101410` | Code block background |
77
+ | `code_text_color` | Pale green · `#e9f1d8` | Default code text |
78
+ | `code_keyword_color` | Light green · `#72d572` | Styled keyword token classes |
79
+ | `code_string_color` | Golden yellow · `#f5cf54` | Styled string token classes |
80
+ | `code_function_color` | Cyan · `#4cc4d2` | Function names |
81
+ | `code_comment_color` | Gray-green · `#7f8978` | Comments |
82
+ | `highlight_color` | Golden yellow · `#f5c842` | Emphasized-line tint and copy-button hover/focus fill |
83
+ | `surface_color` | Ivory · `#fffdf2` | Copy-button background |
84
+ | `strong_text_color` | Near-black · `#101410` | Copy-button text |
85
+ | `accent_color` | Leaf green · `#4caf50` | Successful-copy button background |
86
+ | `accent_foreground_color` | Near-black · `#101410` | Successful-copy button text |
87
+ | `accent_dark_color` | Dark green · `#287c35` | Copy-button hover/focus outline |
88
+ | `border_color` | Near-black · `#101410` | Block and copy-button outlines |
89
+ | `shadow_color` | Near-black · `#101410` | Block's pixel shadow |
90
+
91
+ Syntax colors apply to the Pygments token classes styled by the theme, not
92
+ every possible token independently.
93
+
94
+ Inline code has separate surface/border styling: see [Text and lists](text.md#customization).
95
+ See [Common attributes](../reference/configuration.md#common-attributes).
96
+
97
+ ### Component-wide overrides
98
+
99
+ To change every highlighted code block's background and text, add this to
100
+ your [custom stylesheet](index.md#load-custom-css):
101
+
102
+ ```css
103
+ .highlight {
104
+ --code: #101410; /* Near-black */
105
+ --code-text: #e9f1d8; /* Pale green */
106
+ }
107
+ ```
108
+
109
+ ### Scoped overrides
110
+
111
+ Wrap each selected code block, following [Scope selected instances](index.md#scope-selected-instances):
112
+
113
+ ````markdown
114
+ <div class="instance-code" markdown="1">
115
+
116
+ ```python
117
+ print("Hello, Pixel Lab!")
118
+ ```
119
+
120
+ </div>
121
+ ````
122
+
123
+ Add the scoped rule to your stylesheet:
124
+
125
+ ```css
126
+ .instance-code > .highlight {
127
+ --code: #101410; /* Near-black */
128
+ --code-text: #e9f1d8; /* Pale green */
129
+ }
130
+ ```
@@ -0,0 +1,119 @@
1
+ # Collapsible content
2
+
3
+ Use an expandable note for optional instructions, a longer explanation, or
4
+ troubleshooting details.
5
+
6
+ ## Enable
7
+
8
+ ```yaml
9
+ markdown_extensions:
10
+ - admonition
11
+ - pymdownx.details
12
+ ```
13
+
14
+ `pymdownx.details` enables the collapsible `???` syntax; `admonition` also
15
+ enables regular `!!!` notes.
16
+
17
+ For non-collapsible notes with the same styling, see [Admonitions](admonitions.md).
18
+
19
+ ## Closed by default
20
+
21
+ ??? note "Show the configuration advice"
22
+
23
+ Keep one `theme` block in `mkdocs.yml` and merge new options into it.
24
+
25
+ ```markdown
26
+ ??? note "Show the configuration advice"
27
+
28
+ Keep one `theme` block in `mkdocs.yml` and merge new options into it.
29
+ ```
30
+
31
+ ## Open by default
32
+
33
+ ???+ tip "Start with the defaults"
34
+
35
+ Override only the settings your site needs.
36
+
37
+ ```markdown
38
+ ???+ tip "Start with the defaults"
39
+
40
+ Override only the settings your site needs.
41
+ ```
42
+
43
+ The browser's native `details` element handles opening and closing, including
44
+ keyboard activation. It works without the theme's JavaScript.
45
+
46
+ > [!NOTE]
47
+ >
48
+ > Expanded content shares the collapsible block's outer shadow. See
49
+ > [Nest components](index.md#nest-components).
50
+
51
+ ## Native HTML alternative
52
+
53
+ You can also write `<details>` directly. For Markdown inside the body, enable
54
+ [`md_in_html`](index.md#scope-selected-instances) and add `markdown="1"`:
55
+
56
+ ```html
57
+ <details markdown="1">
58
+ <summary>More information</summary>
59
+
60
+ This body supports **Markdown**.
61
+
62
+ </details>
63
+ ```
64
+
65
+ ## Customization
66
+
67
+ These theme settings customize all collapsible blocks. Different detail types
68
+ currently share the same styling:
69
+
70
+ ```yaml
71
+ theme:
72
+ name: pixel-lab
73
+ highlight_color: "#f5c842"
74
+ surface_color: "#fffdf2"
75
+ border_color: "#101410"
76
+ shadow_color: "#101410"
77
+ ```
78
+
79
+ | Parameter | Default | Effect |
80
+ | --- | --- | --- |
81
+ | `highlight_color` | Golden yellow · `#f5c842` | Summary background |
82
+ | `surface_color` | Ivory · `#fffdf2` | Expanded body background |
83
+ | `border_color` | Near-black · `#101410` | Frame and summary divider |
84
+ | `shadow_color` | Near-black · `#101410` | Outer pixel shadow |
85
+
86
+ See [Common attributes](../reference/configuration.md#common-attributes).
87
+
88
+ ### Component-wide overrides
89
+
90
+ To change every collapsible block's summary fill, add this to your
91
+ [custom stylesheet](index.md#load-custom-css):
92
+
93
+ ```css
94
+ details > summary {
95
+ background: #f5c842; /* Golden yellow */
96
+ }
97
+ ```
98
+
99
+ ### Scoped overrides
100
+
101
+ Wrap each selected block, following [Scope selected instances](index.md#scope-selected-instances):
102
+
103
+ ```markdown
104
+ <div class="instance-details" markdown="1">
105
+
106
+ ??? note "More information"
107
+
108
+ Keep the configuration in one place.
109
+
110
+ </div>
111
+ ```
112
+
113
+ Add the scoped rule to your stylesheet:
114
+
115
+ ```css
116
+ .instance-details > details > summary {
117
+ background: #f5c842; /* Golden yellow */
118
+ }
119
+ ```