hydescarf / Obsidian-Theme-Mado-11

A simple theme that makes Obsidian feels a bit more like a modern app.
MIT License
75 stars 3 forks source link

Window control buttons broken with "translucent window" option #8

Closed DLimaRafael closed 2 years ago

DLimaRafael commented 2 years ago

First of all, amazing theme! Elegant, simple and all I wanted, but anyway, whenever I switch the "Translucent Window" option ON in the appearance menu, the top right buttons (Minimize, Maximize, Close) don't show up when hovering, in fact, it's as if they don't exist at all, no cursor changes to indicate a button or anything.

EDIT: I'm using Windows 10, latest Obsidian release

Default: image

Translucent Window: image

hydescarf commented 2 years ago

Thank you for liking it :)!

Currently, when opacity:0.75 is applied by the translucent class, the element goes undetectable by mouse at all, no idea why. Applying a z-index:1 fixes it for some reason, so I might apply that if there's no other elegant solution for it later.

Also, while I have no plan to support translucent mode, I might as well do a bit of design fix for translucent mode, though it could be a bit of a hard fix judging from a quick test, so the design might stay the same at the end.

I'll be updating them in a few days though, in the meantime you can apply the z-index:1 to the class titlebar through CSS snippets temporarily.

DLimaRafael commented 2 years ago

Thank you for that quick fix! It works for me (although the buttons are a bit larger than the top bar but it works so I'm happy with it), best theme I've seen in a while ❤️

hydescarf commented 2 years ago

Update is now live! https://github.com/hydescarf/Obsidian-Theme-Mado-11/commit/010e6c4754765cfd1cc3890efa6b746fea7d164b

The reason for it being undetectable during translucent mode was probably because of this: https://stackoverflow.com/questions/23995799/css-hover-not-working-due-to-opacity Currently, well, I've applied z-index:1; to the titlebar as it seems to be the best solution.

Anyway, I have also fixed the weird design on the top-side during translucent mode, they shouldn't be any more "zig-zag cut" thingy now. The transparency also now applies to all places, so the right-sidebar can now be see-through.