enhance: consistent tint color

This commit is contained in:
Tienson Qin
2025-11-26 04:54:40 +08:00
parent 590ee304fe
commit c7098f5e31
5 changed files with 54 additions and 16 deletions

View File

@@ -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()
}
}

View File

@@ -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()

View File

@@ -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) }
}

View File

@@ -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

View File

@@ -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]))