Title bar is always dark and has misaligned buttons on macOS 11

Bug graveyard
, ,
1

Steps to reproduce

Use Obsidian on macOS 11, with or without themes and custom CSS.

Expected result

  1. The title bar should match the chosen theme (light or dark)
  2. The title bar should match the new macOS 11 aesthetic, i.e. be slightly thicker or at least have the buttons aligned properly.

Actual result

  1. The title bar is always dark.
  2. The title bar is slightly cut off because macOS 11 now features thicker title bars.

screenshot

Environment

  • Operating system: macOS 11.1 Big Sur
  • Obsidian version: 0.10.1
2

This is likely an upstream electron problem or something that apple changed recently.
If you have an old installer version you can try to download and install a fresh copy of obsidian from the website. Maybe it will help.

3

has this started to happen with macos 11.1?

4

It started with 11.0 as far as I remember. Both my macOS and Obsidian installations are fresh, as in I didn’t upgrade them from an older system. I just tried to reinstall Obsidian anyway and I still have the same issue.

5

the dark part is normal, it’s part of the theme.

6

@WhiteNoise: I would recommend making the title bar light to conform with the rest of the light theme. From the screenshot below, you can see the Mac UI color changes quickly from light to dark to light again in three adjacent layers. It’s distracting. I searched for the default css in an effort to change it, but could not find any.

Screen Shot 2021-07-20 at 2.35.25 PM

2 Likes
7

The following css snippet will help with the titlebar color. Instructions can be found at Customizing CSS. Basically, the .css snippet should be placed in .obsidian/snippets, which is hidden under the root folder of your vault.

.titlebar {
  background-color: var(--background-secondary-alt);
}

.titlebar-inner {
  color: var(--text-normal);
}

Xnip2021-08-13_13-50-07

1 Like