Merge pull request #345 from shenlebantongying/staged

feat: bring back custom qt style sheets for Windows

mainwindow.cc

@@ -784,7 +784,7 @@ MainWindow::MainWindow( Config::Class & cfg_ ):
 
   translateLine->setFocus();
 
-  applyQtStyleSheet( cfg.preferences.addonStyle, cfg.preferences.darkMode );
+  applyQtStyleSheet( cfg.preferences.addonStyle, cfg.preferences.displayStyle, cfg.preferences.darkMode );
 
   makeScanPopup();
 
@@ -1131,7 +1131,7 @@ QPrinter & MainWindow::getPrinter()
   return *printer;
 }
 
-void MainWindow::applyQtStyleSheet( QString const & addonStyle, bool const & darkMode )
+void MainWindow::applyQtStyleSheet( QString const & addonStyle,QString const & displayStyle, bool const & darkMode )
 {
   #ifdef Q_OS_WIN32
   if( darkMode )
@@ -1172,20 +1172,30 @@ void MainWindow::applyQtStyleSheet( QString const & addonStyle, bool const & dar
   }
   #endif
 
-  QFile builtInCssFile( ":/qt-style.css" );
+  QFile builtInCssFile( ":src/qtstyle/qt-style.css" );
   builtInCssFile.open( QFile::ReadOnly );
   QByteArray css = builtInCssFile.readAll();
 
 #if defined(Q_OS_MAC)
-  QFile macCssFile( ":/qt-style-macos.css" );
+  QFile macCssFile( ":src/qtstyle/qt-style-macos.css" );
   macCssFile.open( QFile::ReadOnly );
   css += macCssFile.readAll();
 #endif
 
 #if defined(Q_OS_WIN)
-  QFile winCssFile( ":/qt-style-win.css" );
+  QFile winCssFile( ":src/qtstyle/qt-style-win.css" );
   winCssFile.open( QFile::ReadOnly );
   css += winCssFile.readAll();
+
+  // Load an additional stylesheet
+  // Dark Mode doesn't work nice with custom qt style sheets,
+  if (!darkMode){
+    QFile additionalStyle( QString( ":src/qtstyle/qt-%1.css" ).arg( displayStyle ) );
+    if ( additionalStyle.open( QFile::ReadOnly ) ){
+      css += additionalStyle.readAll();
+    }
+  }
+
 #endif
 
   // Try loading a style sheet if there's one
@@ -2211,9 +2221,10 @@ void MainWindow::editPreferences()
     bool needReload = false;
 
     // See if we need to reapply Qt stylesheets
-    if( cfg.preferences.darkMode != p.darkMode )
+    if( cfg.preferences.displayStyle != p.displayStyle ||
+      cfg.preferences.darkMode != p.darkMode )
     {
-      applyQtStyleSheet( p.addonStyle, p.darkMode );
+      applyQtStyleSheet( p.addonStyle, p.displayStyle, p.darkMode );
     }
 
     // see if we need to reapply articleview style

mainwindow.hh

@@ -183,7 +183,7 @@ private:
   ResourceSchemeHandler * resourceSchemeHandler;
 
   /// Applies the custom Qt stylesheet
-  void applyQtStyleSheet( QString const & addonStyle, bool const & darkMode );
+  void applyQtStyleSheet( QString const & addonStyle, QString const & displayStyle ,bool const & darkMode );
 
   /// Creates, destroys or otherwise updates tray icon, according to the
   /// current configuration and situation.

resources.qrc

@@ -9,7 +9,6 @@
         <file>icons/warning.png</file>
         <file>article-style.css</file>
         <file>article-style-print.css</file>
-        <file>qt-style.css</file>
         <file>icons/icon32_dsl.png</file>
         <file>icons/icon32_stardict.png</file>
         <file>icons/icon32_xdxf.png</file>
@@ -36,8 +35,6 @@
         <file>article-style-st-lingoes.css</file>
         <file>icons/icon32_lingoes.png</file>
         <file>article-style-st-lingoes-blue.css</file>
-        <file>qt-style-macos.css</file>
-        <file>qt-style-win.css</file>
         <file>icons/mdict.png</file>
         <file>icons/downarrow.png</file>
         <file>icons/blank.png</file>
@@ -99,5 +96,14 @@
         <file>article-style-st-classic.css</file>
         <file>icons/old-arrow.png</file>
         <file>icons/old-downarrow.png</file>
+        <file>src/qtstyle/qt-babylon.css</file>
+        <file>src/qtstyle/qt-classic.css</file>
+        <file>src/qtstyle/qt-lingoes-blue.css</file>
+        <file>src/qtstyle/qt-lingoes.css</file>
+        <file>src/qtstyle/qt-lingvo.css</file>
+        <file>src/qtstyle/qt-modern.css</file>
+        <file>src/qtstyle/qt-style-macos.css</file>
+        <file>src/qtstyle/qt-style-win.css</file>
+        <file>src/qtstyle/qt-style.css</file>
     </qresource>
 </RCC>

src/qtstyle/README.txt

@@ -0,0 +1,13 @@
+Qt style sheets
+
+Loading order:
+
+ 1.  qt-style.css will be loaded first.
+ 2.  platform specific styles -> qt-style-macos.css and qt-style-win.css
+(3.) On windows, additional style will be loaded according to Article View's style.
+
+--
+
+Qt Style Sheets Reference:
+
+https://doc.qt.io/qt-6/stylesheet-reference.html

src/qtstyle/qt-babylon.css

@@ -0,0 +1,4 @@
+MainWindow #searchPane #translateLine
+{
+  font-weight: bold;
+}

src/qtstyle/qt-classic.css

@@ -0,0 +1,137 @@
+#translateLine,
+#wordList,
+#dictsPane,
+#dictsList,
+#historyPane,
+#historyList,
+#favoritesPane,
+#favoritesTree {
+  background: #fefdeb;
+  color: black;
+}
+
+#navToolbar #menuButton::menu-indicator {
+  image: none;
+}
+
+#navToolbar #translateLine
+{
+  border: 1px solid gray;
+  border-radius: 3px;
+  padding: 1px 3px 2px 3px;
+  border-top-left-radius: 0px;
+  border-bottom-left-radius: 0px;
+  margin-left: 0px;
+}
+
+#navToolbar GroupComboBox
+{
+  margin-right: 0px;
+  border: 1px solid gray;
+  border-right: 1px transparent;
+  border-radius: 3px;
+  border-top-right-radius: 0px;
+  border-bottom-right-radius: 0px;
+  padding: 2px 4px 2px 4px;
+}
+
+#navToolbar GroupComboBox:on {
+  padding: 3px 3px 1px 5px;
+}
+
+#navToolbar GroupComboBox::drop-down {
+   subcontrol-origin: padding;
+   subcontrol-position: top right;
+   width: 15px;
+   border-left: 1px solid darkgray;
+   border-right: 1px transparent;
+}
+
+#navToolbar GroupComboBox::down-arrow {
+    image: url(:/icons/1downarrow.svg);
+    max-height: 100%;
+}
+
+QTabBar::close-button {
+  image: url(:/icons/closetab.svg)
+}
+QTabBar::close-button:hover {
+  image: url(:/icons/closetab-hover.png)
+}
+
+MainStatusBar #text
+{
+  border-top-right-radius: 3px;
+  border-top: 1px solid palette(dark);
+  border-right: 1px solid palette(dark);
+  background: palette(window);
+  padding: 2px;
+}
+
+MainStatusBar #icon
+{
+  border-top: 1px solid palette(dark);
+  background: palette(window);
+  padding: 2px;
+  padding-left: 4px;
+  padding-right: 0px;
+}
+
+ScanPopup #translateLine
+{
+  margin: 0px;
+  padding: 1px 3px 1px 3px;
+  border: 1px solid gray;
+  border-radius: 3px;
+  border-top-left-radius: 0px;
+  border-bottom-left-radius: 0px;
+}
+
+ScanPopup GroupComboBox
+{
+  margin: 0px 0px 0px 1px;
+  padding: 1px 4px 1px 4px;
+  border: 1px solid gray;
+  border-right: 1px transparent;
+  border-radius: 3px;
+  border-top-right-radius: 0px;
+  border-bottom-right-radius: 0px;
+}
+
+ScanPopup GroupComboBox:on {
+  padding: 3px 3px 1px 5px;
+}
+
+ScanPopup GroupComboBox::drop-down {
+   subcontrol-origin: padding;
+   subcontrol-position: top right;
+   width: 15px;
+   border-left: 1px solid darkgray;
+   border-right: 1px transparent;
+}
+
+ScanPopup GroupComboBox::down-arrow {
+   image: url(:/icons/1downarrow.svg);
+  max-height: 100%;
+}
+
+.ScanPopup #outerFrame
+{
+  border: 1px solid palette(dark);
+}
+
+.ScanPopup MainStatusBar #text
+{
+  border-bottom: 1px solid palette(dark);
+}
+
+.ScanPopup MainStatusBar[hasImage="false"] #text
+{
+  border-left: 1px solid palette(dark);
+}
+
+.ScanPopup MainStatusBar #icon
+{
+  border-left: 1px solid palette(dark);
+  border-bottom: 1px solid palette(dark);
+}

src/qtstyle/qt-lingoes-blue.css

@@ -0,0 +1,85 @@
+MainWindow {
+    background-color: #CFDDF0;
+}
+
+#translateLine,
+#wordList,
+#dictsPane,
+#dictsList,
+#historyPane,
+#historyList,
+#favoritesPane,
+#favoritesTree {
+    background: #EAF0F8;
+    color: darkblue;
+}
+
+GroupComboBox {
+    background: #EAF0F8;
+    color: darkblue;
+}
+
+MainWindow #menubar {
+    background-color: qlineargradient(x1:0, y1:0, x2:0, y2:1,
+                      stop:0 #F0F6FF, stop:0.5 #D2E0F5, stop:0.9 #DCEBFF, stop:1 #F0F6FF);
+}
+
+MainWindow #menubar::item {
+    padding: 2px 8px;
+    background: transparent;
+}
+
+MainWindow #menubar::item:selected { /* when selected using mouse or keyboard */
+    background: #839EC7;
+}
+
+MainWindow #menubar::item:pressed {
+    background: #728AAD;
+}
+
+MainWindow #centralWidget QTabBar::tab {
+    border: 1px solid #667B9B;
+    border-bottom-color: #667B9B;
+    border-top-left-radius: 4px;
+    border-top-right-radius: 4px;
+    padding: 1px 3px;
+    margin-left: 1px;
+    margin-top: 2px;
+    margin-bottom: 2px;
+    background-color: #CFDDF0;
+    color: darkslategray;
+}
+
+MainWindow #centralWidget QTabBar::tab:selected {
+    background-color: #839EC7;
+    color: #fff;
+    border-bottom-style: none;
+}
+
+
+ArticleView #searchFrame QMenu {background-color: none}
+ArticleView QMenu {background-color: none} 
+
+QMainWindow::separator {
+     width:  1px; /* when vertical */
+     height: 1px; /* when horizontal */
+} 
+
+#dictsPaneTitleBar {
+  margin: 2px;
+} 
+
+/* Colored header for the History Pane */
+#historyPaneTitleBar {
+  margin: 2px;
+} 
+
+ScanPopup #outerFrame
+{
+   background-color: #CEDDEF;
+}
+
+ScanPopup #dictionaryBar
+{
+   background: #CEDDEF;
+}

src/qtstyle/qt-lingoes.css

@@ -0,0 +1,11 @@
+#translateLine,
+#wordList,
+#dictsPane,
+#dictsList,
+#historyPane,
+#historyList,
+#favoritesPane,
+#favoritesTree {
+  background: #fefdeb;
+  color: black;
+}

src/qtstyle/qt-lingvo.css

@@ -0,0 +1,11 @@
+#translateLine,
+#wordList,
+#dictsPane,
+#dictsList,
+#historyPane,
+#historyList,
+#favoritesPane,
+#favoritesTree {
+  background: white;
+  color: black;
+}

src/qtstyle/qt-modern.css

@@ -0,0 +1,57 @@
+/* WARNING: hides all separators! */
+#navToolbar::separator {
+  width: 0px;
+}
+
+/* Another way to hide specific separators */
+#navToolbar #beforeOptionsSeparator, #navToolbar #beforeScanPopupSeparator, #navToolbar #afterScanPopupSeparator, #navToolbar #separatorBeforeZoom, #navToolbar #separatorBeforeSave {
+  background: rgba(0,0,0,0%);
+  width: 0px;
+  margin: -3px;
+}
+
+/* Hide various buttons in the toolbar: */
+#navToolbar #menuButtonXX, #navToolbar #soundButtonXX, #navToolbar #backButtonXX, #navToolbar #forwardButtonXX, #navToolbar #zoomInButtonXX, #navToolbar #zoomOutButtonXX, #navToolbar #zoomBaseButtonXX, #navToolbar #saveArticleButton, #navToolbar #printButton {
+  width:   0px;
+  height:  0px;
+  margin:  -3px;
+}
+
+/* remove the main toolbar handle */
+#navToolbar::handle, #dictionaryBar::handle {
+  image: none;
+}
+
+#navToolbar #scanPopupButton {
+  margin-left: 5px;
+}
+
+/* Colored header for the "Found in Dictionaries:" pane */
+#dictsPaneTitleBar {
+  margin: 2px;
+}
+
+/* Colored header for the History Pane */
+#historyPaneTitleBar {
+  margin: 2px;
+}
+
+/* Thin separators between the main UI and sidebars */
+QMainWindow::separator {
+     width:  1px; /* when vertical */
+     height: 1px; /* when horizontal */
+}
+
+ScanPopup #goBackButtonAA,
+/* ScanPopup #queryError,        */
+ScanPopup #goForwardButtonAA,
+ScanPopup #wordListButtonXX,
+ScanPopup #pronounceButtonAA,
+ScanPopup #sendWordButtonXX
+/* ScanPopup #showDictionaryBar, */
+/* ScanPopup #pinButton */
+{
+  width: 0px;
+  height: 0px;
+  margin: -4px;
+}

src/qtstyle/qt-style.css

@@ -1,7 +1,13 @@
-MainWindow #translateLine, ScanPopup #translateLine, MainWindow #wordList, MainWindow #dictsPane #dictsList, MainWindow #historyPane #historyList, MainWindow #favoritesPane #favoritesTree {
+#translateLine,
+#wordList,
+#dictsPane,
+#dictsList,
+#historyPane,
+#historyList,
+#favoritesPane,
+#favoritesTree {
 }
 
-
 #translateLine[noResults="true"] {
     background: #febb7d;
 }