From 1dcd65e7ddffa61196f9d3f0f99c30aa0304d27b Mon Sep 17 00:00:00 2001
From: Le Tan <tamlokveer@gmail.com>
Date: Mon, 11 Dec 2017 20:48:18 +0800
Subject: [PATCH] themes: bug fix

---
 src/resources/markdown_template.html          |  12 +-
 .../themes/v_pure/arrow_dropdown_white.svg    |   9 ++
 src/resources/themes/v_pure/v_pure.palette    |  34 +++++-
 src/resources/themes/v_pure/v_pure.qss        | 114 ++++++++++++++++--
 src/resources/themes/v_white/v_white.palette  |   7 ++
 src/resources/themes/v_white/v_white.qss      |  46 ++++++-
 src/utils/viconutils.h                        |   5 +
 src/utils/vutils.cpp                          |  15 ++-
 src/utils/vutils.h                            |   2 +
 src/vconfigmanager.cpp                        |   2 +-
 src/vmainwindow.cpp                           |   9 +-
 src/vmdeditor.cpp                             |   5 +-
 src/vnote.cpp                                 |   1 +
 src/vnote.qrc                                 |   1 +
 src/vpalette.cpp                              |   8 +-
 src/vpalette.h                                |   5 +-
 src/vtoolbox.cpp                              |  26 +++-
 src/vtoolbox.h                                |  14 ++-
 18 files changed, 267 insertions(+), 48 deletions(-)
 create mode 100644 src/resources/themes/v_pure/arrow_dropdown_white.svg

diff --git a/src/resources/markdown_template.html b/src/resources/markdown_template.html
index e06c9626..4dd4a332 100644
--- a/src/resources/markdown_template.html
+++ b/src/resources/markdown_template.html
@@ -8,12 +8,12 @@
 
     <style type="text/css">
         @keyframes flash {
-            0% { color: #75C5B5; }
-            10% { color: #15AE67; }
-            40% { color: #15AE67; }
-            50% { color: #75C5B5; }
-            60% { color: #15AE67; }
-            90% { color: #15AE67; }
+            0% { color: @template_title_flash_light_fg; }
+            10% { color: @template_title_flash_dark_fg; }
+            40% { color: @template_title_flash_dark_fg; }
+            50% { color: @template_title_flash_light_fg; }
+            60% { color: @template_title_flash_dark_fg; }
+            90% { color: @template_title_flash_dark_fg; }
         }
 
         .highlighted-anchor {
diff --git a/src/resources/themes/v_pure/arrow_dropdown_white.svg b/src/resources/themes/v_pure/arrow_dropdown_white.svg
new file mode 100644
index 00000000..84e55dea
--- /dev/null
+++ b/src/resources/themes/v_pure/arrow_dropdown_white.svg
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="512px" height="512px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
+<g>
+	<polygon style="fill:#F5F5F5" points="128,192 256,320 384,192 	"/>
+</g>
+</svg>
diff --git a/src/resources/themes/v_pure/v_pure.palette b/src/resources/themes/v_pure/v_pure.palette
index 1a537e4d..a71be7e3 100644
--- a/src/resources/themes/v_pure/v_pure.palette
+++ b/src/resources/themes/v_pure/v_pure.palette
@@ -11,6 +11,9 @@ codeblock_css_file=v_pure_codeblock.css
 ; Abstract color attributes.
 master_fg=#F5F5F5
 master_bg=#556DE8
+master_focus_bg=#6A80F1
+master_hover_bg=#6A80F1
+master_pressed_bg=#4561ED
 
 base_fg=#222222
 base_bg=#EAEAEA
@@ -87,6 +90,10 @@ vim_indicator_cmd_edit_pending_bg=@selected_bg
 ; VTabIndicator.
 tab_indicator_label_fg=@base_fg
 
+; Html template.
+template_title_flash_light_fg=#A0ACE5
+template_title_flash_dark_fg=@master_bg
+
 [widgets]
 ; Widget color attributes.
 
@@ -125,7 +132,9 @@ toolbutton_icon_fg=@icon_fg
 toolbutton_icon_danger_fg=@danger_icon_fg
 
 ; Toolbox.
-toolbox_icon_fg=@icon_fg
+toolbox_icon_fg=@master_bg
+toolbox_icon_active_fg=@master_fg
+toolbox_title_border=@master_bg
 
 ; Dockwidget.
 dockwidget_title_fg=@title_fg
@@ -137,15 +146,19 @@ pushbutton_fg=@base_fg
 pushbutton_bg=transparent
 pushbutton_border=@border_bg
 pushbutton_pressed_bg=@pressed_bg
+pushbutton_focus_bg=@focus_bg
 pushbutton_checked_bg=@selected_bg
 pushbutton_hover_bg=@hover_bg
 pushbutton_default_border=@master_bg
+pushbutton_disabled_fg=@disabled_fg
+pushbutton_disabled_bg=@pushbutton_bg
 
 pushbutton_specialbtn_fg=@master_fg
 pushbutton_specialbtn_bg=@master_bg
-pushbutton_specialbtn_hover_bg=#3F51B5
-pushbutton_specialbtn_checked_bg=#3949AB
-pushbutton_specialbtn_pressed_bg=#303F9F
+pushbutton_specialbtn_focus_bg=@master_focus_bg
+pushbutton_specialbtn_hover_bg=@master_hover_bg
+pushbutton_specialbtn_checked_bg=#3F51B5
+pushbutton_specialbtn_pressed_bg=@master_pressed_bg
 
 pushbutton_cornerbtn_hover_bg=@hover_bg
 pushbutton_cornerbtn_focus_bg=@focus_bg
@@ -175,6 +188,12 @@ pushbutton_dangerbtn_hover_fg=#FFF
 pushbutton_dangerbtn_hover_bg=#C9302C
 pushbutton_dangerbtn_hover_border=#AC2925
 
+pushbutton_toolboxbtn_active_fg=@master_fg
+pushbutton_toolboxbtn_active_bg=@master_bg
+pushbutton_toolboxbtn_active_focus_bg=@master_focus_bg
+pushbutton_toolboxbtn_active_hover_bg=@master_hover_bg
+pushbutton_toolboxbtn_active_pressed_bg=@master_pressed_bg
+
 button_icon_fg=@icon_fg
 button_icon_danger_fg=@danger_icon_fg
 
@@ -191,6 +210,13 @@ combobox_focus_bg=@edit_focus_bg
 combobox_focus_border=@edit_focus_border
 combobox_item_icon_fg=@item_icon_fg
 
+combobox_notebookselector_fg=@master_fg
+combobox_notebookselector_bg=@master_bg
+combobox_notebookselector_hover_fg=@master_fg
+combobox_notebookselector_hover_bg=@master_hover_bg
+combobox_notebookselector_focus_fg=@master_fg
+combobox_notebookselector_focus_bg=@master_pressed_bg
+
 ; Label.
 label_fg=@base_fg
 label_titlelabel_fg=@title_fg
diff --git a/src/resources/themes/v_pure/v_pure.qss b/src/resources/themes/v_pure/v_pure.qss
index ef4d8ace..7bd4404e 100644
--- a/src/resources/themes/v_pure/v_pure.qss
+++ b/src/resources/themes/v_pure/v_pure.qss
@@ -183,6 +183,10 @@ QPushButton {
     min-width: 80px;
 }
 
+QPushButton:focus {
+    background-color: @pushbutton_focus_bg;
+}
+
 QPushButton:pressed {
     background-color: @pushbutton_pressed_bg;
 }
@@ -207,6 +211,11 @@ QPushButton:default {
     border-color: @pushbutton_default_border;
 }
 
+QPushButton:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton::menu-indicator {
     image: url(arrow_dropdown.svg);
     width: 16px;
@@ -218,6 +227,10 @@ QPushButton[SpecialBtn="true"] {
     background: @pushbutton_specialbtn_bg;
 }
 
+QPushButton[SpecialBtn="true"]:focus {
+    background-color: @pushbutton_specialbtn_focus_bg;
+}
+
 QPushButton[SpecialBtn="true"]:pressed {
     background-color: @pushbutton_specialbtn_pressed_bg;
 }
@@ -234,6 +247,11 @@ QPushButton[SpecialBtn="true"]:hover {
     background-color: @pushbutton_specialbtn_hover_bg;
 }
 
+QPushButton[SpecialBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[CornerBtn="true"] {
     padding: 4px -2px 4px -2px;
     margin: 0px;
@@ -258,6 +276,11 @@ QPushButton[CornerBtn="true"]:pressed {
     background-color: @pushbutton_cornerbtn_pressed_bg;
 }
 
+QPushButton[CornerBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[StatusBtn="true"] {
     font: bold;
     padding: 0px 2px 0px 2px;
@@ -279,6 +302,11 @@ QPushButton[StatusBtn="true"]:pressed {
     background-color: @pushbutton_statusbtn_pressed_bg;
 }
 
+QPushButton[StatusBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[FlatBtn="true"] {
     padding: 4px;
     margin: 0px;
@@ -295,10 +323,15 @@ QPushButton[FlatBtn="true"]:focus {
     background-color: @pushbutton_flatbtn_focus_bg;
 }
 
-QPushButton[FlatBtn="true"]:focus {
+QPushButton[FlatBtn="true"]:pressed {
     background-color: @pushbutton_flatbtn_pressed_bg;
 }
 
+QPushButton[FlatBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[SelectionBtn="true"] {
     padding: 4px 10px 4px 10px;
     border: none;
@@ -316,10 +349,15 @@ QPushButton[SelectionBtn="true"]:focus {
     background-color: @pushbutton_selectionbtn_focus_bg;
 }
 
-QPushButton[SelectionBtn="true"]:focus {
+QPushButton[SelectionBtn="true"]:pressed {
     background-color: @pushbutton_selectionbtn_pressed_bg;
 }
 
+QPushButton[SelectionBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[TitleBtn="true"] {
     padding: 4px;
     margin: 0px;
@@ -336,10 +374,15 @@ QPushButton[TitleBtn="true"]:focus {
     background-color: @pushbutton_titlebtn_focus_bg;
 }
 
-QPushButton[TitleBtn="true"]:focus {
+QPushButton[TitleBtn="true"]:pressed {
     background-color: @pushbutton_titlebtn_pressed_bg;
 }
 
+QPushButton[TitleBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[DangerBtn="true"] {
     color: @pushbutton_dangerbtn_fg;
     border-color: @pushbutton_dangerbtn_border;
@@ -353,6 +396,37 @@ QPushButton[DangerBtn="true"]:hover {
     background-color: @pushbutton_dangerbtn_hover_bg;
 }
 
+QPushButton[DangerBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
+QPushButton[ToolBoxActiveBtn="true"] {
+    padding: 4px;
+    margin: 0px;
+    border: none;
+    color: @pushbutton_toolboxbtn_active_fg;
+    background-color: @pushbutton_toolboxbtn_active_bg;
+    min-width: -1;
+}
+
+QPushButton[ToolBoxActiveBtn="true"]:focus {
+    background-color: @pushbutton_toolboxbtn_active_focus_bg;
+}
+
+QPushButton[ToolBoxActiveBtn="true"]:hover {
+    background-color: @pushbutton_toolboxbtn_active_hover_bg;
+}
+
+QPushButton[ToolBoxActiveBtn="true"]:pressed {
+    background-color: @pushbutton_toolboxbtn_active_pressed_bg;
+}
+
+QPushButton[ToolBoxActiveBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 VButtonMenuItem {
     padding: 5px;
     padding-right: 30px;
@@ -393,6 +467,11 @@ VButtonMenuItem:hover {
 VButtonMenuItem:focus {
     background-color: @menubar_item_selected_bg;
 }
+
+VButtonMenuItem:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
 /* End QPushButton*/
 
 /* QComboBox */
@@ -446,11 +525,26 @@ QComboBox#NotebookSelector {
     padding-top: 3px;
     padding-bottom: 3px;
     icon-size: 30px;
+    color: @combobox_notebookselector_fg;
+    background: @combobox_notebookselector_bg;
+}
+
+QComboBox#NotebookSelector::down-arrow {
+    image: url(arrow_dropdown_white.svg);
+    width: 20px;
+    height: 20px;
+}
+
+QComboBox#NotebookSelector:hover {
+    border: none;
+    color: @combobox_notebookselector_hover_fg;
+    background: @combobox_notebookselector_hover_bg;
 }
 
 QComboBox#NotebookSelector:focus, QComboBox#NotebookSelector:on {
     border: none;
-    background: @combobox_bg
+    color: @combobox_notebookselector_focus_fg;
+    background: @combobox_notebookselector_focus_bg;
 }
 
 QComboBox#NotebookSelector QListWidget {
@@ -602,16 +696,16 @@ QTabWidget::pane {
 QTabBar::tab {
     color: @tabbar_fg;
     background: @tabbar_bg;
-    border: 1px solid @tabbar_border;
-    border-bottom: none;
-    border-top: none;
+    border: none;
+    border-top: 2px solid transparent;
+    border-right: 1px solid @tabbar_border;
     padding: 2px;
 }
 
 QTabBar::tab:selected {
     color: @tabbar_selected_fg;
     background: @tabbar_selected_bg;
-    border-top: 3px solid @master_bg;
+    border-top: 2px solid @master_bg;
 }
 
 QTabBar::tab:hover {
@@ -1120,3 +1214,7 @@ QHeaderView::up-arrow {
 QWidget#FindReplaceTitleWidget {
     background: @title_bg;
 }
+
+QWidget[ToolBoxTitle="true"] {
+    border-bottom: 2px solid @toolbox_title_border;
+}
diff --git a/src/resources/themes/v_white/v_white.palette b/src/resources/themes/v_white/v_white.palette
index 6f76915d..898c7d52 100644
--- a/src/resources/themes/v_white/v_white.palette
+++ b/src/resources/themes/v_white/v_white.palette
@@ -80,6 +80,10 @@ vim_indicator_cmd_edit_pending_bg=@selected_bg
 ; VTabIndicator.
 tab_indicator_label_fg=@base_fg
 
+; Html template.
+template_title_flash_light_fg=#A0ACE5
+template_title_flash_dark_fg=#556DE8
+
 [widgets]
 ; Widget color attributes.
 
@@ -120,6 +124,7 @@ toolbutton_icon_danger_fg=@danger_icon_fg
 
 ; Toolbox.
 toolbox_icon_fg=@icon_fg
+toolbox_icon_active_fg=@icon_fg
 
 ; Dockwidget.
 dockwidget_title_fg=@title_fg
@@ -134,6 +139,8 @@ pushbutton_pressed_bg=@pressed_bg
 pushbutton_checked_bg=@selected_bg
 pushbutton_hover_bg=@hover_bg
 pushbutton_default_border=#424242
+pushbutton_disabled_fg=@disabled_fg
+pushbutton_disabled_bg=@pushbutton_bg
 
 pushbutton_cornerbtn_hover_bg=@hover_bg
 pushbutton_cornerbtn_focus_bg=@focus_bg
diff --git a/src/resources/themes/v_white/v_white.qss b/src/resources/themes/v_white/v_white.qss
index b0e0bfff..23742308 100644
--- a/src/resources/themes/v_white/v_white.qss
+++ b/src/resources/themes/v_white/v_white.qss
@@ -206,6 +206,11 @@ QPushButton:default {
     border-color: @pushbutton_default_border;
 }
 
+QPushButton:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton::menu-indicator {
     image: url(arrow_dropdown.svg);
     width: 16px;
@@ -236,6 +241,11 @@ QPushButton[CornerBtn="true"]:pressed {
     background-color: @pushbutton_cornerbtn_pressed_bg;
 }
 
+QPushButton[CornerBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[StatusBtn="true"] {
     font: bold;
     padding: 0px 2px 0px 2px;
@@ -257,6 +267,11 @@ QPushButton[StatusBtn="true"]:pressed {
     background-color: @pushbutton_statusbtn_pressed_bg;
 }
 
+QPushButton[StatusBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[FlatBtn="true"] {
     padding: 4px;
     margin: 0px;
@@ -273,10 +288,15 @@ QPushButton[FlatBtn="true"]:focus {
     background-color: @pushbutton_flatbtn_focus_bg;
 }
 
-QPushButton[FlatBtn="true"]:focus {
+QPushButton[FlatBtn="true"]:pressed {
     background-color: @pushbutton_flatbtn_pressed_bg;
 }
 
+QPushButton[FlatBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[SelectionBtn="true"] {
     padding: 4px 10px 4px 10px;
     border: none;
@@ -294,10 +314,15 @@ QPushButton[SelectionBtn="true"]:focus {
     background-color: @pushbutton_selectionbtn_focus_bg;
 }
 
-QPushButton[SelectionBtn="true"]:focus {
+QPushButton[SelectionBtn="true"]:pressed {
     background-color: @pushbutton_selectionbtn_pressed_bg;
 }
 
+QPushButton[SelectionBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[TitleBtn="true"] {
     padding: 4px;
     margin: 0px;
@@ -314,10 +339,15 @@ QPushButton[TitleBtn="true"]:focus {
     background-color: @pushbutton_titlebtn_focus_bg;
 }
 
-QPushButton[TitleBtn="true"]:focus {
+QPushButton[TitleBtn="true"]:pressed {
     background-color: @pushbutton_titlebtn_pressed_bg;
 }
 
+QPushButton[TitleBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 QPushButton[DangerBtn="true"] {
     color: @pushbutton_dangerbtn_fg;
     border-color: @pushbutton_dangerbtn_border;
@@ -331,6 +361,11 @@ QPushButton[DangerBtn="true"]:hover {
     background-color: @pushbutton_dangerbtn_hover_bg;
 }
 
+QPushButton[DangerBtn="true"]:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
+
 VButtonMenuItem {
     padding: 5px;
     padding-right: 30px;
@@ -371,6 +406,11 @@ VButtonMenuItem:hover {
 VButtonMenuItem:focus {
     background-color: @menubar_item_selected_bg;
 }
+
+VButtonMenuItem:disabled {
+    color: @pushbutton_disabled_fg;
+    background-color: @pushbutton_disabled_bg;
+}
 /* End QPushButton*/
 
 /* QComboBox */
diff --git a/src/utils/viconutils.h b/src/utils/viconutils.h
index b3cb3458..58b86685 100644
--- a/src/utils/viconutils.h
+++ b/src/utils/viconutils.h
@@ -40,6 +40,11 @@ public:
         return icon(p_file, g_palette->color("toolbox_icon_fg"));
     }
 
+    static QIcon toolBoxActiveIcon(const QString &p_file)
+    {
+        return icon(p_file, g_palette->color("toolbox_icon_active_fg"));
+    }
+
     static QIcon comboBoxIcon(const QString &p_file)
     {
         return icon(p_file, g_palette->color("combobox_item_icon_fg"));
diff --git a/src/utils/vutils.cpp b/src/utils/vutils.cpp
index 0925bc1e..5df6f28c 100644
--- a/src/utils/vutils.cpp
+++ b/src/utils/vutils.cpp
@@ -410,17 +410,13 @@ int VUtils::showMessage(QMessageBox::Icon p_icon,
     if (p_type == MessageBoxType::Danger) {
         QPushButton *okBtn = dynamic_cast<QPushButton *>(msgBox.button(QMessageBox::Ok));
         if (okBtn) {
-            okBtn->setProperty("DangerBtn", true);
-            okBtn->style()->unpolish(okBtn);
-            okBtn->style()->polish(okBtn);
+            setDynamicProperty(okBtn, "DangerBtn");
         }
     }
 
     QPushButton *defaultBtn = dynamic_cast<QPushButton *>(msgBox.button(p_defaultBtn));
     if (defaultBtn) {
-        defaultBtn->setProperty("SpecialBtn", true);
-        defaultBtn->style()->unpolish(defaultBtn);
-        defaultBtn->style()->polish(defaultBtn);
+        setDynamicProperty(defaultBtn, "SpecialBtn");
     }
 
     return msgBox.exec();
@@ -1100,3 +1096,10 @@ QComboBox *VUtils::getComboBox(QWidget *p_parent)
 
     return box;
 }
+
+void VUtils::setDynamicProperty(QWidget *p_widget, const char *p_prop, bool p_val)
+{
+    p_widget->setProperty(p_prop, p_val);
+    p_widget->style()->unpolish(p_widget);
+    p_widget->style()->polish(p_widget);
+}
diff --git a/src/utils/vutils.h b/src/utils/vutils.h
index 3f89f177..e31ae1b7 100644
--- a/src/utils/vutils.h
+++ b/src/utils/vutils.h
@@ -266,6 +266,8 @@ public:
     // Create and return a QComboBox.
     static QComboBox *getComboBox(QWidget *p_parent = nullptr);
 
+    static void setDynamicProperty(QWidget *p_widget, const char *p_prop, bool p_val = true);
+
     // Regular expression for image link.
     // ![image title]( http://github.com/tamlok/vnote.jpg "alt \" text" )
     // Captured texts (need to be trimmed):
diff --git a/src/vconfigmanager.cpp b/src/vconfigmanager.cpp
index a1671b5b..c82b4775 100644
--- a/src/vconfigmanager.cpp
+++ b/src/vconfigmanager.cpp
@@ -41,7 +41,7 @@ const QString VConfigManager::c_templateConfigFolder = QString("templates");
 
 const QString VConfigManager::c_snippetConfigFolder = QString("snippets");
 
-const QString VConfigManager::c_warningTextStyle = QString("color: red; font: bold");
+const QString VConfigManager::c_warningTextStyle = QString("color: #C9302C; font: bold");
 
 const QString VConfigManager::c_dataTextStyle = QString("font: bold");
 
diff --git a/src/vmainwindow.cpp b/src/vmainwindow.cpp
index 4410f421..5a29821e 100644
--- a/src/vmainwindow.cpp
+++ b/src/vmainwindow.cpp
@@ -84,10 +84,10 @@ VMainWindow::VMainWindow(VSingleInstanceGuard *p_guard, QWidget *p_parent)
 
     initAvatar();
 
-    restoreStateAndGeometry();
-
     changePanelView(m_panelViewState);
 
+    restoreStateAndGeometry();
+
     setContextMenuPolicy(Qt::NoContextMenu);
 
     notebookSelector->update();
@@ -1237,10 +1237,10 @@ void VMainWindow::initDockWindows()
 
     m_toolBox = new VToolBox(this);
     m_toolBox->addItem(outline,
-                       VIconUtils::toolBoxIcon(":/resources/icons/outline.svg"),
+                       ":/resources/icons/outline.svg",
                        tr("Outline"));
     m_toolBox->addItem(m_snippetList,
-                       VIconUtils::toolBoxIcon(":/resources/icons/snippets.svg"),
+                       ":/resources/icons/snippets.svg",
                        tr("Snippets"));
 
     toolDock->setWidget(m_toolBox);
@@ -2045,6 +2045,7 @@ void VMainWindow::saveStateAndGeometry()
 
     if (m_panelViewState == PanelViewState::CompactMode) {
         g_config->setNaviSplitterState(m_naviSplitter->saveState());
+        g_config->setMainSplitterState(m_mainSplitter->saveState());
     } else {
         // In one panel view, it will save the wrong state that the directory tree
         // panel has a width of zero.
diff --git a/src/vmdeditor.cpp b/src/vmdeditor.cpp
index 529babfb..daca9018 100644
--- a/src/vmdeditor.cpp
+++ b/src/vmdeditor.cpp
@@ -97,12 +97,13 @@ void VMdEditor::updateFontAndPalette()
 {
     setFont(g_config->getMdEditFont());
     setPalette(g_config->getMdEditPalette());
+
+    // setPalette() won't change the foreground.
+    setTextColor(g_config->getMdEditPalette().color(QPalette::Text));
 }
 
 void VMdEditor::beginEdit()
 {
-    updateFontAndPalette();
-
     updateConfig();
 
     initInitImages();
diff --git a/src/vnote.cpp b/src/vnote.cpp
index 1702d54e..4a51e0b6 100644
--- a/src/vnote.cpp
+++ b/src/vnote.cpp
@@ -109,6 +109,7 @@ void VNote::updateTemplate()
     const QString codeBlockCssHolder("HIGHLIGHTJS_CSS_PLACE_HOLDER");
 
     s_markdownTemplate = VUtils::readFileFromDisk(c_markdownTemplatePath);
+    g_palette->fillStyle(s_markdownTemplate);
 
     // Must replace the code block holder first.
     s_markdownTemplate.replace(codeBlockCssHolder, g_config->getCodeBlockCssStyleUrl());
diff --git a/src/vnote.qrc b/src/vnote.qrc
index 33b0b889..10f8e1cd 100644
--- a/src/vnote.qrc
+++ b/src/vnote.qrc
@@ -165,5 +165,6 @@
         <file>resources/themes/v_pure/v_pure.css</file>
         <file>resources/themes/v_pure/v_pure_codeblock.css</file>
         <file>resources/themes/v_white/v_white_codeblock.css</file>
+        <file>resources/themes/v_pure/arrow_dropdown_white.svg</file>
     </qresource>
 </RCC>
diff --git a/src/vpalette.cpp b/src/vpalette.cpp
index 5c4f666d..b8ea0180 100644
--- a/src/vpalette.cpp
+++ b/src/vpalette.cpp
@@ -87,14 +87,14 @@ QString VPalette::color(const QString &p_name) const
     return QString();
 }
 
-void VPalette::fillStyle(QString &p_style) const
+void VPalette::fillStyle(QString &p_text) const
 {
     // Cap(2) is the string to be replaced.
     QRegExp reg("(\\s|:)@(\\w+)(?=\\W)");
 
     int pos = 0;
-    while (pos < p_style.size()) {
-        int idx = p_style.indexOf(reg, pos);
+    while (pos < p_text.size()) {
+        int idx = p_text.indexOf(reg, pos);
         if (idx == -1) {
             break;
         }
@@ -106,7 +106,7 @@ void VPalette::fillStyle(QString &p_style) const
             pos = idx + reg.matchedLength();
         } else {
             pos = idx + reg.matchedLength() + val.size() - name.size() - 1;
-            p_style.replace(idx + reg.cap(1).size(), name.size() + 1, val);
+            p_text.replace(idx + reg.cap(1).size(), name.size() + 1, val);
         }
     }
 }
diff --git a/src/vpalette.h b/src/vpalette.h
index 610eed01..d79493cd 100644
--- a/src/vpalette.h
+++ b/src/vpalette.h
@@ -36,6 +36,9 @@ public:
     // Read QSS file.
     QString fetchQtStyleSheet() const;
 
+    // Fill "@xxx" in @p_text with corresponding style.
+    void fillStyle(QString &p_text) const;
+
     // Read themes and return the mappings of editor styles.
     static QMap<QString, QString> editorStylesFromThemes(const QList<QString> &p_themeFiles);
 
@@ -64,8 +67,6 @@ private:
 
     void initPaleteFromSettings(QSettings *p_settings, const QString &p_group);
 
-    void fillStyle(QString &p_style) const;
-
     void fillAbsoluteUrl(QString &p_style) const;
 
     // File path of the palette file.
diff --git a/src/vtoolbox.cpp b/src/vtoolbox.cpp
index 15e595a0..b4102a1b 100644
--- a/src/vtoolbox.cpp
+++ b/src/vtoolbox.cpp
@@ -9,6 +9,7 @@
 
 #include "vnote.h"
 #include "utils/vutils.h"
+#include "utils/viconutils.h"
 
 extern VNote *g_vnote;
 
@@ -23,23 +24,29 @@ void VToolBox::setupUI()
 {
     m_btnLayout = new QHBoxLayout();
     m_btnLayout->addStretch();
+    m_btnLayout->setContentsMargins(0, 0, 0, 2);
+    m_btnLayout->setSpacing(0);
+    QWidget *wid = new QWidget();
+    wid->setProperty("ToolBoxTitle", true);
+    wid->setLayout(m_btnLayout);
 
     m_widgetLayout = new QStackedLayout();
 
     QVBoxLayout *mainLayout = new QVBoxLayout();
-    mainLayout->addLayout(m_btnLayout);
+    mainLayout->addWidget(wid);
     mainLayout->addLayout(m_widgetLayout);
     mainLayout->setContentsMargins(0, 0, 0, 0);
 
     setLayout(mainLayout);
 }
 
-int VToolBox::addItem(QWidget *p_widget, const QIcon &p_iconSet, const QString &p_text)
+int VToolBox::addItem(QWidget *p_widget, const QString &p_iconFile, const QString &p_text)
 {
     int idx = m_items.size();
 
     // New a button.
-    QPushButton *btn = new QPushButton(p_iconSet, "");
+    QIcon icon = VIconUtils::toolBoxIcon(p_iconFile);
+    QPushButton *btn = new QPushButton(icon, "");
     btn->setToolTip(p_text);
     btn->setProperty("FlatBtn", true);
     connect(btn, &QPushButton::clicked,
@@ -58,7 +65,11 @@ int VToolBox::addItem(QWidget *p_widget, const QIcon &p_iconSet, const QString &
     // Insert widget to layout.
     m_widgetLayout->insertWidget(idx, p_widget);
 
-    m_items.push_back(ItemInfo(p_widget, p_text, btn));
+    m_items.push_back(ItemInfo(p_widget,
+                               p_text,
+                               btn,
+                               icon,
+                               VIconUtils::toolBoxActiveIcon(p_iconFile)));
 
     if (m_items.size() == 1) {
         setCurrentIndex(0);
@@ -104,14 +115,19 @@ void VToolBox::setCurrentButtonIndex(int p_idx)
     for (int i = 0; i < m_items.size(); ++i) {
         QPushButton *btn = m_items[i].m_btn;
         btn->setText("");
+        btn->setIcon(m_items[i].m_icon);
         btn->clearFocus();
+        VUtils::setDynamicProperty(btn, "ToolBoxActiveBtn", false);
     }
 
     if (p_idx < 0 || p_idx >= m_items.size()) {
         return;
     }
 
-    m_items[p_idx].m_btn->setText(m_items[p_idx].m_text);
+    QPushButton *curBtn = m_items[p_idx].m_btn;
+    curBtn->setText(m_items[p_idx].m_text);
+    curBtn->setIcon(m_items[p_idx].m_activeIcon);
+    VUtils::setDynamicProperty(curBtn, "ToolBoxActiveBtn", true);
 }
 
 void VToolBox::showNavigation()
diff --git a/src/vtoolbox.h b/src/vtoolbox.h
index 3eae72f8..bb6462d3 100644
--- a/src/vtoolbox.h
+++ b/src/vtoolbox.h
@@ -18,7 +18,7 @@ class VToolBox : public QWidget, public VNavigationMode
 public:
     explicit VToolBox(QWidget *p_parent = nullptr);
 
-    int addItem(QWidget *p_widget, const QIcon &p_iconSet, const QString &p_text);
+    int addItem(QWidget *p_widget, const QString &p_iconFile, const QString &p_text);
 
     void setCurrentIndex(int p_idx);
 
@@ -38,8 +38,14 @@ private:
 
         ItemInfo(QWidget *p_widget,
                  const QString &p_text,
-                 QPushButton *p_btn)
-            : m_widget(p_widget), m_text(p_text), m_btn(p_btn)
+                 QPushButton *p_btn,
+                 const QIcon &p_icon,
+                 const QIcon &p_activeIcon)
+            : m_widget(p_widget),
+              m_text(p_text),
+              m_btn(p_btn),
+              m_icon(p_icon),
+              m_activeIcon(p_activeIcon)
         {
         }
 
@@ -47,6 +53,8 @@ private:
         QString m_text;
 
         QPushButton *m_btn;
+        QIcon m_icon;
+        QIcon m_activeIcon;
     };
 
     void setupUI();