44 lines
1.0 KiB
CSS
44 lines
1.0 KiB
CSS
/*
|
|
Make.MD Contexts: Gradient Banners
|
|
Gradient Banners
|
|
|
|
https://i.imgur.com/o3e6GTa.png
|
|
https://github.com/replete/obsidian-minimal-theme-css-snippets
|
|
*/
|
|
:root {
|
|
--replete-banner-fade-offset: 2; /* integer */
|
|
}
|
|
.mk-inline-context {
|
|
|
|
.mk-path-context-component {
|
|
|
|
&:has(.mk-space-banner) {
|
|
/* Moves the note text above the fade of the banner */
|
|
height:calc(var(--replete-banner-height) / var(--replete-banner-fade-offset));
|
|
}
|
|
}
|
|
|
|
.mk-space-banner {
|
|
&::after {
|
|
content:'';
|
|
display: block;
|
|
width:100%;
|
|
height:100%;
|
|
left:0;
|
|
top:0;
|
|
background:
|
|
linear-gradient(to bottom, transparent 20%, var(--background-primary)),
|
|
linear-gradient(to bottom, transparent 60%, var(--background-primary));
|
|
position: absolute;
|
|
pointer-events:none;
|
|
}
|
|
|
|
img {
|
|
/* Disable magnify cursor */
|
|
cursor:default !important
|
|
}
|
|
}
|
|
}
|
|
|
|
|