Add dark theme

include/UserSettingsPage.h

@@ -39,7 +39,7 @@ public:
         void setTheme(QString theme) { theme_ = theme; }
         void setTray(bool state) { isTrayEnabled_ = state; }
 
-        QString theme() const { return !theme_.isEmpty() ? theme_ : "default"; }
+        QString theme() const { return !theme_.isEmpty() ? theme_ : "light"; }
         bool isTrayEnabled() const { return isTrayEnabled_; }
 
 private:
@@ -72,6 +72,8 @@ signals:
         void trayOptionChanged(bool value);
 
 private:
+        void restoreThemeCombo() const;
+
         // Layouts
         QVBoxLayout *topLayout_;
         QVBoxLayout *mainLayout_;

resources/res.qrc

@@ -71,5 +71,6 @@
     <qresource prefix="/styles">
         <file>styles/system.qss</file>
         <file>styles/nheko.qss</file>
+        <file>styles/nheko-dark.qss</file>
     </qresource>
 </RCC>

resources/styles/nheko-dark.qss

@@ -0,0 +1,102 @@
+QLabel {
+    color: #caccd1;
+}
+
+#chatPage,
+#chatPage > * {
+    background-color: #383c4a;
+}
+
+TimelineView,
+TimelineView > * {
+    background-color: #383c4a;
+}
+
+FlatButton {
+    qproperty-foregroundColor: #caccd1;
+    qproperty-backgroundColor: #333;
+}
+
+RaisedButton {
+    qproperty-foregroundColor: #caccd1;
+    qproperty-backgroundColor: #333;
+}
+
+RoomInfoListItem {
+    qproperty-highlightedBackgroundColor: #5294e2;
+    qproperty-hoverBackgroundColor: #39679e;
+    qproperty-backgroundColor: #383c4a;
+
+    qproperty-titleColor: #caccd1;
+    qproperty-subtitleColor: #caccd1;
+
+    qproperty-highlightedTitleColor: #e4e5e8;
+    qproperty-highlightedSubtitleColor: #e4e5e8;
+}
+
+LoadingIndicator {
+    qproperty-color: #caccd1;
+}
+
+UserInfoWidget, UserInfoWidget > * {
+    background-color: #383c4a;
+    color: #b0b3ba;
+}
+
+UserSettingsPage {
+    background-color: #383c4a;
+}
+
+Avatar {
+    qproperty-textColor: black;
+    qproperty-backgroundColor: #b0b3ba;
+}
+
+#displayNameLabel {
+    color: #f2f2f2;
+}
+
+#userIdLabel {
+    color: #f2f2f2;
+}
+
+LogoutDialog,
+LeaveRoomDialog {
+    background-color: #383c4a;
+    color: #caccd1;
+}
+
+WelcomePage,
+LoginPage,
+RegisterPage {
+    background-color: #383c4a;
+    color: #caccd1;
+}
+
+EmojiPanel,
+EmojiPanel > * {
+    background-color: #383c4a;
+    color: #caccd1;
+}
+
+EmojiCategory,
+EmojiCategory > * {
+    background-color: #383c4a;
+    color: #caccd1;
+}
+
+FloatingButton {
+    qproperty-backgroundColor: #efefef;
+    qproperty-foregroundColor: black;
+}
+
+TextField {
+    qproperty-backgroundColor: #383c4e;
+    qproperty-inkColor: #caccd1;
+}
+
+QLineEdit,
+QTextEdit {
+    background-color: #383c4a;
+    color: #caccd1;
+}

src/EmojiPanel.cc

@@ -52,7 +52,9 @@ EmojiPanel::EmojiPanel(QWidget *parent)
         contentLayout->setSpacing(0);
 
         auto emojiCategories = new QFrame(mainWidget);
-        emojiCategories->setStyleSheet("background-color: #f2f2f2");
+        emojiCategories->setStyleSheet(
+          QString("background-color: %1")
+            .arg(palette().color(QPalette::Window).darker(110).name()));
 
         auto categoriesLayout = new QHBoxLayout(emojiCategories);
         categoriesLayout->setSpacing(0);
@@ -64,49 +66,41 @@ EmojiPanel::EmojiPanel(QWidget *parent)
         icon.addFile(":/icons/icons/emoji-categories/people.png");
         peopleCategory->setIcon(icon);
         peopleCategory->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        peopleCategory->setForegroundColor("gray");
 
         auto natureCategory_ = new FlatButton(emojiCategories);
         icon.addFile(":/icons/icons/emoji-categories/nature.png");
         natureCategory_->setIcon(icon);
         natureCategory_->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        natureCategory_->setForegroundColor("gray");
 
         auto foodCategory_ = new FlatButton(emojiCategories);
         icon.addFile(":/icons/icons/emoji-categories/foods.png");
         foodCategory_->setIcon(icon);
         foodCategory_->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        foodCategory_->setForegroundColor("gray");
 
         auto activityCategory = new FlatButton(emojiCategories);
         icon.addFile(":/icons/icons/emoji-categories/activity.png");
         activityCategory->setIcon(icon);
         activityCategory->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        activityCategory->setForegroundColor("gray");
 
         auto travelCategory = new FlatButton(emojiCategories);
         icon.addFile(":/icons/icons/emoji-categories/travel.png");
         travelCategory->setIcon(icon);
         travelCategory->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        travelCategory->setForegroundColor("gray");
 
         auto objectsCategory = new FlatButton(emojiCategories);
         icon.addFile(":/icons/icons/emoji-categories/objects.png");
         objectsCategory->setIcon(icon);
         objectsCategory->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        objectsCategory->setForegroundColor("gray");
 
         auto symbolsCategory = new FlatButton(emojiCategories);
         icon.addFile(":/icons/icons/emoji-categories/symbols.png");
         symbolsCategory->setIcon(icon);
         symbolsCategory->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        symbolsCategory->setForegroundColor("gray");
 
         auto flagsCategory = new FlatButton(emojiCategories);
         icon.addFile(":/icons/icons/emoji-categories/flags.png");
         flagsCategory->setIcon(icon);
         flagsCategory->setIconSize(QSize(categoryIconSize_, categoryIconSize_));
-        flagsCategory->setForegroundColor("gray");
 
         categoriesLayout->addWidget(peopleCategory);
         categoriesLayout->addWidget(natureCategory_);

src/LeaveRoomDialog.cc

@@ -35,7 +35,6 @@ LeaveRoomDialog::LeaveRoomDialog(QWidget *parent)
 
         auto label = new QLabel(tr("Are you sure you want to leave?"), this);
         label->setFont(font);
-        label->setStyleSheet("color: #333333");
 
         layout->addWidget(label);
         layout->addLayout(buttonLayout);

src/LoginPage.cc

@@ -78,7 +78,6 @@ LoginPage::LoginPage(QSharedPointer<MatrixClient> client, QWidget *parent)
         matrixid_input_->setPlaceholderText(tr("e.g @joe:matrix.org"));
 
         spinner_ = new LoadingIndicator(this);
-        spinner_->setColor("#333333");
         spinner_->setFixedHeight(40);
         spinner_->setFixedWidth(40);
         spinner_->hide();

src/TimelineView.cc

@@ -416,6 +416,7 @@ TimelineView::init()
         scroll_widget_ = new QWidget(this);
 
         scroll_layout_ = new QVBoxLayout(scroll_widget_);
+        scroll_layout_->setContentsMargins(15, 0, 15, 15);
         scroll_layout_->addStretch(1);
         scroll_layout_->setSpacing(0);
         scroll_layout_->setObjectName("timelinescrollarea");

src/UserSettingsPage.cc

@@ -96,7 +96,8 @@ UserSettingsPage::UserSettingsPage(QSharedPointer<UserSettings> settings, QWidge
         themeOptionLayout_->setContentsMargins(0, OptionMargin, 0, OptionMargin);
         auto themeLabel_ = new QLabel(tr("App theme"), this);
         themeCombo_      = new QComboBox(this);
-        themeCombo_->addItem("Default");
+        themeCombo_->addItem("Light");
+        themeCombo_->addItem("Dark");
         themeCombo_->addItem("System");
         themeLabel_->setStyleSheet("font-size: 15px;");
 
@@ -104,7 +105,7 @@ UserSettingsPage::UserSettingsPage(QSharedPointer<UserSettings> settings, QWidge
         themeOptionLayout_->addWidget(themeCombo_, 0, Qt::AlignBottom | Qt::AlignRight);
 
         auto general_ = new QLabel(tr("GENERAL"), this);
-        general_->setStyleSheet("font-size: 17px; color: #5d6565");
+        general_->setStyleSheet("font-size: 17px");
 
         mainLayout_ = new QVBoxLayout;
         mainLayout_->setSpacing(7);
@@ -139,7 +140,7 @@ UserSettingsPage::UserSettingsPage(QSharedPointer<UserSettings> settings, QWidge
 void
 UserSettingsPage::showEvent(QShowEvent *)
 {
-        themeCombo_->setCurrentIndex((settings_->theme() == "default" ? 0 : 1));
+        restoreThemeCombo();
         trayToggle_->setState(!settings_->isTrayEnabled()); // Treats true as "off"
 }
 
@@ -161,3 +162,14 @@ UserSettingsPage::paintEvent(QPaintEvent *)
         QPainter p(this);
         style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
 }
+
+void
+UserSettingsPage::restoreThemeCombo() const
+{
+        if (settings_->theme() == "light")
+                themeCombo_->setCurrentIndex(0);
+        else if (settings_->theme() == "dark")
+                themeCombo_->setCurrentIndex(1);
+        else
+                themeCombo_->setCurrentIndex(2);
+}

src/main.cc

@@ -75,15 +75,25 @@ main(int argc, char *argv[])
 
         QFile stylefile;
 
-        if (!settings.contains("user/theme")) {
+        if (!settings.contains("user/theme"))
-                settings.setValue("user/theme", "default");
+                settings.setValue("user/theme", "light");
-        }
+
+        const auto theme = settings.value("user/theme", "light").toString();
+
+        QPalette pal;
 
-        if (settings.value("user/theme").toString() == "default") {
+        if (theme == "light") {
                 stylefile.setFileName(":/styles/styles/nheko.qss");
+                pal.setColor(QPalette::Link, QColor("#333"));
+        } else if (theme == "dark") {
+                stylefile.setFileName(":/styles/styles/nheko-dark.qss");
+                pal.setColor(QPalette::Link, QColor("#d7d9dc"));
         } else {
                 stylefile.setFileName(":/styles/styles/system.qss");
         }
+
+        app.setPalette(pal);
+
         stylefile.open(QFile::ReadOnly);
         QString stylesheet = QString(stylefile.readAll());