cours/.obsidian/snippets/omts-MakeMD Inline Context - Duotone banner.css
Oscar Plaisant 29453462f9 [nb] Commit
2024-12-26 16:09:08 +01:00

521 lines
23 KiB
CSS

/*
Make.MD Contexts: Duotone Banners
Duotone banner images to match each minimal theme
https://i.imgur.com/fvLOHfA.png
https://github.com/replete/obsidian-minimal-theme-css-snippets
*/
.mk-space-banner {
/* Needed for blending mode function */
background:var(--background-primary);
}
/* Light themes */
.theme-light.minimal-default-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.5 1"></feFuncR>\
<feFuncG type="table" tableValues="0.5 1"></feFuncG>\
<feFuncB type="table" tableValues="0.5 1"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-atom-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.6274509804 0.9803921569"></feFuncR>\
<feFuncG type="table" tableValues="0.631372549 0.9803921569"></feFuncG>\
<feFuncB type="table" tableValues="0.6588235294 0.9803921569"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-ayu-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.5490196078 0.9098039216"></feFuncR>\
<feFuncG type="table" tableValues="0.5764705882 0.9254901961"></feFuncG>\
<feFuncB type="table" tableValues="0.6078431373 0.9411764706"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-catppuccin-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.631372549 0.937254902"></feFuncR>\
<feFuncG type="table" tableValues="0.6352941176 0.9450980392"></feFuncG>\
<feFuncB type="table" tableValues="0.6901960784 0.9607843137"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-everforest-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.5098039216 0.9921568627"></feFuncR>\
<feFuncG type="table" tableValues="0.568627451 0.9647058824"></feFuncG>\
<feFuncB type="table" tableValues="0.5058823529 0.8901960784"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-gruvbox-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.4862745098 0.9882352941"></feFuncR>\
<feFuncG type="table" tableValues="0.4392156863 0.9490196078"></feFuncG>\
<feFuncB type="table" tableValues="0.3960784314 0.7803921569"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-macos-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.5019607843 1"></feFuncR>\
<feFuncG type="table" tableValues="0.5019607843 1"></feFuncG>\
<feFuncB type="table" tableValues="0.5019607843 1"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-nord-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.4901960784 1"></feFuncR>\
<feFuncG type="table" tableValues="0.5215686275 1"></feFuncG>\
<feFuncB type="table" tableValues="0.5921568627 1"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-notion-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.4470588235 1"></feFuncR>\
<feFuncG type="table" tableValues="0.4392156863 1"></feFuncG>\
<feFuncB type="table" tableValues="0.4156862745 1"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-rose-pine-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.4745098039 1"></feFuncR>\
<feFuncG type="table" tableValues="0.4588235294 0.9803921569"></feFuncG>\
<feFuncB type="table" tableValues="0.5764705882 0.9529411765"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-solarized-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.3450980392 0.9921568627"></feFuncR>\
<feFuncG type="table" tableValues="0.431372549 0.9647058824"></feFuncG>\
<feFuncB type="table" tableValues="0.4588235294 0.8901960784"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-light.minimal-things-light .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.4901960784 1"></feFuncR>\
<feFuncG type="table" tableValues="0.4980392157 1"></feFuncG>\
<feFuncB type="table" tableValues="0.5176470588 1"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
/* Dark themes */
.theme-dark.minimal-default-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1450980392 0.6"></feFuncR>\
<feFuncG type="table" tableValues="0.1450980392 0.6"></feFuncG>\
<feFuncB type="table" tableValues="0.1450980392 0.6"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-atom-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1568627451 0.537254902"></feFuncR>\
<feFuncG type="table" tableValues="0.1725490196 0.5607843137"></feFuncG>\
<feFuncB type="table" tableValues="0.2039215686 0.6156862745"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-ayu-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.137254902 0.4392156863"></feFuncR>\
<feFuncG type="table" tableValues="0.1607843137 0.4784313725"></feFuncG>\
<feFuncB type="table" tableValues="0.2156862745 0.5490196078"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-catppuccin-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1882352941 0.7264705882"></feFuncR>\
<feFuncG type="table" tableValues="0.2039215686 0.7956862745"></feFuncG>\
<feFuncB type="table" tableValues="0.2745098039 0.9407843137"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
/* removed .2 from light values text overlay legibility */
}
.theme-dark.minimal-dracula-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1568627451 0.5803921569"></feFuncR>\
<feFuncG type="table" tableValues="0.1647058824 0.6235294118"></feFuncG>\
<feFuncB type="table" tableValues="0.2156862745 0.7450980392"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-everforest-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1764705882 0.6156862745"></feFuncR>\
<feFuncG type="table" tableValues="0.20784313734 0.662745098"></feFuncG>\
<feFuncB type="table" tableValues="0.231372549 0.6274509804"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-gruvbox-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1568627451 0.7411764706"></feFuncR>\
<feFuncG type="table" tableValues="0.1568627451 0.6823529412"></feFuncG>\
<feFuncB type="table" tableValues="0.1568627451 0.5725490196"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-macos-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1176470588 0.5490196078"></feFuncR>\
<feFuncG type="table" tableValues="0.1176470588 0.5490196078"></feFuncG>\
<feFuncB type="table" tableValues="0.1176470588 0.5490196078"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-nord-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1803921569 0.6196078431"></feFuncR>\
<feFuncG type="table" tableValues="0.2 0.6862745098"></feFuncG>\
<feFuncB type="table" tableValues="0.2549019608 0.8"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-notion-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1843137255 0.5647058824"></feFuncR>\
<feFuncG type="table" tableValues="0.2039215686 0.5725490196"></feFuncG>\
<feFuncB type="table" tableValues="0.2156862745 0.5803921569"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-rose-pine-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1215686275 0.5647058824"></feFuncR>\
<feFuncG type="table" tableValues="0.1137254902 0.5490196078"></feFuncG>\
<feFuncB type="table" tableValues="0.1803921569 0.6666666667"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-solarized-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.0196078431 0.3960784314"></feFuncR>\
<feFuncG type="table" tableValues="0.1647058824 0.4823529412"></feFuncG>\
<feFuncB type="table" tableValues="0.2117647059 0.5137254902"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}
.theme-dark.minimal-things-dark .mk-space-banner img {
filter: url('data:image/svg+xml,\
<svg xmlns="http://www.w3.org/2000/svg">\
<filter id="filter">\
<feColorMatrix type="matrix" result="grayscale"\
values="1 0 0 0 0\
1 0 0 0 0\
1 0 0 0 0\
0 0 0 1 0">\
</feColorMatrix>\
<feComponentTransfer color-interpolation-filters="sRGB" result="duotone">\
<feFuncR type="table" tableValues="0.1411764706 0.7960784314"></feFuncR>\
<feFuncG type="table" tableValues="0.1490196078 0.8"></feFuncG>\
<feFuncB type="table" tableValues="0.1647058824 0.8039215686ƒ"></feFuncB>\
<feFuncA type="table" tableValues="0 1"></feFuncA>\
</feComponentTransfer>\
</filter>\
</svg>#filter');
}