Emoji display darker

[antares]

greetings,

i suddenly had an emoji rendering changing in obsidian.

it was normal for months and for no reasons the emoji turned darker.

i am on macos Tahoe .2 + last obsidian version.

i jsut figured out that when i remove a CSS line, the emoji come back to normal color :

:root div:has(:is(h1,h2,h3,h4,h5,h6))+div>p {

margin-top: 0px;}

to be more precised, when i remove the “p” after DIV, it comes back to normal.

i added that line to remove the space of the paragraph

anyone has an idea on whats going on???

AI told me it has perhaps somethind to do with the last obsidian chromium update (???)

[ariehen]

Strange indeed!

Using

.markdown-rendered div:has(:is(h1,h2,h3,h4,h5,h6)) + div > p {
    margin-top: 25px;
    border: 1px dotted salmon;
}

(starting with :root is the same) I see no color changes using Windows 11, Obsidian 1.11.4, 1.10.6 installer.

live preview | reading view

I can check on macOS later.

---

Is there anything else in your .css file? If you switch to the default theme and disable other CSS snippets, do your see the same? Using only that snippet and the same content in a new vault, what does it look like? I’d try doing that to see if you can suss out the cause.

[antares]

thank you very much for the reply

i have tried removing the Theme and other CSS :

the problems seams to be related to another CSS files, to a specific line :

.markdown-embed-content,
.markdown-embed-content > .markdown-preview-view {
max-height: unset;
padding: 0 !important; /* !important for “Pisum” theme */
margin: 0;
border: 0;
}

so it seams to be, again, related to the same problem

but more specifically it seams linked to the PADDING function

when i set PADDING=0 the problem appears

and for PADDING=1 it desapears…

[antares]

perhaps should i post in bug and reports?

[ariehen]

No, bug reports aren’t accepted using a community theme or CSS snippets.

---

I still can’t reproduce what you’re seeing. Can you explain exactly what you are trying to do and share an example in a code block of the content being embedded?

It looks like you’re removing borders, paddings, and margins from embeds to make them “clean” or “flush” with the host note.

Give the following snippet a try. Of course it may need adjusting to your taste.

body {
    --embed-max-height: unset; /* 4000px; */
    --embed-border-start: none; /* 2px solid var(--interactive-accent); */
    --embed-border-top: 0;
    --embed-border-end: 0;
    --embed-border-bottom: 0;
    --embed-padding: 0; /* 0 0 0 var(--size-4-6); */
}

.internal-embed .markdown-embed-content {
    padding: 0;
}

.internal-embed .embed-title {
    border-bottom: none;
}

Embed (using Prism) with no snippet:

Embed (using Prism) with snippet: