Browse Source

enhance: consistent tint color

Tienson Qin 1 week ago
parent
commit
c7098f5e31

+ 29 - 9
ios/App/App/AppViewController.swift

@@ -10,22 +10,27 @@ import Capacitor
 import UIKit
 
 @objc public class AppViewController: CAPBridgeViewController {
-  override public func capacitorDidLoad() {
-    bridge?.registerPluginInstance(UILocalPlugin())
-    bridge?.registerPluginInstance(NativeTopBarPlugin())
-    bridge?.registerPluginInstance(LiquidTabsPlugin())
-    bridge?.registerPluginInstance(NativeBottomSheetPlugin())
-  }
+    override public func capacitorDidLoad() {
+        bridge?.registerPluginInstance(UILocalPlugin())
+        bridge?.registerPluginInstance(NativeTopBarPlugin())
+        bridge?.registerPluginInstance(LiquidTabsPlugin())
+        bridge?.registerPluginInstance(NativeBottomSheetPlugin())
+    }
 
     public override func viewDidLoad() {
         super.viewDidLoad()
 
         // initial setup
-        applyLogseqBackground()
+        applyLogseqTheme()
     }
 
-    private func applyLogseqBackground() {
+    // MARK: - Theme application (background + tint)
+
+    private func applyLogseqTheme() {
         let bg = UIColor.logseqBackground
+        let tint = UIColor.logseqTint
+
+        // Background
         view.backgroundColor = bg
 
         if let webView = self.webView {
@@ -36,6 +41,21 @@ import UIKit
             // Sometimes WKWebView uses an internal subview for its background
             webView.scrollView.subviews.first?.backgroundColor = bg
         }
+
+        // Tint
+        view.tintColor = tint
+        webView?.tintColor = tint
+        webView?.scrollView.tintColor = tint
+
+        // Propagate to container UI if possible
+        navigationController?.view.tintColor = tint
+        navigationController?.navigationBar.tintColor = tint
+        navigationController?.tabBarController?.tabBar.tintColor = tint
+
+        // Global window tint (affects many UIKit + SwiftUI bits)
+        if let window = view.window {
+            window.tintColor = tint
+        }
     }
 
     public override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
@@ -47,6 +67,6 @@ import UIKit
         }
 
         // Re-apply dynamic colors when light/dark changes
-        applyLogseqBackground()
+        applyLogseqTheme()
     }
 }

+ 1 - 0
ios/App/App/SceneDelegate.swift

@@ -44,6 +44,7 @@ class SceneDelegate: UIResponder, UIWindowSceneDelegate {
         // 3) Standard UIWindowScene setup
         let window = UIWindow(windowScene: windowScene)
         window.rootViewController = hosting
+        window.tintColor = UIColor.logseqTint
         self.window = window
         window.makeKeyAndVisible()
 

+ 20 - 1
ios/App/App/Theme.swift

@@ -3,14 +3,33 @@ import SwiftUI
 
 extension UIColor {
     static let logseqLight = UIColor(red: 0xfc/255, green: 0xfc/255, blue: 0xfc/255, alpha: 1)
+    static let logseqDark  = UIColor(red: 0x00/255, green: 0x2b/255, blue: 0x36/255, alpha: 1)
 
-    static let logseqDark = UIColor(red: 0x00/255, green: 0x2b/255, blue: 0x36/255, alpha: 1)
+    // New: Tint colors converted from HSL
+    static let logseqTintLight = UIColor(
+        red: 23/255,   // ~0.090
+        green: 129/255, // ~0.506
+        blue: 225/255,  // ~0.882
+        alpha: 1.0
+    )
+
+    static let logseqTintDark = UIColor(
+        red: 245/255,   // ~0.961
+        green: 247/255, // ~0.969
+        blue: 250/255,  // ~0.980
+        alpha: 1.0
+    )
 
     static var logseqBackground: UIColor {
         UITraitCollection.current.userInterfaceStyle == .dark ? logseqDark : logseqLight
     }
+
+    static var logseqTint: UIColor {
+        UITraitCollection.current.userInterfaceStyle == .dark ? logseqTintDark : logseqTintLight
+    }
 }
 
 extension Color {
     static var logseqBackground: Color { Color(uiColor: .logseqBackground) }
+    static var logseqTint: Color { Color(uiColor: .logseqTint) }
 }

+ 4 - 5
src/main/mobile/components/app.cljs

@@ -93,14 +93,13 @@
     ;; - Journals layer keeps its own scroll container and is always in the DOM.
     ;; - Page layer keeps its own independent scroll container.
     ;; This ensures switching tabs does not reset scrollTop.
-    [:div#main-container
+    [:<>
      ;; Journals scroll container (keep-alive)
      ;; This element stays mounted permanently and only toggles visibility.
-     [:div#app-main-home {:class (when-not home? "hidden")}
-      [:div.px-5
-       (home)]]
+     [:div#app-main-home.px-5 {:class (when-not home? "hidden")}
+      (home)]
 
-     ;; Other pages: page, search, settings, etc.
+     ;; Other pages:  search, settings, etc.
      ;; These views scroll independently from the journals layer.
      (when-not home?
        [:div#main-content-container.px-5

+ 0 - 1
src/main/mobile/components/ui.cljs

@@ -5,7 +5,6 @@
             [frontend.state :as state]
             [logseq.shui.ui :as shui]
             [mobile.components.popup :as popup]
-            [mobile.state :as mobile-state]
             [react-transition-group :refer [CSSTransition TransitionGroup]]
             [rum.core :as rum]))