An idea how to have those “old” style article separators that some newspapers had …
CSS snippet:
/* Newspaper like article seperator */
.callout[data-callout="article-seperator"] {
--callout-color: var(--callout-success);
--callout-icon: lucide-check;
border-color: var(--hr-color) !important;
border-width: 2px !important;
border-radius: 0px !important;
border-top-style: solid !important;
border-bottom-style: solid !important;
border-left-style: hidden !important;
border-right-style: hidden !important;
background-color: transparent !important;
}
.callout[data-callout="article-seperator"] .callout-title-inner {
color: var(--code-comment) !important;
font-size: 0.8em;
opacity: 0.8;
font-weight: bold !important;
text-transform: uppercase !important;
text-align: center !important;
}
.callout[data-callout="article-seperator"] .callout-title-inner::after {
content: " ●";
}
.callout[data-callout="article-seperator"] .callout-title-inner::before {
content: "● ";
}
.callout[data-callout="article-seperator"] .callout-title {
display: inline !important;
vertical-align: middle !important;
}
.callout[data-callout="article-seperator"] .callout-icon {
display: none !important;
}
And using it:
> [!article-seperator] Lorem Ipsum
CSS snippet uses var(), so some colors will depend on your theme!
Cheers, Marko 