core,ui: Add dark mode

Also makes highlighting on navigate configurable.

Fixes #466.

src/app/resources/browser/darkmode.css

@@ -0,0 +1,11 @@
+/* Dark mode (see #466). */
+/* TODO: Check if we need -webkit-filter for old Qt WebKit. */
+html {
+    -webkit-filter: invert() hue-rotate(180deg) contrast(70%);
+    filter: invert() hue-rotate(180deg) contrast(70%);
+}
+
+html img {
+    -webkit-filter: invert() hue-rotate(180deg) contrast(120%);
+    filter: invert() hue-rotate(180deg) contrast(120%);
+}

src/app/resources/browser/highlight.css

@@ -1,3 +1,4 @@
+/* Highlight on navigation to an anchor. */
 @-webkit-keyframes targetNavigatedAnimation {
     from { background: #ffffff; }
     50% { background: #ffffdd; }

src/app/resources/zeal.qrc

@@ -1,6 +1,7 @@
 <RCC>
     <qresource prefix="/">
         <file>zeal.ico</file>
+        <file>browser/darkmode.css</file>
         <file>browser/highlight.css</file>
         <file>browser/main.css</file>
         <file>browser/start.html</file>

src/libs/core/settings.cpp

@@ -46,10 +46,6 @@ using namespace Zeal::Core;
 Settings::Settings(QObject *parent) :
     QObject(parent)
 {
-    // TODO: Move to user style sheet (related to #268)
-    QWebSettings::globalSettings()
-            ->setUserStyleSheetUrl(QUrl(QStringLiteral("qrc:///browser/highlight.css")));
-
     load();
 }
 
@@ -83,6 +79,9 @@ void Settings::load()
     minimumFontSize = settings->value(QStringLiteral("minimum_font_size"),
                                       QWebSettings::globalSettings()->fontSize(QWebSettings::MinimumFontSize)).toInt();
     QWebSettings::globalSettings()->setFontSize(QWebSettings::MinimumFontSize, minimumFontSize);
+
+    darkModeEnabled = settings->value(QStringLiteral("dark_mode"), false).toBool();
+    highlightOnNavigateEnabled = settings->value(QStringLiteral("highlight_on_navigate"), true).toBool();
     settings->endGroup();
 
     settings->beginGroup(GroupProxy);
@@ -144,6 +143,8 @@ void Settings::save()
 
     settings->beginGroup(GroupContent);
     settings->setValue(QStringLiteral("minimum_font_size"), minimumFontSize);
+    settings->setValue(QStringLiteral("dark_mode"), darkModeEnabled);
+    settings->setValue(QStringLiteral("highlight_on_navigate"), highlightOnNavigateEnabled);
     settings->endGroup();
 
     settings->beginGroup(GroupProxy);

src/libs/core/settings.h

@@ -58,6 +58,9 @@ public:
 
     // Content
     int minimumFontSize;
+    bool darkModeEnabled;
+    bool highlightOnNavigateEnabled;
+
     // TODO: bool askOnExternalLink;
     // TODO: QString customCss;
 

src/libs/ui/mainwindow.cpp

@@ -55,6 +55,8 @@ using namespace Zeal;
 
 namespace {
 const char startPageUrl[] = "qrc:///browser/start.html";
+const char DarkModeCssUrl[] = ":/browser/darkmode.css";
+const char HighlightOnNavigateCssUrl[] = ":/browser/highlight.css";;
 }
 
 struct TabState
@@ -782,6 +784,25 @@ void MainWindow::applySettings()
         createTrayIcon();
     else
         removeTrayIcon();
+
+    // Content
+    QByteArray ba;
+    if (m_settings->darkModeEnabled) {
+        QScopedPointer<QFile> file(new QFile(DarkModeCssUrl));
+        if (file->open(QIODevice::ReadOnly)) {
+            ba += file->readAll();
+        }
+    }
+
+    if (m_settings->highlightOnNavigateEnabled) {
+        QScopedPointer<QFile> file(new QFile(HighlightOnNavigateCssUrl));
+        if (file->open(QIODevice::ReadOnly)) {
+            ba += file->readAll();
+        }
+    }
+
+    const QString cssUrl = QLatin1String("data:text/css;charset=utf-8;base64,") + ba.toBase64();
+    QWebSettings::globalSettings()->setUserStyleSheetUrl(QUrl(cssUrl));
 }
 
 void MainWindow::toggleWindow()

src/libs/ui/settingsdialog.cpp

@@ -85,11 +85,15 @@ void SettingsDialog::loadSettings()
 
     ui->toolButton->setKeySequence(settings->showShortcut);
 
+    ui->storageEdit->setText(QDir::toNativeSeparators(settings->docsetPath));
+
+    // Tabs Tab
     ui->openNewTabAfterActive->setChecked(settings->openNewTabAfterActive);
 
-    //
+    // Content Tab
     ui->minimumFontSizeSpinBox->setValue(settings->minimumFontSize);
-    ui->storageEdit->setText(QDir::toNativeSeparators(settings->docsetPath));
+    ui->darkModeCheckBox->setChecked(settings->darkModeEnabled);
+    ui->highlightOnNavigateCheckBox->setChecked(settings->highlightOnNavigateEnabled);
 
     // Network Tab
     switch (settings->proxyType) {
@@ -128,6 +132,8 @@ void SettingsDialog::saveSettings()
 
     // Content Tab
     settings->minimumFontSize = ui->minimumFontSizeSpinBox->text().toInt();
+    settings->darkModeEnabled = ui->darkModeCheckBox->isChecked();
+    settings->highlightOnNavigateEnabled = ui->highlightOnNavigateCheckBox->isChecked();
 
     if (QDir::fromNativeSeparators(ui->storageEdit->text()) != settings->docsetPath) {
         settings->docsetPath = QDir::fromNativeSeparators(ui->storageEdit->text());

src/libs/ui/settingsdialog.ui

@@ -206,6 +206,29 @@
          </layout>
         </widget>
        </item>
+       <item>
+        <widget class="QGroupBox" name="styleGroupBox">
+         <property name="title">
+          <string>Style</string>
+         </property>
+         <layout class="QFormLayout" name="formLayout_5">
+          <item row="1" column="0" colspan="2">
+           <widget class="QCheckBox" name="darkModeCheckBox">
+            <property name="text">
+             <string>&amp;Dark Mode</string>
+            </property>
+           </widget>
+          </item>
+          <item row="2" column="0">
+           <widget class="QCheckBox" name="highlightOnNavigateCheckBox">
+            <property name="text">
+             <string>&amp;Highlight on Navigate</string>
+            </property>
+           </widget>
+          </item>
+         </layout>
+        </widget>
+       </item>
        <item>
         <spacer name="verticalSpacer_3">
          <property name="orientation">