Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dark theme in OSX breaks look&feel and text boxes #1751

Open
ImOnALampshade opened this Issue Feb 20, 2019 · 45 comments

Comments

Projects
None yet
8 participants
@ImOnALampshade
Copy link

ImOnALampshade commented Feb 20, 2019

Dark theme in OSX breaks look&feel.

White text boxes also have white text in them, making the app basically unusable.

Details for the issue

What did you do?

Installed & ran app for first time

What did you expect to see?

The screenshot on https://sqlitebrowser.org/

What did you see instead?

screen shot 2019-02-20 at 3 18 00 am

Useful extra information

The info below often helps, please fill it out if you're able to. :)

What operating system are you using?

  • Windows: ( version: ___ )
  • Linux: ( distro: ___ )
  • Mac OS: ( _version: 10.14.3)
  • Other: ___

What is your DB4S version?

  • 3.11.1
  • 3.11.0
  • 3.10.1
  • Other: ___

Did you also

@chrda81

This comment has been minimized.

Copy link

chrda81 commented Feb 20, 2019

Running into the same issue 5 min ago. Thanks for posting @ImOnALampshade

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 20, 2019

Yeah, it's a known issue on both MacOS and Windows, that doesn't (yet) seem to have a fix because the GUI toolkit we use (Qt) doesn't yet handle dark mode properly on those platforms. 😦

We have an issue tracking it here: #1493

One potential avenue (for us) would be to recompile the application using Qt 5.12.1 (the very latest release), as things are a bit better there. However that release of Qt has another showstopper bug (#1658) stopping us using it. If/when they fix that, we'd be able to recompile using that, and it'd be a bit better. Still not perfect though... we really need Qt to get "full" dark theme support happening.

The only way I know of getting the application to work on MacOS Mojave... is to turn off Dark mode while using it. And yeah, that's pretty terrible. 😦

Open to suggestions though, just in case we've missed something that would help. 😄

@gerwinbrunner

This comment has been minimized.

Copy link

gerwinbrunner commented Feb 20, 2019

Had the same issue

@gerwinbrunner

This comment has been minimized.

Copy link

gerwinbrunner commented Feb 20, 2019

Is there a way to switch to the regular theme in the app?

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 20, 2019

I wish. From what I can tell, you need to switch off Dark mode in the mojave System Preferences. eg for all applications. As that's what Qt checks and picks up on. 😦

Someone with deeper Qt or macOS knowledge may know of a workaround, it's just (so far) that's the best we know.

@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Feb 20, 2019

Wow, this is highly expected and highly broken (except in Linux).

One solution would be to link using Qt 5.12 and work around #1658 by disabling word wrapping.

Another is to use a dark stylesheet and give a preference option:

  • Follow desktop
  • Dark style

I'm testing with https://github.com/ColinDuquesnoy/QDarkStyleSheet
imagen

It isn't perfect, but probably better than what Qt currently does for macOS and Windows.

@justinclift Could we use ColinDuquesnoy/QDarkStyleSheet? Are the licenses compatible?

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 20, 2019

Could we use ColinDuquesnoy/QDarkStyleSheet?

We could probably try it out in an experimental branch + build to see if it improves things.

Looking at that project's README.md, it has C++ code for enabling it:

QFile f(":qdarkstyle/style.qss");
if (!f.exists())
{
    printf("Unable to set stylesheet, file not found\n");
}
else
{
    f.open(QFile::ReadOnly | QFile::Text);
    QTextStream ts(&f);
    qApp->setStyleSheet(ts.readAll());
}

Ideally we'd be able to dynamically switch between using that style sheet (for dark mode), and the standard one (for normal mode). But if dynamic isn't possible, we could just make two macOS builds, one for dark mode and one for normal.

Are the licenses compatible?

That project is MIT licensed, which is compatible with everything. 😄

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 20, 2019

One solution would be to link using Qt 5.12 and work around #1658 by disabling word wrapping.

Yep. I'm ok to create new builds for people to experiment with, if that would help. 😄

mgrojo added a commit that referenced this issue Feb 20, 2019

Disable word wrapping in the Browse Data table when using Qt 5.2.x
In order to work around #1658 (QTBUG-73721) the word wrapping is disabled
when compiling with Qt 5.12.x. This workaround will also allow compiling
with better macOS dark theme support by using Qt 5.12 (see issues #1493 and
#1751 and Qt bug reports: QTBUG-68891 and QTBUG-71020) without affecting
builds using previous versions of Qt.
@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Feb 20, 2019

Yep. I'm ok to create new builds for people to experiment with, if that would help. 😄

In my last commit I've disabled word wrapping when the Qt version is greater or equal than 5.12.0. This would allow us compiling with Qt without stumbling upon #1658 but without losing word wrapping in unaffected versions. So if we change to Qt 5.12.1, at least for macOS, the macOS dark mode support will be improved. But we have to take into account that https://bugreports.qt.io/browse/QTBUG-71020 is still unresolved, as we've already seen in #1493 (comment).

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 20, 2019

Thanks @mgrojo, I'll make a new build from the master branch using Qt 5.12.1 in our Mojave VM, so people can test it.

Should we experiment with that QDarkStyleSheet thing too?

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 20, 2019

New build is in progress. I don't yet have a good idea of how long builds on that VM take, though I know it's pretty slow. Could take around an hour, but not sure.

@justinclift justinclift changed the title Dark them in OSX breaks look&feel and text boxes Dark theme in OSX breaks look&feel and text boxes Feb 20, 2019

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 20, 2019

@ImOnALampshade @chrda81 @gerwinbrunner @b2397 @matpag @Raistlfiren @spig @jonathanlmarsh Here's a first build using Qt 5.12.1, which should make Dark Mode support a bit better:

With that... what do you reckon?

Note for future use - Seems to take just under 40 mins to create builds on the new Mojave VM. So, can create new builds for future tests without tooooo much delay. 😄

@ImOnALampshade

This comment has been minimized.

Copy link
Author

ImOnALampshade commented Feb 21, 2019

This looks much better and fixes the white-on-white text that made it unusable for me when I first installed. So, at least I'm able to do what I needed to.

There's still a couple rough areas - here are screenshots:

Button elements have black text on a dark grey background:
screen shot 2019-02-20 at 9 45 00 pm

The text editor is a white theme, which is fine, but the background of areas with no text is dark grey:
screen shot 2019-02-20 at 9 46 12 pm

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 21, 2019

Thanks @ImOnALampshade. Looks like we're heading in the right direction. Next step, we'll probably investigate that QDarkStyleSheet when @mgrojo has some time to look. Hopefully in the next day(s). 😄

@Nosferican

This comment has been minimized.

Copy link

Nosferican commented Feb 21, 2019

What's the solution for downgrading in the meanwhile?

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 21, 2019

Hmmm, just found something weird. The previous release (3.10.1) works ok. It's not in dark mode, but at least all of the elements are readable and usable.

@mgrojo Any idea why 3.10.1 works ok on Mojave - it just looks like a Light mode application - but 3.11.1 doesn't?

If we can just get 3.11.1 to do the same thing (eg work as if it's light mode), that's probably workable for now.

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 21, 2019

Still getting reports (via Twitter) of the breakage on macOS. Seems to be affecting quite a few people. 😦

To hopefully reduce the number of Mojave users hit by this problem, I've added a note to the 3.11.1 blog post, right near the top in a fairly obvious spot:

Note 2 - If you’re using Dark Mode on macOS Mojave, Do Not download
this release. Dark Mode support is broken (badly) on MacOS. It should
(hopefully) be fixed in the next point release.

That should be pretty clear. 😄

@onen5

This comment has been minimized.

Copy link

onen5 commented Feb 22, 2019

Hit this today. Luckily rolling back to 3.11.0 is safe.

@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Feb 22, 2019

@justinclift

@mgrojo Any idea why 3.10.1 works ok on Mojave - it just looks like a Light mode application - but 3.11.1 doesn't?

Maybe the older Qt version probably used in 3.10.1 did not even try to follow the macOS theme settings?

Should we experiment with that QDarkStyleSheet thing too?

I'm looking at it, but there are some places where the style sheet is eclipsing our own colour specifications. Don't know why. I can push a branch if experimenting in macOS is welcome.

@ImOnALampshade

The text editor is a white theme, which is fine, but the background of areas with no text is dark grey:

It seems the kind of problem that at least could be solved by Restoring Defaults (under Preferences), if the Qt bug isn't inteferring, at least.

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 22, 2019

I can push a branch if experimenting in macOS is welcome.

Yes, definitely. 😄

I'll probably try a build with the same Qt version as our 3.10.1 release too. If it's as simple as just needing to compile with that, then that's an easy win. 😄

mgrojo added a commit that referenced this issue Feb 22, 2019

New setting allowing to set a dark style using a style-sheet
A new setting allows to follow the system style or set a new dark style
based on a the style-sheet provided by
https://github.com/ColinDuquesnoy/QDarkStyleSheet
The style-sheet is licensed under the MIT license. Images contained in
that project are licensed under CC-BY license.

Pending issues:

- Use of stylesheets is incompatible to QPalette. Some colours for
previewing settings in the Preferences dialog are eclipsed by the style-
sheet
See ColinDuquesnoy/QDarkStyleSheet#48

- Changing the style should select matching background and foreground
colours for the Browse Data and SQL tabs in Preferences.

See issues #1751 #1493 and #1738
@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Feb 22, 2019

I've pushed the dark stylesheet changes to the qdarkstyle branch.

@jsejcksn

This comment has been minimized.

Copy link

jsejcksn commented Feb 23, 2019

Just installed for the first time—this seems incredibly unfortunate, and I'm sorry you guys got bit by this. Here's a fix for anyone who doesn't want to downgrade or run a beta:

  1. Quit the app.

  2. Run the following terminal command:

defaults write net.sourceforge.sqlitebrowser NSRequiresAquaSystemAppearance -bool true

This will force the app to run in the light theme even if Dark is selected in System Preferences > General > Appearance.

To revert the previous command (and allow the app to follow the Appearance mode set in System Preferences):

  1. Quit the app

  2. Run the following terminal command:

defaults delete net.sourceforge.sqlitebrowser NSRequiresAquaSystemAppearance

@justinclift If you want to push an updated release for macOS before things are sorted with Qt, just set this key in the app's Info.plist file. See the section entitled Opt Out of Dark Mode at the bottom of Choosing a Specific Appearance for Your App.

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 23, 2019

@jsejcksn Oh wow, that looks like exactly the thing we need. I'll try that in a Mojave VM shortly, and if it works well (which it seems like it should) I'll rebuild our macOS binaries with it (the updated .plist).

@mgrojo Thanks heaps. Will build a new test binaries using that branch, but probably tomorrow more than today. Feeling burnt out atm, and want to take some time out after getting the above build test done. 😄

justinclift added a commit that referenced this issue Feb 23, 2019

Force DB4S to be displayed in light mode on macOS
We don't yet support Dark Mode on macOS Mojave (or above), so need
to keep in light mode.  Without this, DB4S is unusable.

See #1751 for for more details.
@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 23, 2019

Just to be extra careful 😉, I've instead rebuilt todays automatic nightly build for macOS first (with this forced light mode .plist entry). Yep, it's definitely working. For anyone else that wants to try it:

Should be safe to do a 3.11.1 rebuild, so getting that done now.

justinclift added a commit that referenced this issue Feb 23, 2019

Force DB4S to be displayed in light mode on macOS
We don't yet support Dark Mode on macOS Mojave (or above), so need
to keep in light mode.  Without this, DB4S is unusable.

Thanks to @jsejcksn for pointing us in the right direction. :)

See #1751 for for more details.

justinclift added a commit that referenced this issue Feb 23, 2019

Force DB4S to be displayed in light mode on macOS
We don't yet support Dark Mode on macOS Mojave (or above), so need
to keep in light mode.  Without this, DB4S is unusable.

Thanks to @jsejcksn for pointing us in the right direction. :)

See #1751 for for more details.
@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 23, 2019

New build here, which works for me in testing on both macOS High Sierra and Mojave:

I'll update our various download locations (etc) with it over the next few hours. 😄

@ImOnALampshade

This comment has been minimized.

Copy link
Author

ImOnALampshade commented Feb 23, 2019

I just installed the build you posted (in your last comment, 7 minutes ago), and is this intended behavior? When looking at table data, I only see text from the highlighted cell. All of the builds posted above have this issue.

screen shot 2019-02-23 at 1 20 41 am

@jsejcksn

This comment has been minimized.

Copy link

jsejcksn commented Feb 23, 2019

Looks good to me:

3-11-1r2

I downloaded from

@ImOnALampshade Same checksum or different? (verify in terminal with shasum -a 256 /path/to/file.dmg)

@ImOnALampshade

This comment has been minimized.

Copy link
Author

ImOnALampshade commented Feb 23, 2019

Negative, same checksum. I tried re-installing, and then re-downloading from the link you posted then re-installing again, and still see the same thing I posted.

@ImOnALampshade

This comment has been minimized.

Copy link
Author

ImOnALampshade commented Feb 23, 2019

The problem was in my preferences - The color was set to white in the data browser. It must have carried over from an older version I had installed.

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 23, 2019

The download pieces here on GitHub, and on our download cluster, have been updated with the v2 binary for macOS. Also updated the links on the download page and 3.11.1 release notes on the main website.

Just for good measure, also created a new blog entry about the rebuilt binary:

    https://sqlitebrowser.org/blog/macos-installer-rebuilt-for-3-11-1/

... and make a Tweet about it:

    https://twitter.com/sqlitebrowser/status/1099251781199003648

That should do for now. 😄

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 23, 2019

The problem was in my preferences - The color was set to white in the data browser.

*Whew*

Just came here and read that after focusing on getting the rebuilt stuff released. Nearly had a heart attack! 😱

@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Feb 27, 2019

@justinclift The branch qdarkstyle is ready for testing in all platforms.

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 28, 2019

Oops, thanks for the reminder @mgrojo. I'll get some builds created in a few hours (need to get some other stuff done today). 😄

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 28, 2019

Whos, completely forgot to get this done. I'll get it started now. 😄

Going with a macOS build first...

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Feb 28, 2019

The build itself seemed to work ok, but not really noticing anything different in the look?

db4s-issue_1751v2-screenshot1
db4s-issue_1751v2-screenshot2
db4s-issue_1751v2-screenshot3

The build was done on macOS Mojave (needed for the dark mode stuff to be compiled in) + Qt 5.12.1.

  • Also did the "Reset Preferences" thing via the button in our Preferences diaog. No change.
  • Also manually deleted all preference and saved state files (with DB4S not running), then ran it again. No change.

Is there something else I should be trying? 😄

@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Feb 28, 2019

Is there something else I should be trying? 😄

Yes, sorry I forgot to mention the details. You have to change the new preference setting from the default (Follow deskto style) to "Dark style".
imagen

You have to get this:
imagen

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Mar 1, 2019

Oh yeah... with that option set, it does look a lot better:

db4s-issue_1751v2-screenshot4
db4s-issue_1751v2-screenshot5
db4s-issue_1751v2-screenshot6

Looking at the project page for this Dark Style approach, it seems to have been around for several years now. Guessing that means it doesn't require Qt 5.12.x.

I'll make a build with Qt 5.11.x after our nightlies finish building (they're happening atm), and see if that works ok too. With Qt 5.11.x we can avoid the word wrapping issue until the Qt project people have figured out a complete fix. 😄

@justinclift justinclift referenced this issue Mar 1, 2019

Open

3.11.2 - outstanding pieces #1773

6 of 6 tasks complete
@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Mar 1, 2019

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Mar 1, 2019

@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Mar 1, 2019

@mgrojo Reckon it's good enough to merge into master, for wider testing? 😄

Yes, I'll merge it in a moment.

@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Mar 1, 2019

Should we include a copy of https://github.com/ColinDuquesnoy/QDarkStyleSheet/blob/master/LICENSE.md ? Maybe inside directory src/qdarkstyle/style.qss? or added to LICENSE-PLUGINS?

mgrojo added a commit that referenced this issue Mar 1, 2019

New setting allowing to set a dark style using a style-sheet
A new setting allows to follow the system style or set a new dark style
based on a the style-sheet provided by
https://github.com/ColinDuquesnoy/QDarkStyleSheet
The style-sheet is licensed under the MIT license. Images contained in
that project are licensed under CC-BY license.

* Set colours using style-sheet in Data Browser tab of Preferences

The colours of the frame and text-lines previewing the settings in Data
Browser tab need to have being set using a style-sheet, otherwise they
are eclipsed by the dark style-sheet when in use.

* Update preference colours when the application style is changed

In order to have matching colours in all the preferences, the individual
colour settings in Data Browser and SQL tabs are reset to default values
matching the corresponding style setting (dark stylesheet or follow desktop,
which could be dark or light as always).

Additionally, several problems with colour settings in QScintilla have
been fixed:
- We don't use indentation guides
- both sets of lexer colour settings must be used, otherwise the result is
inconsistant and unpredictable:
    * lexer->setDefaultColor|Paper and lexer->setColor|Paper

See issues #1751 #1493 and #1738
@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Mar 1, 2019

It's now merged, with license file in src/qdarkstyle/LICENSE.md.

By the way, I couldn't resist to make some project promotion in https://github.com/ColinDuquesnoy/QDarkStyleSheet/wiki It's also a way to communicate that we've found it useful.

@mgrojo mgrojo self-assigned this Mar 1, 2019

@mgrojo mgrojo modified the milestone: 3.12.0 - Future release Mar 1, 2019

@mgrojo

This comment has been minimized.

Copy link
Contributor

mgrojo commented Mar 1, 2019

I've cleared the milestone, because the appropiate scope for this issue should be the original problem of macOS Mojave, that is ultimatly due to a Qt bug: https://bugreports.qt.io/browse/QTBUG-71020

I'll use #1493 instead.

@justinclift

This comment has been minimized.

Copy link
Member

justinclift commented Mar 2, 2019

... with license file in src/qdarkstyle/LICENSE.md.

Excellent, that seems like the right place for it. 😄

I couldn't resist to make some project promotion in https://github.com/ColinDuquesnoy/QDarkStyleSheet/wiki.

No need to resist, that's well done. Promotion (not done really badly!) is a good thing for projects. 😁

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.