Help Needed to Change Pane Separator Color

[Paladin]

Hello,

I use MagicUser theme and there is an exceptional issue for me: the pink color. Using the “Style Settings” support of the application, I have set up the color combination I want. However, with one exception: I cannot change the pink color of the Pane Separator. Could you provide an option for this? Thank you…

[ariehen]

It looks like the pink is only happening when hovering and resizing it, yeah?

You could try this. The value can be a color name ( yellow ), a hex, a rgba, etc.

.workspace-leaf-resize-handle:hover {
    background-color: yellow;
    border-color: yellow;
}

There’s also an aptly named custom property that works as well. One and done:

body {
    --divider-color-hover: olive;
}

[BernardoPires]

Thanks for using MagicUser theme.

Please check theme version 20.5.0. You can select the divider hover color for light and dark modes (Style Settings). The default color is now the same as the active icon (blue).

Style Settings:
UI Settings → Main Theme Colors → Divider hover color

If it is working well you can also close the issue on its repository. Thanks

All the best

[Paladin]

Thanks for the responses. You are amazing! And I love you all so much <3<3<3<3<3

I acted a bit hastily and changed the relevant code in “theme.css”. For those interested, let me share that location too:

/* Dividers */
–divider-color: var(–mu-divider-color);
–divider-color-hover: var(–mu-divider-color-hover);
–divider-width: 1px;
–divider-width-hover: 3px;
–divider-vertical-height: calc(100% - var(–header-height));

[ariehen]

@Paladin

changed the relevant code in “theme.css”.

For next time, don’t edit the theme.css file itself. Any changes you make will be overwritten with a theme update. Use a CSS snippet instead.

https://help.obsidian.md/Extending+Obsidian/CSS+snippets