Is it possible to customize the popup/preview appearance from only one note?

[dmantisk]

What I’m trying to do

Customize the appearance of the preview window only when it’s from a specified note (Identified by cssclass or something)

Things I have tried

The following css modifies all instances of the preview/popup window

.popover.hover-popover {
  --h1-color: #aa5500;
  --h1-size: 1.2em;
}

But I want it to only affect a single note, I tried combining it with css class
like

body {
.definition {
    & > .popover.hover-popover {
        --h1-color: #aa5500;
        --h1-size: 1.2em;
	}
}

But I probably did something wrong or it doesn’t work like that

[ariehen]

This is working on my end:

body .hover-popover .pop-class {
    --h1-color: var(--color-red);
    --h2-color: var(--color-orange);
    --h3-color: var(--color-yellow);
    --h4-color: var(--color-green);
    --h5-color: var(--color-blue);
    --h6-color: var(--color-purple);
}

So you could try:

body .hover-popover .definition {
    --h1-color: #aa5500;
    --h1-size: 1.2em;
}

[dmantisk]

Thank you!

Buuut there’s a small snag.
Turns out if I target a heading in a note, the css won’t apply

Any way around that?

Targeting a note

Targeting a header in that note

[ariehen]

Yeah, unfortunately that doesn’t work (last time I tried it anyway).

A related feature request is here:

Request for headings and blocks to inherit css classes in the popup window please

It would be great if the css class stylings that carry over to the popup hover window from page links could be extended to also cover headings and block references. I love the window, and use it all the time as a memory jogger for terms, formulas etc., but only on a block level, so it would be a really nice addition imo.