Add styling for new callout feature

hungsu / typomagical-obsidian

An Obsidian theme for typographic appreciators, with support for Style Settings by mgmeyers

https://forum.obsidian.md/t/typomagical-a-theme-for-typographic-appreciators/26860

GNU General Public License v3.0

114 stars 5 forks source link

Add styling for new callout feature #40

Open laurastephsmith opened 2 years ago

laurastephsmith commented 2 years ago

v0.14.0 (currently in beta) offers callout boxes (https://help.obsidian.md/How+to/Use+callouts). It would be brilliant if you could support these to look stylish and at home in Typomagical! Black and white? Not so modern-looking?

laurastephsmith commented 2 years ago

I've done this as a starter, but maybe you can prettify it a bit more!

.theme-light .callout {
    --callout-color: 207, 207, 207 !important;
    background-color: #ffffff !important;
    border: 1px solid rgb(207, 207, 207);
}

.theme-light .callout .callout-title .callout-icon {
    color: #2E3338;
}

.theme-dark .callout {
    --callout-color: 51, 51, 51 !important;
    background-color: transparent !important;
    border: 1px solid rgb(51, 51, 51);
}

.theme-dark .callout .callout-title .callout-icon {
    color: #DCDDDE;
}

hungsu commented 2 years ago

Hi Laura, thanks for your suggestion, it's very exciting that callouts have reached public access!

I won't be using your code for a few reasons:

!important - Part of the reason I created Typomagical was because so many themes are in a "specificity war", and this was a notable complaint about my previous theme, Vileplume. Themes trying to override each other with ever more specific selectors, then ultimately giving up and using !important, which just leads to !important on top of !important...I wrote Typomagical to not do that, and I won't use it unless I absolutely must
The colours you chose only work for the Obsidian colour palette. My other major colour palette is Ficus Ruby and I'll have to think about what to do for that

I'm quite enjoying callouts so rest assured I'll be thinking about this

laurastephsmith commented 2 years ago

Ha! I didn't even know you could override !Important with another !important. But that way madness lies... :). No worries, just something I threw together quickly to solve the eyesore for me for now. I'm sure based on what I've seen of your work you can come up with an idea that looks better than I did - glad it's on your to do list somewhere!