Exalidraw Bad buttons colors

[dariuszkowalski-com]

Describe the bug Bad colors of background element of Exalidraw interface when Theme of Exalidraw is not the same as theme of Obsidian.

problem is with:

body .excalidraw {
    --input-border-color: var(--background-modifier-border);
    --button-gray-1: var(--background-tertiary);
    --button-gray-2: var(--background-tertiary);
}

To Reproduce I have got minimal theme installed, controlled by advanced apperance plugin

Expected behavior

Obsidian theme - Dark, Exalidraw "theme" - Light

Obsidian theme - Light, Exalidraw "theme" - Dark

Screenshots

Obsidian theme - Dark, Exalidraw "theme" - Light

Obsidian theme - Light, Exalidraw "theme" - Dark

Desktop : OS: Windows 10 Browser: all Version: Exalidraw: 1.5.7 , obsidian 0.13.16 Additional context This problem start to appear when this options were added:

Aditional: This problem start to appear when this options were added:

https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/326

[kepano]

This is fixed in Minimal 4.3

[dariuszkowalski-com]

@kepano There is the same issue with Obsidian Dark and Exalidraw Light:

Obsidian: 0.13.7 Minimal-theme 4.3.1

[kepano]

This is now fixed in the latest commit, thanks!

[miluoshi]

I'm still encountering this issue in v5.0.0. When themes match, colors are correct.

Obsidian: v0.13.23 Minimal Theme Settings: 5.0.4 Minimal Theme: 5.0.0 Light mode color theme: Nord; High contrast Dark mode color theme: Things; Default Operating system: Darwin Kernel Version 21.3.0 Live preview: on Legacy editor: off

Obsidian dark, Excalidraw light:

Obsidian light, Excalidraw dark:

Both light

Both dark

[kepano]

This is fixed for now, but doesn't support the new Minimal color schemes.

A major part of the issue is that the Excalidraw plugin does not follow Obsidian's semantic variables. I think Excalidraw plugin should add theme compatibility by using Obsidian's CSS variables. This would improve things not just for Minimal but all other themes.

[miluoshi]

EDIT: After last update to 5.1 it seems to be fixed for me. Thank you! :)

This is fixed for now, but doesn't support the new Minimal color schemes.

A major part of the issue is that the Excalidraw plugin does not follow Obsidian's semantic variables. I think Excalidraw plugin should add theme compatibility by using Obsidian's CSS variables. This would improve things not just for Minimal but all other themes.

The plugin just embeds external application with its' own styles and I think there's no much control over styling of it. But what I found is that Minimal theme actually already adds compatbility by reassigning Excalidraw's CSS variables to Obsidian ones here, but in incompatible way.

Actually if I comment out this selector block, everything look alright. Is it really necessary for Minimal theme to override colors of css-variables of this plugin?