feat: add invertable image shortcode

Useful to invert diagrams, graphs, etc. in dark theme.
To use it in a markdown file, add a line like:
{{ invertable_image(src="/img.png", alt="alt text") }}
main
welpo 2 years ago
parent c26c826471
commit 389c724fe0
No known key found for this signature in database
GPG Key ID: A2F978CF4EC1F5A6

@ -41,7 +41,6 @@
--meta-color: rgb(53, 53, 53);
--accent-color: #aacb73;
}
[data-theme='dark'] {
--bg-0: #818181;
--bg-1: rgba(133, 133, 133, 0.5);
@ -60,7 +59,12 @@
--input-color: #294797;
--meta-color: rgb(198, 197, 197);
--accent-color: #ff9a8c;
.invertable-image {
filter: invert(1);
}
}
html {
background-color: var(--background-color);
color: var(--text-color);

@ -0,0 +1 @@
<img class="invertable-image" {% if src %}src="{{ src }}"{% endif %} {% if alt %}alt="{{ alt }}"{% endif %}/>
Loading…
Cancel
Save