BUG: Appearance colors when mode changed

- The determination of what color is used i now handled by SwiftUI's colorScheme instead of a trait
This commit is contained in:
Lukas Korba 2025-01-06 16:00:49 +01:00
parent b894fdb84e
commit d10c8c0a93
49 changed files with 561 additions and 451 deletions

View File

@ -6,6 +6,9 @@ directly impact users rather than highlighting other crucial architectural updat
## [Unreleased]
### Fixed
- Appearance colors when mode changed.
## 1.3.1 build 1 (2024-12-24)
### Fixed

View File

@ -11,6 +11,7 @@ import Generated
import UIComponents
public struct AccountsSelectionView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<AddKeystoneHWWallet>
public init(store: StoreOf<AddKeystoneHWWallet>) {
@ -75,7 +76,7 @@ public struct AccountsSelectionView: View {
.padding(8)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
}
.padding(.trailing, 8)
@ -97,7 +98,7 @@ public struct AccountsSelectionView: View {
.padding(.vertical, 12)
.background {
RoundedRectangle(cornerRadius: 20)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
}

View File

@ -11,6 +11,7 @@ import Generated
import UIComponents
public struct AddKeystoneHWWalletView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<AddKeystoneHWWallet>
public init(store: StoreOf<AddKeystoneHWWallet>) {
@ -42,7 +43,7 @@ public struct AddKeystoneHWWalletView: View {
} label: {
Text(L10n.Keystone.AddHWWallet.tutorial)
.font(.custom(FontFamily.Inter.semiBold.name, size: 14))
.foregroundColor(Design.Utility.HyperBlue._700.color)
.foregroundColor(Design.Utility.HyperBlue._700.color(colorScheme))
.underline()
.padding(.top, 4)
}

View File

@ -25,6 +25,7 @@ extension String {
}
public struct AddressBookView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<AddressBook>
public init(store: StoreOf<AddressBook>) {
@ -138,23 +139,23 @@ public struct AddressBookView: View {
ZStack {
Asset.Assets.send.image
.zImage(size: 32, style: Design.Btns.Tertiary.fg)
.foregroundColor(Design.Btns.Tertiary.fg.color)
.zForegroundColor(Design.Btns.Tertiary.fg)
.background {
Circle()
.fill(Design.Btns.Tertiary.bg.color)
.fill(Design.Btns.Tertiary.bg.color(colorScheme))
.frame(width: 72, height: 72)
}
ZcashSymbol()
.frame(width: 24, height: 24)
.foregroundColor(Design.Surfaces.bgPrimary.color)
.zForegroundColor(Design.Surfaces.bgPrimary)
.background {
Circle()
.fill(Design.Surfaces.brandBg.color)
.fill(Design.Surfaces.brandBg.color(colorScheme))
.frame(width: 32, height: 32)
.background {
Circle()
.fill(Design.Surfaces.bgPrimary.color)
.fill(Design.Surfaces.bgPrimary.color(colorScheme))
.frame(width: 36, height: 36)
}
}
@ -185,7 +186,7 @@ public struct AddressBookView: View {
}
if let last = store.walletAccounts.last, last != walletAccount {
Design.Surfaces.divider.color
Design.Surfaces.divider.color(colorScheme)
.frame(height: 1)
.padding(.top, 12)
.padding(.horizontal, 4)
@ -209,7 +210,7 @@ public struct AddressBookView: View {
.padding(.top, 70)
.background {
RoundedRectangle(cornerRadius: 16)
.stroke(Design.Surfaces.strokeSecondary.color, style: StrokeStyle(lineWidth: 2.0, dash: [8, 6]))
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme), style: StrokeStyle(lineWidth: 2.0, dash: [8, 6]))
}
.padding(.top, 24)
.screenHorizontalPadding()
@ -234,7 +235,7 @@ public struct AddressBookView: View {
}
if let last = store.addressBookContacts.contacts.last, last != record {
Design.Surfaces.divider.color
Design.Surfaces.divider.color(colorScheme)
.frame(height: 1)
.padding(.top, 12)
.padding(.horizontal, 4)
@ -263,7 +264,7 @@ public struct AddressBookView: View {
}
if let last = store.walletAccounts.last, last != walletAccount {
Design.Surfaces.divider.color
Design.Surfaces.divider.color(colorScheme)
.frame(height: 1)
.padding(.top, 12)
.padding(.horizontal, 4)
@ -297,7 +298,7 @@ public struct AddressBookView: View {
.padding(8)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
}
.padding(.trailing, 12)
@ -319,7 +320,7 @@ public struct AddressBookView: View {
.background {
if selected {
RoundedRectangle(cornerRadius: 16)
.fill(Design.Surfaces.bgSecondary.color)
.fill(Design.Surfaces.bgSecondary.color(colorScheme))
}
}
}

View File

@ -39,12 +39,12 @@ public struct AddressDetailsView: View {
.background {
RoundedRectangle(cornerRadius: 12)
.fill(store.isQRCodeAppreanceFlipped
? Asset.Colors.ZDesign.Base.bone.color
: Design.screenBackground.color
? Asset.Colors.ZDesign.Base.bone.color
: Design.screenBackground.color(colorScheme)
)
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
.padding(.top, 40)

View File

@ -19,6 +19,7 @@ import WalletBalances
import Combine
public struct BalancesView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<Balances>
let tokenName: String
@ -54,7 +55,7 @@ public struct BalancesView: View {
.padding(.horizontal, store.isHintBoxVisible ? 15 : 30)
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokePrimary.color)
.stroke(Design.Surfaces.strokePrimary.color(colorScheme))
}
.padding(.horizontal, 30)

View File

@ -11,6 +11,7 @@ import Generated
import UIComponents
public struct CurrencyConversionSetupView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<CurrencyConversionSetup>
public init(store: StoreOf<CurrencyConversionSetup>) {
@ -63,20 +64,20 @@ public struct CurrencyConversionSetupView: View {
if option == store.currentSettingsOption {
Circle()
.fill(Design.Checkboxes.onBg.color)
.fill(Design.Checkboxes.onBg.color(colorScheme))
.frame(width: 20, height: 20)
.overlay {
Circle()
.fill(Design.Checkboxes.onFg.color)
.fill(Design.Checkboxes.onFg.color(colorScheme))
.frame(width: 10, height: 10)
}
} else {
Circle()
.fill(Design.Checkboxes.offBg.color)
.fill(Design.Checkboxes.offBg.color(colorScheme))
.frame(width: 20, height: 20)
.overlay {
Circle()
.stroke(Design.Checkboxes.offStroke.color)
.stroke(Design.Checkboxes.offStroke.color(colorScheme))
.frame(width: 20, height: 20)
}
}
@ -85,7 +86,7 @@ public struct CurrencyConversionSetupView: View {
.padding(20)
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
}
@ -163,8 +164,8 @@ extension CurrencyConversionSetupView {
RoundedRectangle(cornerRadius: 12)
.fill(
disabled
? Design.Btns.Primary.bgDisabled.color
: Design.Btns.Primary.bg.color
? Design.Btns.Primary.bgDisabled.color(colorScheme)
: Design.Btns.Primary.bg.color(colorScheme)
)
}
}
@ -228,7 +229,7 @@ extension CurrencyConversionSetupView {
.padding(10)
.background {
Circle()
.fill(Design.Surfaces.bgTertiary.color)
.fill(Design.Surfaces.bgTertiary.color(colorScheme))
}
.padding(.trailing, 16)
}

View File

@ -13,6 +13,8 @@ import Utils
import RestoreInfo
public struct ImportWalletView: View {
@Environment(\.colorScheme) private var colorScheme
private enum InputID: Hashable {
case seed
}
@ -51,7 +53,7 @@ public struct ImportWalletView: View {
.padding(8)
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokePrimary.color)
.stroke(Design.Surfaces.strokePrimary.color(colorScheme))
}
.colorBackground(Asset.Colors.background.color)
.frame(minWidth: 270)

View File

@ -13,6 +13,8 @@ import Settings
import UIComponents
public struct NotEnoughFreeSpaceView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<NotEnoughFreeSpace>
public init(store: StoreOf<NotEnoughFreeSpace>) {
@ -27,7 +29,7 @@ public struct NotEnoughFreeSpaceView: View {
.padding(18)
.background {
Circle()
.fill(Design.Utility.ErrorRed._100.color)
.fill(Design.Utility.ErrorRed._100.color(colorScheme))
}
.rotationEffect(.degrees(180))
.padding(.top, 100)

View File

@ -12,6 +12,8 @@ import Generated
import UIComponents
public struct OSStatusErrorView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<OSStatusError>
public init(store: StoreOf<OSStatusError>) {
@ -28,7 +30,7 @@ public struct OSStatusErrorView: View {
.padding(18)
.background {
Circle()
.fill(Design.Utility.ErrorRed._100.color)
.fill(Design.Utility.ErrorRed._100.color(colorScheme))
}
.rotationEffect(.degrees(180))

View File

@ -12,6 +12,8 @@ import Generated
import UIComponents
public struct PartialProposalErrorView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<PartialProposalError>
public init(store: StoreOf<PartialProposalError>) {
@ -58,7 +60,7 @@ public struct PartialProposalErrorView: View {
.truncationMode(.middle)
.background {
RoundedRectangle(cornerRadius: 10)
.fill(Design.Inputs.Default.bg.color)
.fill(Design.Inputs.Default.bg.color(colorScheme))
}
.padding(.bottom, 8)
}

View File

@ -55,7 +55,7 @@ public struct ReceiveView: View {
postfixIcon: Asset.Assets.Icons.shieldTickFilled.image,
iconFg: Design.Utility.Indigo._800,
iconBg: Design.Utility.Indigo._100,
bcgColor: Design.Utility.Indigo._50.color,
bcgColor: Design.Utility.Indigo._50.color(colorScheme),
expanded: store.currentFocus == .uaAddress
) {
store.send(.copyToPastboard(store.unifiedAddress.redacted))
@ -76,7 +76,7 @@ public struct ReceiveView: View {
address: transparentAddress,
iconFg: Design.Text.primary,
iconBg: Design.Surfaces.bgTertiary,
bcgColor: Design.Utility.Gray._50.color,
bcgColor: Design.Utility.Gray._50.color(colorScheme),
expanded: store.currentFocus == .tAddress
) {
store.send(.copyToPastboard(store.transparentAddress.redacted))
@ -97,7 +97,7 @@ public struct ReceiveView: View {
postfixIcon: Asset.Assets.Icons.shieldTickFilled.image,
iconFg: Design.Utility.Purple._800,
iconBg: Design.Utility.Purple._100,
bcgColor: Design.Utility.Purple._50.color,
bcgColor: Design.Utility.Purple._50.color(colorScheme),
expanded: store.currentFocus == .uaAddress
) {
store.send(.copyToPastboard(store.unifiedAddress.redacted))
@ -117,7 +117,7 @@ public struct ReceiveView: View {
address: store.transparentAddress,
iconFg: Design.Text.primary,
iconBg: Design.Surfaces.bgTertiary,
bcgColor: Design.Utility.Gray._50.color,
bcgColor: Design.Utility.Gray._50.color(colorScheme),
expanded: store.currentFocus == .tAddress
) {
store.send(.copyToPastboard(store.transparentAddress.redacted))
@ -204,15 +204,27 @@ public struct ReceiveView: View {
if expanded {
HStack(spacing: 8) {
button(L10n.Receive.copy, fill: iconBg.color, icon: Asset.Assets.copy.image) {
button(
L10n.Receive.copy,
fill: iconBg.color(colorScheme),
icon: Asset.Assets.copy.image
) {
copyAction()
}
button(L10n.Receive.qrCode, fill: iconBg.color, icon: Asset.Assets.Icons.qr.image) {
button(
L10n.Receive.qrCode,
fill: iconBg.color(colorScheme),
icon: Asset.Assets.Icons.qr.image
) {
qrAction()
}
button(L10n.Receive.request, fill: iconBg.color, icon: Asset.Assets.Icons.coinsHand.image) {
button(
L10n.Receive.request,
fill: iconBg.color(colorScheme),
icon: Asset.Assets.Icons.coinsHand.image
) {
requestAction()
}
}

View File

@ -13,6 +13,8 @@ import MnemonicSwift
import Utils
public struct RecoveryPhraseDisplayView: View {
@Environment(\.colorScheme) private var colorScheme
enum Constants {
static let blurValue = 15.0
static let blurBDValue = 10.0
@ -71,7 +73,7 @@ public struct RecoveryPhraseDisplayView: View {
.padding(.horizontal, 16)
.background {
RoundedRectangle(cornerRadius: 24)
.fill(Design.Surfaces.bgSecondary.color)
.fill(Design.Surfaces.bgSecondary.color(colorScheme))
}
.onTapGesture {
if !store.showBackButton {
@ -124,7 +126,7 @@ public struct RecoveryPhraseDisplayView: View {
}
.background {
RoundedRectangle(cornerRadius: 10)
.fill(Design.Surfaces.bgSecondary.color)
.fill(Design.Surfaces.bgSecondary.color(colorScheme))
}
.padding(.top, 6)
}

View File

@ -34,7 +34,7 @@ public struct RequestZecSummaryView: View {
Group {
Text(store.requestedZec.decimalString())
+ Text(" \(tokenName)")
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
}
.zFont(.semiBold, size: 56, style: Design.Text.primary)
.minimumScaleFactor(0.1)
@ -54,11 +54,11 @@ public struct RequestZecSummaryView: View {
RoundedRectangle(cornerRadius: 12)
.fill(store.isQRCodeAppreanceFlipped
? Asset.Colors.ZDesign.Base.bone.color
: Design.screenBackground.color
: Design.screenBackground.color(colorScheme)
)
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
.padding(.top, 32)

View File

@ -14,6 +14,7 @@ import UIComponents
import Utils
public struct RequestZecView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<RequestZec>
@State private var keyboardVisible: Bool = false
@ -47,7 +48,7 @@ public struct RequestZecView: View {
Group {
Text(store.requestedZec.decimalString())
+ Text(" \(tokenName)")
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
}
.zFont(.semiBold, size: 56, style: Design.Text.primary)
.minimumScaleFactor(0.1)

View File

@ -16,6 +16,8 @@ import PartialProposalError
import Scan
public struct RequestPaymentConfirmationView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<SendConfirmation>
let tokenName: String
@ -124,7 +126,7 @@ public struct RequestPaymentConfirmationView: View {
.frame(width: 24, height: 24)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
.frame(width: 32, height: 32)
}
@ -157,7 +159,7 @@ public struct RequestPaymentConfirmationView: View {
.padding()
.background {
RoundedRectangle(cornerRadius: 10)
.fill(Design.Inputs.Filled.bg.color)
.fill(Design.Inputs.Filled.bg.color(colorScheme))
}
}
.screenHorizontalPadding()

View File

@ -16,6 +16,8 @@ import PartialProposalError
import Scan
public struct SendConfirmationView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<SendConfirmation>
let tokenName: String
@ -78,7 +80,7 @@ public struct SendConfirmationView: View {
.frame(width: 24, height: 24)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
.frame(width: 32, height: 32)
}
@ -149,7 +151,7 @@ public struct SendConfirmationView: View {
.padding()
.background {
RoundedRectangle(cornerRadius: 10)
.fill(Design.Inputs.Filled.bg.color)
.fill(Design.Inputs.Filled.bg.color(colorScheme))
}
}
.screenHorizontalPadding()

View File

@ -18,6 +18,8 @@ import SDKSynchronizer
import Scan
public struct SignWithKeystoneView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<SendConfirmation>
@Dependency(\.sdkSynchronizer) var sdkSynchronizer
@ -41,7 +43,7 @@ public struct SignWithKeystoneView: View {
.padding(8)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
}
.padding(.trailing, 12)
@ -61,10 +63,10 @@ public struct SignWithKeystoneView: View {
.padding(.horizontal, 8)
.background {
RoundedRectangle(cornerRadius: 16)
.fill(Design.Utility.HyperBlue._50.color)
.fill(Design.Utility.HyperBlue._50.color(colorScheme))
.background {
RoundedRectangle(cornerRadius: 16)
.stroke(Design.Utility.HyperBlue._200.color)
.stroke(Design.Utility.HyperBlue._200.color(colorScheme))
}
}
}
@ -72,7 +74,7 @@ public struct SignWithKeystoneView: View {
.padding(.vertical, 12)
.background {
RoundedRectangle(cornerRadius: 16)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
.padding(.top, 40)
@ -85,7 +87,7 @@ public struct SignWithKeystoneView: View {
.fill(Asset.Colors.ZDesign.Base.bone.color)
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
.padding(.top, 32)
@ -100,7 +102,7 @@ public struct SignWithKeystoneView: View {
.fill(Asset.Colors.ZDesign.Base.bone.color)
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
.padding(.top, 32)

View File

@ -12,6 +12,8 @@ import UIComponents
import Utils
public struct SendFeedbackView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<SendFeedback>
public init(store: StoreOf<SendFeedback>) {
@ -44,13 +46,13 @@ public struct SendFeedbackView: View {
.frame(maxWidth: .infinity)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Surfaces.bgSecondary.color)
.fill(Design.Surfaces.bgSecondary.color(colorScheme))
}
.padding(3)
.overlay {
if let selectedRating = store.selectedRating, selectedRating == rating {
RoundedRectangle(cornerRadius: 14)
.stroke(Design.Text.primary.color)
.stroke(Design.Text.primary.color(colorScheme))
}
}
}

View File

@ -14,6 +14,8 @@ import BalanceFormatter
import WalletBalances
public struct SendFlowView: View {
@Environment(\.colorScheme) private var colorScheme
private enum InputID: Hashable {
case message
case addressBookHint
@ -163,7 +165,7 @@ public struct SendFlowView: View {
.padding(10)
.background {
RoundedRectangle(cornerRadius: 8)
.fill(Design.Utility.Gray._50.color)
.fill(Design.Utility.Gray._50.color(colorScheme))
}
}
}
@ -237,7 +239,7 @@ public struct SendFlowView: View {
.frame(height: 40)
.background {
RoundedRectangle(cornerRadius: 8)
.fill(Design.HintTooltips.surfacePrimary.color)
.fill(Design.HintTooltips.surfacePrimary.color(colorScheme))
}
.frame(width: geometry.size.width - 48)
.offset(x: 24, y: geometry[$0].minY + geometry[$0].height - 16)
@ -287,10 +289,10 @@ public struct SendFlowView: View {
.padding(8)
.background {
RoundedRectangle(cornerRadius: 8)
.fill(Design.Btns.Secondary.bg.color)
.fill(Design.Btns.Secondary.bg.color(colorScheme))
.overlay {
RoundedRectangle(cornerRadius: 8)
.stroke(Design.Btns.Secondary.border.color)
.stroke(Design.Btns.Secondary.border.color(colorScheme))
}
}
}

View File

@ -115,8 +115,8 @@ public struct ServerSetupView: View {
.frame(maxWidth: .infinity)
.background(
store.selectedServer == nil
? Design.Btns.Primary.bgDisabled.color
: Design.Btns.Primary.bg.color
? Design.Btns.Primary.bgDisabled.color(colorScheme)
: Design.Btns.Primary.bg.color(colorScheme)
)
.cornerRadius(10)
.screenHorizontalPadding()
@ -131,8 +131,8 @@ public struct ServerSetupView: View {
.frame(maxWidth: .infinity)
.background(
store.selectedServer == nil
? Design.Btns.Primary.bgDisabled.color
: Design.Btns.Primary.bg.color
? Design.Btns.Primary.bgDisabled.color(colorScheme)
: Design.Btns.Primary.bg.color(colorScheme)
)
.cornerRadius(10)
.screenHorizontalPadding()
@ -171,7 +171,7 @@ public struct ServerSetupView: View {
WithPerceptionTracking {
if server.value(for: store.network) == store.activeServer && store.selectedServer == nil {
Circle()
.fill(Design.Surfaces.brandBg.color)
.fill(Design.Surfaces.brandBg.color(colorScheme))
.frame(width: 20, height: 20)
.overlay {
Asset.Assets.check.image
@ -179,7 +179,7 @@ public struct ServerSetupView: View {
}
} else if server.value(for: store.network) == store.selectedServer {
Circle()
.fill(Design.Checkboxes.onBg.color)
.fill(Design.Checkboxes.onBg.color(colorScheme))
.frame(width: 20, height: 20)
.overlay {
Asset.Assets.check.image
@ -187,11 +187,11 @@ public struct ServerSetupView: View {
}
} else {
Circle()
.fill(Design.Checkboxes.offBg.color)
.fill(Design.Checkboxes.offBg.color(colorScheme))
.frame(width: 20, height: 20)
.overlay {
Circle()
.stroke(Design.Checkboxes.offStroke.color)
.stroke(Design.Checkboxes.offStroke.color(colorScheme))
.frame(width: 20, height: 20)
}
}
@ -223,11 +223,11 @@ public struct ServerSetupView: View {
.padding(.leading, 10)
.background {
RoundedRectangle(cornerRadius: 8)
.fill(Design.Surfaces.bgPrimary.color)
.fill(Design.Surfaces.bgPrimary.color(colorScheme))
}
.overlay {
RoundedRectangle(cornerRadius: 8)
.stroke(Design.Inputs.Default.stroke.color, lineWidth: 1)
.stroke(Design.Inputs.Default.stroke.color(colorScheme), lineWidth: 1)
}
.padding(.vertical, 8)
}
@ -267,7 +267,7 @@ public struct ServerSetupView: View {
RoundedRectangle(cornerRadius: 12)
.fill(
server.value(for: store.network) == store.selectedServer
? Design.Surfaces.bgSecondary.color
? Design.Surfaces.bgSecondary.color(colorScheme)
: Asset.Colors.background.color
)
}
@ -279,7 +279,7 @@ public struct ServerSetupView: View {
.padding(.leading, 8)
if let last = servers.last, last != server {
Design.Surfaces.divider.color
Design.Surfaces.divider.color(colorScheme)
.frame(height: 1)
}
}
@ -306,12 +306,12 @@ public struct ServerSetupView: View {
.frame(height: 20)
.padding(.horizontal, 10)
.padding(.vertical, 2)
.background(Design.Utility.SuccessGreen._50.color)
.zBackground(Design.Utility.SuccessGreen._50)
.cornerRadius(16)
.overlay {
RoundedRectangle(cornerRadius: 16)
.inset(by: 0.5)
.stroke(Design.Utility.SuccessGreen._200.color, lineWidth: 1)
.stroke(Design.Utility.SuccessGreen._200.color(colorScheme), lineWidth: 1)
}
}

View File

@ -19,6 +19,8 @@ import CurrencyConversionSetup
import Flexa
public struct AdvancedSettingsView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<AdvancedSettings>
public init(store: StoreOf<AdvancedSettings>) {
@ -121,10 +123,10 @@ public struct AdvancedSettingsView: View {
.padding(.vertical, 12)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Btns.Destructive1.bg.color)
.fill(Design.Btns.Destructive1.bg.color(colorScheme))
.overlay {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Btns.Destructive1.border.color)
.stroke(Design.Btns.Destructive1.border.color(colorScheme))
}
}
}

View File

@ -14,6 +14,8 @@ import UIComponents
import Flexa
public struct IntegrationsView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<Integrations>
@Shared(.inMemory(.walletStatus)) public var walletStatus: WalletStatus = .none
@ -96,7 +98,7 @@ public struct IntegrationsView: View {
.padding(24)
.background {
RoundedRectangle(cornerRadius: 20)
.fill(Design.Surfaces.bgSecondary.color)
.fill(Design.Surfaces.bgSecondary.color(colorScheme))
}
.padding(.bottom, 24)
.screenHorizontalPadding()

View File

@ -47,7 +47,7 @@ extension TabsView {
.frame(width: 16, height: 16)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
.frame(width: 24, height: 24)
}

View File

@ -26,6 +26,8 @@ import AddKeystoneHWWallet
import Scan
public struct TabsView: View {
@Environment(\.colorScheme) var colorScheme
let networkType: NetworkType
@Perception.Bindable var store: StoreOf<Tabs>
let tokenName: String
@ -98,7 +100,7 @@ public struct TabsView: View {
.foregroundColor(Asset.Colors.primary.color)
Rectangle()
.frame(height: 2)
.foregroundColor(Design.Surfaces.brandBg.color)
.zForegroundColor(Design.Surfaces.brandBg)
.matchedGeometryEffect(id: "Tabs", in: tabsID, properties: .frame)
} else {
Text("\(item.title)")
@ -274,7 +276,7 @@ public struct TabsView: View {
.padding(8)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Btns.Tertiary.bg.color)
.fill(Design.Btns.Tertiary.bg.color(colorScheme))
}
}
}
@ -317,7 +319,7 @@ public struct TabsView: View {
.padding(10)
.background {
Circle()
.fill(Design.Surfaces.bgTertiary.color)
.fill(Design.Surfaces.bgTertiary.color(colorScheme))
}
.padding(.trailing, 16)
@ -354,17 +356,17 @@ public struct TabsView: View {
.padding(.vertical, 12)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Btns.Tertiary.bg.color)
.fill(Design.Btns.Tertiary.bg.color(colorScheme))
}
}
}
.padding(24)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Surfaces.bgPrimary.color)
.fill(Design.Surfaces.bgPrimary.color(colorScheme))
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
.frame(width: geometry.size.width - 40)

View File

@ -97,7 +97,7 @@ extension TabsView {
.padding(8)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
}
.padding(.trailing, 12)
@ -116,7 +116,7 @@ extension TabsView {
.background {
if selected {
RoundedRectangle(cornerRadius: 16)
.fill(Design.Surfaces.bgSecondary.color)
.fill(Design.Surfaces.bgSecondary.color(colorScheme))
}
}
}
@ -133,7 +133,7 @@ extension TabsView {
.padding(4)
.background {
Circle()
.fill(Design.Surfaces.bgAlt.color)
.fill(Design.Surfaces.bgAlt.color(colorScheme))
}
.padding(.trailing, 12)
@ -159,7 +159,7 @@ extension TabsView {
.padding(.vertical, 12)
.background {
RoundedRectangle(cornerRadius: 24)
.stroke(Design.Surfaces.strokeSecondary.color)
.stroke(Design.Surfaces.strokeSecondary.color(colorScheme))
}
}
}
@ -190,7 +190,7 @@ extension TabsView {
.frame(maxWidth: .infinity)
.background {
RoundedRectangle(cornerRadius: 24)
.fill(Design.Surfaces.bgTertiary.color)
.fill(Design.Surfaces.bgTertiary.color(colorScheme))
}
}
}

View File

@ -11,6 +11,7 @@ import ComposableArchitecture
import Generated
struct MessageView: View {
@Environment(\.colorScheme) private var colorScheme
let store: StoreOf<TransactionList>
let messages: [String]?
@ -48,7 +49,7 @@ struct MessageView: View {
.font(.custom(FontFamily.Inter.regular.name, size: 13))
.foregroundColor(
isFailed ?
Design.Utility.ErrorRed._600.color
Design.Utility.ErrorRed._600.color(colorScheme)
: Asset.Colors.primary.color
)
.conditionalStrikethrough(isFailed)
@ -56,7 +57,7 @@ struct MessageView: View {
}
.background {
RoundedRectangle(cornerRadius: 12)
.stroke(Design.Surfaces.strokePrimary.color)
.stroke(Design.Surfaces.strokePrimary.color(colorScheme))
}
if store.featureFlags.selectText {

View File

@ -11,6 +11,7 @@ import ZcashLightClientKit
import UIComponents
public struct TransactionFeeView: View {
@Environment(\.colorScheme) private var colorScheme
let fee: Zatoshi
public init(fee: Zatoshi) {
@ -36,7 +37,7 @@ public struct TransactionFeeView: View {
.foregroundColor(
fee.amount == 0
? Asset.Colors.shade47.color
: Design.Utility.ErrorRed._600.color
: Design.Utility.ErrorRed._600.color(colorScheme)
)
.fixedSize()
}

View File

@ -12,6 +12,8 @@ import Models
import UIComponents
struct TransactionHeaderView: View {
@Environment(\.colorScheme) private var colorScheme
let store: StoreOf<TransactionList>
let transaction: TransactionState
let isLatestTransaction: Bool
@ -116,7 +118,7 @@ struct TransactionHeaderView: View {
true: .custom(FontFamily.Inter.boldItalic.name, size: 13),
else: .custom(FontFamily.Inter.bold.name, size: 13)
)
.foregroundColor(transaction.titleColor)
.foregroundColor(transaction.titleColor(colorScheme))
.padding(.trailing, 8)
}
@ -149,7 +151,7 @@ struct TransactionHeaderView: View {
strikethrough: transaction.status == .failed,
couldBeHidden: true
)
.foregroundColor(transaction.balanceColor)
.foregroundColor(transaction.balanceColor(colorScheme))
}
}

View File

@ -11,6 +11,8 @@ import Generated
import UIComponents
public struct WalletBalancesView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<WalletBalances>
let tokenName: String
let underlinedAvailableBalance: Bool
@ -140,9 +142,9 @@ public struct WalletBalancesView: View {
.padding(.horizontal, 6)
.background {
RoundedRectangle(cornerRadius: 10)
.stroke(Design.Surfaces.strokePrimary.color)
.stroke(Design.Surfaces.strokePrimary.color(colorScheme))
.background {
Design.Surfaces.bgSecondary.color
Design.Surfaces.bgSecondary.color(colorScheme)
.cornerRadius(10)
}
}

View File

@ -14,6 +14,7 @@ import UIComponents
import Utils
public struct ZecKeyboardView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<ZecKeyboard>
let tokenName: String
@ -46,16 +47,16 @@ public struct ZecKeyboardView: View {
if store.isInputInZec {
Text(store.humanReadableMainInput)
+ Text(" \(tokenName)")
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
} else {
if store.isCurrencySymbolPrefix {
Text(store.localeCurrencySymbol)
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
+ Text(store.humanReadableMainInput)
} else {
Text(store.humanReadableMainInput)
+ Text(" \(store.localeCurrencySymbol)")
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
}
}
}
@ -76,17 +77,17 @@ public struct ZecKeyboardView: View {
if store.isInputInZec {
if store.isCurrencySymbolPrefix {
Text(store.localeCurrencySymbol)
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
+ Text(store.humanReadableConvertedInput)
} else {
Text(store.humanReadableConvertedInput)
+ Text(" \(store.localeCurrencySymbol)")
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
}
} else {
Text(store.humanReadableConvertedInput)
+ Text(" \(tokenName)")
.foregroundColor(Design.Text.quaternary.color)
.foregroundColor(Design.Text.quaternary.color(colorScheme))
}
}
.zFont(.medium, size: 18, style: Design.Text.primary)
@ -100,7 +101,7 @@ public struct ZecKeyboardView: View {
.padding(8)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Btns.Tertiary.bg.color)
.fill(Design.Btns.Tertiary.bg.color(colorScheme))
}
.rotationEffect(Angle(degrees: 90))
}

View File

@ -9,7 +9,7 @@ import Foundation
import SwiftUI
public protocol Colorable {
var color: Color { get }
func color(_ colorScheme: ColorScheme) -> Color
}
public enum Design {
@ -306,9 +306,9 @@ public enum Design {
}
public extension Design {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .screenBackground: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .screenBackground: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
}
}
}
@ -316,377 +316,377 @@ public extension Design {
// MARK: Color Variable Values
public extension Design.Surfaces {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bgPrimary: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .bgAdjust: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark900.color)
case .bgSecondary: return Design.col(Asset.Colors.ZDesign.Base.concrete.color, Asset.Colors.ZDesign.sharkShades06dp.color)
case .bgTertiary: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark800.color)
case .bgQuaternary: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color)
case .strokePrimary: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color)
case .strokeSecondary: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark800.color)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.bone.color)
case .bgHide: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .brandBg: return Design.col(Asset.Colors.ZDesign.Base.brand.color, Asset.Colors.ZDesign.Base.brand.color)
case .brandFg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .divider: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color)
case .bgPrimary: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .bgAdjust: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .bgSecondary: return Design.col(Asset.Colors.ZDesign.Base.concrete.color, Asset.Colors.ZDesign.sharkShades06dp.color, colorScheme)
case .bgTertiary: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
case .bgQuaternary: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .strokePrimary: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .strokeSecondary: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.bone.color, colorScheme)
case .bgHide: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .brandBg: return Design.col(Asset.Colors.ZDesign.Base.brand.color, Asset.Colors.ZDesign.Base.brand.color, colorScheme)
case .brandFg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .divider: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
}
}
}
public extension Design.Text {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .primary: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .secondary: return Design.col(Asset.Colors.ZDesign.gray800.color, Asset.Colors.ZDesign.shark200.color)
case .tertiary: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark200.color)
case .quaternary: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark300.color)
case .support: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark400.color)
case .disabled: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color)
case .error: return Design.col(Asset.Colors.ZDesign.errorRed500.color, Asset.Colors.ZDesign.errorRed300.color)
case .link: return Design.col(Asset.Colors.ZDesign.hyperBlue500.color, Asset.Colors.ZDesign.hyperBlue300.color)
case .light: return Design.col(Asset.Colors.ZDesign.gray25.color, Asset.Colors.ZDesign.shark50.color)
case .lightSupport: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark200.color)
case .primary: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .secondary: return Design.col(Asset.Colors.ZDesign.gray800.color, Asset.Colors.ZDesign.shark200.color, colorScheme)
case .tertiary: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark200.color, colorScheme)
case .quaternary: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark300.color, colorScheme)
case .support: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case .disabled: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
case .error: return Design.col(Asset.Colors.ZDesign.errorRed500.color, Asset.Colors.ZDesign.errorRed300.color, colorScheme)
case .link: return Design.col(Asset.Colors.ZDesign.hyperBlue500.color, Asset.Colors.ZDesign.hyperBlue300.color, colorScheme)
case .light: return Design.col(Asset.Colors.ZDesign.gray25.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .lightSupport: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark200.color, colorScheme)
}
}
}
public extension Design.Btns.Primary {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.bone.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.gray100.color)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.bone.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.gray100.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Btns.Secondary {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark950.color)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .fgHover: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .border: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color)
case .borderHover: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark600.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark950.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .fgHover: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .border: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .borderHover: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Btns.Tertiary {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark800.color)
case .fg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color)
case .fgHover: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color, colorScheme)
case .fgHover: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Btns.Quaternary {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color)
case .fg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark50.color)
case .fgHover: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark50.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .fgHover: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Btns.Destructive1 {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.errorRed950.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.errorRed50.color, Asset.Colors.ZDesign.espresso900.color)
case .fg: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed100.color)
case .fgHover: return Design.col(Asset.Colors.ZDesign.errorRed700.color, Asset.Colors.ZDesign.errorRed50.color)
case .border: return Design.col(Asset.Colors.ZDesign.errorRed300.color, Asset.Colors.ZDesign.errorRed800.color)
case .borderHover: return Design.col(Asset.Colors.ZDesign.errorRed300.color, Asset.Colors.ZDesign.errorRed700.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.errorRed950.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.errorRed50.color, Asset.Colors.ZDesign.espresso900.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed100.color, colorScheme)
case .fgHover: return Design.col(Asset.Colors.ZDesign.errorRed700.color, Asset.Colors.ZDesign.errorRed50.color, colorScheme)
case .border: return Design.col(Asset.Colors.ZDesign.errorRed300.color, Asset.Colors.ZDesign.errorRed800.color, colorScheme)
case .borderHover: return Design.col(Asset.Colors.ZDesign.errorRed300.color, Asset.Colors.ZDesign.errorRed700.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Btns.Destructive2 {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed600.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.errorRed700.color, Asset.Colors.ZDesign.errorRed700.color)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.errorRed50.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed600.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.errorRed700.color, Asset.Colors.ZDesign.errorRed700.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.errorRed50.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Btns.Brand {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.brand400.color, Asset.Colors.ZDesign.brand400.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.brand300.color, Asset.Colors.ZDesign.brand300.color)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .fgHover: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.brand400.color, Asset.Colors.ZDesign.brand400.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.brand300.color, Asset.Colors.ZDesign.brand300.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .fgHover: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Btns.Ghost {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.gray900.color)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .bgHover: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.gray900.color, colorScheme)
case .fg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .bgDisabled: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .fgDisabled: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
}
}
}
public extension Design.Inputs.Default {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark950.color)
case .label: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .text: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark400.color)
case .hint: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark300.color)
case .required: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color)
case .icon: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark400.color)
case .stroke: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark800.color)
case .bg: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark950.color, colorScheme)
case .label: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .text: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case .hint: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark300.color, colorScheme)
case .required: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color, colorScheme)
case .icon: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case .stroke: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
}
}
}
public extension Design.Inputs.Filled {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark950.color)
case .asideBg: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color)
case .stroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark700.color)
case .label: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .text: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color)
case .hint: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark300.color)
case .icon: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark400.color)
case .iconMain: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .required: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color)
case .bg: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark950.color, colorScheme)
case .asideBg: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .stroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .label: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .text: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color, colorScheme)
case .hint: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark300.color, colorScheme)
case .icon: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case .iconMain: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
case .required: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color, colorScheme)
}
}
}
public extension Design.Inputs.ErrorFilled {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark950.color)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color)
case .label: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .text: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color)
case .textAside: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark400.color)
case .hint: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color)
case .icon: return Design.col(Asset.Colors.ZDesign.errorRed500.color, Asset.Colors.ZDesign.errorRed400.color)
case .iconMain: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .stroke: return Design.col(Asset.Colors.ZDesign.errorRed400.color, Asset.Colors.ZDesign.errorRed500.color)
case .strokeAlt: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark700.color)
case .dropdown: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark600.color)
case .bg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark950.color, colorScheme)
case .bgAlt: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .label: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .text: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark100.color, colorScheme)
case .textAside: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case .hint: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color, colorScheme)
case .icon: return Design.col(Asset.Colors.ZDesign.errorRed500.color, Asset.Colors.ZDesign.errorRed400.color, colorScheme)
case .iconMain: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
case .stroke: return Design.col(Asset.Colors.ZDesign.errorRed400.color, Asset.Colors.ZDesign.errorRed500.color, colorScheme)
case .strokeAlt: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .dropdown: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
}
}
}
public extension Design.Avatars {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .profileBorder: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .bg: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark600.color)
case .bgSecondary: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .status: return Design.col(Asset.Colors.ZDesign.successGreen500.color, Asset.Colors.ZDesign.successGreen400.color)
case .textFg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark100.color)
case .badgeBg: return Design.col(Asset.Colors.ZDesign.hyperBlue400.color, Asset.Colors.ZDesign.hyperBlue400.color)
case .badgeFg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color)
case .profileBorder: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
case .bg: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
case .bgSecondary: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
case .status: return Design.col(Asset.Colors.ZDesign.successGreen500.color, Asset.Colors.ZDesign.successGreen400.color, colorScheme)
case .textFg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark100.color, colorScheme)
case .badgeBg: return Design.col(Asset.Colors.ZDesign.hyperBlue400.color, Asset.Colors.ZDesign.hyperBlue400.color, colorScheme)
case .badgeFg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.Base.obsidian.color, colorScheme)
}
}
}
public extension Design.Checkboxes {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .offBg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark900.color)
case .offStroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark400.color)
case .offHoverBg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark500.color)
case .offHoverStroke: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark400.color)
case .offDisabledBg: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark700.color)
case .offDisabledStroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color)
case .onBg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color)
case .onFg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark900.color)
case .onHoverBg: return Design.col(Asset.Colors.ZDesign.gray800.color, Asset.Colors.ZDesign.shark300.color)
case .onDisabledBg: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark700.color)
case .onDisabledStroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color)
case .onDisabledFb: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark400.color)
case .offBg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .offStroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case .offHoverBg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
case .offHoverStroke: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case .offDisabledBg: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .offDisabledStroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
case .onBg: return Design.col(Asset.Colors.ZDesign.Base.obsidian.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
case .onFg: return Design.col(Asset.Colors.ZDesign.Base.bone.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case .onHoverBg: return Design.col(Asset.Colors.ZDesign.gray800.color, Asset.Colors.ZDesign.shark300.color, colorScheme)
case .onDisabledBg: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .onDisabledStroke: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
case .onDisabledFb: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
}
}
}
public extension Design.HintTooltips {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case .surfacePrimary: return Design.col(Asset.Colors.ZDesign.gray950.color, Asset.Colors.ZDesign.shark800.color)
case .defaultBg: return Design.col(Asset.Colors.ZDesign.gray950.color, Asset.Colors.ZDesign.shark800.color)
case .defaultFg: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark200.color)
case .hoverBg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark700.color)
case .hoverFg: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark200.color)
case .focusedBg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark700.color)
case .focusedStroke: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color)
case .disabledBg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark800.color)
case .disabledFg: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark600.color)
case .surfacePrimary: return Design.col(Asset.Colors.ZDesign.gray950.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
case .defaultBg: return Design.col(Asset.Colors.ZDesign.gray950.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
case .defaultFg: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark200.color, colorScheme)
case .hoverBg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .hoverFg: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark200.color, colorScheme)
case .focusedBg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case .focusedStroke: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
case .disabledBg: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
case .disabledFg: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
}
}
}
public extension Design.Utility.Gray {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color)
case ._100: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark800.color)
case ._200: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color)
case ._300: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color)
case ._400: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark500.color)
case ._500: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark400.color)
case ._600: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark300.color)
case ._700: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark200.color)
case ._800: return Design.col(Asset.Colors.ZDesign.gray800.color, Asset.Colors.ZDesign.shark100.color)
case ._900: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark50.color)
case ._50: return Design.col(Asset.Colors.ZDesign.gray50.color, Asset.Colors.ZDesign.shark900.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.gray100.color, Asset.Colors.ZDesign.shark800.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.gray200.color, Asset.Colors.ZDesign.shark700.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.gray300.color, Asset.Colors.ZDesign.shark600.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.gray400.color, Asset.Colors.ZDesign.shark500.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.gray500.color, Asset.Colors.ZDesign.shark400.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.gray600.color, Asset.Colors.ZDesign.shark300.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.gray700.color, Asset.Colors.ZDesign.shark200.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.gray800.color, Asset.Colors.ZDesign.shark100.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.gray900.color, Asset.Colors.ZDesign.shark50.color, colorScheme)
}
}
}
public extension Design.Utility.SuccessGreen {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.successGreen50.color, Asset.Colors.ZDesign.successGreen950.color)
case ._100: return Design.col(Asset.Colors.ZDesign.successGreen100.color, Asset.Colors.ZDesign.successGreen900.color)
case ._200: return Design.col(Asset.Colors.ZDesign.successGreen200.color, Asset.Colors.ZDesign.successGreen800.color)
case ._300: return Design.col(Asset.Colors.ZDesign.successGreen300.color, Asset.Colors.ZDesign.successGreen700.color)
case ._400: return Design.col(Asset.Colors.ZDesign.successGreen400.color, Asset.Colors.ZDesign.successGreen600.color)
case ._500: return Design.col(Asset.Colors.ZDesign.successGreen500.color, Asset.Colors.ZDesign.successGreen500.color)
case ._600: return Design.col(Asset.Colors.ZDesign.successGreen600.color, Asset.Colors.ZDesign.successGreen400.color)
case ._700: return Design.col(Asset.Colors.ZDesign.successGreen700.color, Asset.Colors.ZDesign.successGreen300.color)
case ._800: return Design.col(Asset.Colors.ZDesign.successGreen800.color, Asset.Colors.ZDesign.successGreen200.color)
case ._900: return Design.col(Asset.Colors.ZDesign.successGreen900.color, Asset.Colors.ZDesign.successGreen100.color)
case ._50: return Design.col(Asset.Colors.ZDesign.successGreen50.color, Asset.Colors.ZDesign.successGreen950.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.successGreen100.color, Asset.Colors.ZDesign.successGreen900.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.successGreen200.color, Asset.Colors.ZDesign.successGreen800.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.successGreen300.color, Asset.Colors.ZDesign.successGreen700.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.successGreen400.color, Asset.Colors.ZDesign.successGreen600.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.successGreen500.color, Asset.Colors.ZDesign.successGreen500.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.successGreen600.color, Asset.Colors.ZDesign.successGreen400.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.successGreen700.color, Asset.Colors.ZDesign.successGreen300.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.successGreen800.color, Asset.Colors.ZDesign.successGreen200.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.successGreen900.color, Asset.Colors.ZDesign.successGreen100.color, colorScheme)
}
}
}
public extension Design.Utility.ErrorRed {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.errorRed50.color, Asset.Colors.ZDesign.errorRed950.color)
case ._100: return Design.col(Asset.Colors.ZDesign.errorRed100.color, Asset.Colors.ZDesign.errorRed900.color)
case ._200: return Design.col(Asset.Colors.ZDesign.errorRed200.color, Asset.Colors.ZDesign.errorRed800.color)
case ._300: return Design.col(Asset.Colors.ZDesign.errorRed300.color, Asset.Colors.ZDesign.errorRed700.color)
case ._400: return Design.col(Asset.Colors.ZDesign.errorRed400.color, Asset.Colors.ZDesign.errorRed600.color)
case ._500: return Design.col(Asset.Colors.ZDesign.errorRed500.color, Asset.Colors.ZDesign.errorRed500.color)
case ._600: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color)
case ._700: return Design.col(Asset.Colors.ZDesign.errorRed700.color, Asset.Colors.ZDesign.errorRed300.color)
case ._800: return Design.col(Asset.Colors.ZDesign.errorRed800.color, Asset.Colors.ZDesign.errorRed200.color)
case ._900: return Design.col(Asset.Colors.ZDesign.errorRed900.color, Asset.Colors.ZDesign.errorRed100.color)
case ._50: return Design.col(Asset.Colors.ZDesign.errorRed50.color, Asset.Colors.ZDesign.errorRed950.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.errorRed100.color, Asset.Colors.ZDesign.errorRed900.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.errorRed200.color, Asset.Colors.ZDesign.errorRed800.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.errorRed300.color, Asset.Colors.ZDesign.errorRed700.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.errorRed400.color, Asset.Colors.ZDesign.errorRed600.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.errorRed500.color, Asset.Colors.ZDesign.errorRed500.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.errorRed600.color, Asset.Colors.ZDesign.errorRed400.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.errorRed700.color, Asset.Colors.ZDesign.errorRed300.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.errorRed800.color, Asset.Colors.ZDesign.errorRed200.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.errorRed900.color, Asset.Colors.ZDesign.errorRed100.color, colorScheme)
}
}
}
public extension Design.Utility.WarningYellow {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.warningYellow50.color, Asset.Colors.ZDesign.warningYellow950.color)
case ._100: return Design.col(Asset.Colors.ZDesign.warningYellow100.color, Asset.Colors.ZDesign.warningYellow900.color)
case ._200: return Design.col(Asset.Colors.ZDesign.warningYellow200.color, Asset.Colors.ZDesign.warningYellow800.color)
case ._300: return Design.col(Asset.Colors.ZDesign.warningYellow300.color, Asset.Colors.ZDesign.warningYellow700.color)
case ._400: return Design.col(Asset.Colors.ZDesign.warningYellow400.color, Asset.Colors.ZDesign.warningYellow600.color)
case ._500: return Design.col(Asset.Colors.ZDesign.warningYellow500.color, Asset.Colors.ZDesign.warningYellow500.color)
case ._600: return Design.col(Asset.Colors.ZDesign.warningYellow600.color, Asset.Colors.ZDesign.warningYellow400.color)
case ._700: return Design.col(Asset.Colors.ZDesign.warningYellow700.color, Asset.Colors.ZDesign.warningYellow300.color)
case ._800: return Design.col(Asset.Colors.ZDesign.warningYellow800.color, Asset.Colors.ZDesign.warningYellow200.color)
case ._900: return Design.col(Asset.Colors.ZDesign.warningYellow900.color, Asset.Colors.ZDesign.warningYellow100.color)
case ._50: return Design.col(Asset.Colors.ZDesign.warningYellow50.color, Asset.Colors.ZDesign.warningYellow950.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.warningYellow100.color, Asset.Colors.ZDesign.warningYellow900.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.warningYellow200.color, Asset.Colors.ZDesign.warningYellow800.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.warningYellow300.color, Asset.Colors.ZDesign.warningYellow700.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.warningYellow400.color, Asset.Colors.ZDesign.warningYellow600.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.warningYellow500.color, Asset.Colors.ZDesign.warningYellow500.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.warningYellow600.color, Asset.Colors.ZDesign.warningYellow400.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.warningYellow700.color, Asset.Colors.ZDesign.warningYellow300.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.warningYellow800.color, Asset.Colors.ZDesign.warningYellow200.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.warningYellow900.color, Asset.Colors.ZDesign.warningYellow100.color, colorScheme)
}
}
}
public extension Design.Utility.HyperBlue {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.hyperBlue50.color, Asset.Colors.ZDesign.hyperBlue950.color)
case ._100: return Design.col(Asset.Colors.ZDesign.hyperBlue100.color, Asset.Colors.ZDesign.hyperBlue900.color)
case ._200: return Design.col(Asset.Colors.ZDesign.hyperBlue200.color, Asset.Colors.ZDesign.hyperBlue800.color)
case ._300: return Design.col(Asset.Colors.ZDesign.hyperBlue300.color, Asset.Colors.ZDesign.hyperBlue700.color)
case ._400: return Design.col(Asset.Colors.ZDesign.hyperBlue400.color, Asset.Colors.ZDesign.hyperBlue600.color)
case ._500: return Design.col(Asset.Colors.ZDesign.hyperBlue500.color, Asset.Colors.ZDesign.hyperBlue500.color)
case ._600: return Design.col(Asset.Colors.ZDesign.hyperBlue600.color, Asset.Colors.ZDesign.hyperBlue400.color)
case ._700: return Design.col(Asset.Colors.ZDesign.hyperBlue700.color, Asset.Colors.ZDesign.hyperBlue300.color)
case ._800: return Design.col(Asset.Colors.ZDesign.hyperBlue800.color, Asset.Colors.ZDesign.hyperBlue200.color)
case ._900: return Design.col(Asset.Colors.ZDesign.hyperBlue900.color, Asset.Colors.ZDesign.hyperBlue100.color)
case ._50: return Design.col(Asset.Colors.ZDesign.hyperBlue50.color, Asset.Colors.ZDesign.hyperBlue950.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.hyperBlue100.color, Asset.Colors.ZDesign.hyperBlue900.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.hyperBlue200.color, Asset.Colors.ZDesign.hyperBlue800.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.hyperBlue300.color, Asset.Colors.ZDesign.hyperBlue700.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.hyperBlue400.color, Asset.Colors.ZDesign.hyperBlue600.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.hyperBlue500.color, Asset.Colors.ZDesign.hyperBlue500.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.hyperBlue600.color, Asset.Colors.ZDesign.hyperBlue400.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.hyperBlue700.color, Asset.Colors.ZDesign.hyperBlue300.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.hyperBlue800.color, Asset.Colors.ZDesign.hyperBlue200.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.hyperBlue900.color, Asset.Colors.ZDesign.hyperBlue100.color, colorScheme)
}
}
}
public extension Design.Utility.Indigo {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.indigo50.color, Asset.Colors.ZDesign.indigo950.color)
case ._100: return Design.col(Asset.Colors.ZDesign.indigo100.color, Asset.Colors.ZDesign.indigo900.color)
case ._200: return Design.col(Asset.Colors.ZDesign.indigo200.color, Asset.Colors.ZDesign.indigo800.color)
case ._300: return Design.col(Asset.Colors.ZDesign.indigo300.color, Asset.Colors.ZDesign.indigo700.color)
case ._400: return Design.col(Asset.Colors.ZDesign.indigo400.color, Asset.Colors.ZDesign.indigo600.color)
case ._500: return Design.col(Asset.Colors.ZDesign.indigo500.color, Asset.Colors.ZDesign.indigo500.color)
case ._600: return Design.col(Asset.Colors.ZDesign.indigo600.color, Asset.Colors.ZDesign.indigo400.color)
case ._700: return Design.col(Asset.Colors.ZDesign.indigo700.color, Asset.Colors.ZDesign.indigo300.color)
case ._800: return Design.col(Asset.Colors.ZDesign.indigo800.color, Asset.Colors.ZDesign.indigo200.color)
case ._900: return Design.col(Asset.Colors.ZDesign.indigo900.color, Asset.Colors.ZDesign.indigo100.color)
case ._50: return Design.col(Asset.Colors.ZDesign.indigo50.color, Asset.Colors.ZDesign.indigo950.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.indigo100.color, Asset.Colors.ZDesign.indigo900.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.indigo200.color, Asset.Colors.ZDesign.indigo800.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.indigo300.color, Asset.Colors.ZDesign.indigo700.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.indigo400.color, Asset.Colors.ZDesign.indigo600.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.indigo500.color, Asset.Colors.ZDesign.indigo500.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.indigo600.color, Asset.Colors.ZDesign.indigo400.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.indigo700.color, Asset.Colors.ZDesign.indigo300.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.indigo800.color, Asset.Colors.ZDesign.indigo200.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.indigo900.color, Asset.Colors.ZDesign.indigo100.color, colorScheme)
}
}
}
public extension Design.Utility.Purple {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.purple50.color, Asset.Colors.ZDesign.purple950.color)
case ._100: return Design.col(Asset.Colors.ZDesign.purple100.color, Asset.Colors.ZDesign.purple900.color)
case ._200: return Design.col(Asset.Colors.ZDesign.purple200.color, Asset.Colors.ZDesign.purple800.color)
case ._300: return Design.col(Asset.Colors.ZDesign.purple300.color, Asset.Colors.ZDesign.purple700.color)
case ._400: return Design.col(Asset.Colors.ZDesign.purple400.color, Asset.Colors.ZDesign.purple600.color)
case ._500: return Design.col(Asset.Colors.ZDesign.purple500.color, Asset.Colors.ZDesign.purple500.color)
case ._600: return Design.col(Asset.Colors.ZDesign.purple600.color, Asset.Colors.ZDesign.purple400.color)
case ._700: return Design.col(Asset.Colors.ZDesign.purple700.color, Asset.Colors.ZDesign.purple300.color)
case ._800: return Design.col(Asset.Colors.ZDesign.purple800.color, Asset.Colors.ZDesign.purple200.color)
case ._900: return Design.col(Asset.Colors.ZDesign.purple900.color, Asset.Colors.ZDesign.purple100.color)
case ._50: return Design.col(Asset.Colors.ZDesign.purple50.color, Asset.Colors.ZDesign.purple950.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.purple100.color, Asset.Colors.ZDesign.purple900.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.purple200.color, Asset.Colors.ZDesign.purple800.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.purple300.color, Asset.Colors.ZDesign.purple700.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.purple400.color, Asset.Colors.ZDesign.purple600.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.purple500.color, Asset.Colors.ZDesign.purple500.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.purple600.color, Asset.Colors.ZDesign.purple400.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.purple700.color, Asset.Colors.ZDesign.purple300.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.purple800.color, Asset.Colors.ZDesign.purple200.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.purple900.color, Asset.Colors.ZDesign.purple100.color, colorScheme)
}
}
}
public extension Design.Utility.Brand {
var color: Color {
func color(_ colorScheme: ColorScheme) -> Color {
switch self {
case ._50: return Design.col(Asset.Colors.ZDesign.brand50.color, Asset.Colors.ZDesign.brand950.color)
case ._100: return Design.col(Asset.Colors.ZDesign.brand100.color, Asset.Colors.ZDesign.brand900.color)
case ._200: return Design.col(Asset.Colors.ZDesign.brand200.color, Asset.Colors.ZDesign.brand800.color)
case ._300: return Design.col(Asset.Colors.ZDesign.brand300.color, Asset.Colors.ZDesign.brand700.color)
case ._400: return Design.col(Asset.Colors.ZDesign.brand400.color, Asset.Colors.ZDesign.brand600.color)
case ._500: return Design.col(Asset.Colors.ZDesign.brand500.color, Asset.Colors.ZDesign.brand500.color)
case ._600: return Design.col(Asset.Colors.ZDesign.brand600.color, Asset.Colors.ZDesign.brand400.color)
case ._700: return Design.col(Asset.Colors.ZDesign.brand700.color, Asset.Colors.ZDesign.brand300.color)
case ._800: return Design.col(Asset.Colors.ZDesign.brand800.color, Asset.Colors.ZDesign.brand200.color)
case ._900: return Design.col(Asset.Colors.ZDesign.brand900.color, Asset.Colors.ZDesign.brand100.color)
case ._50: return Design.col(Asset.Colors.ZDesign.brand50.color, Asset.Colors.ZDesign.brand950.color, colorScheme)
case ._100: return Design.col(Asset.Colors.ZDesign.brand100.color, Asset.Colors.ZDesign.brand900.color, colorScheme)
case ._200: return Design.col(Asset.Colors.ZDesign.brand200.color, Asset.Colors.ZDesign.brand800.color, colorScheme)
case ._300: return Design.col(Asset.Colors.ZDesign.brand300.color, Asset.Colors.ZDesign.brand700.color, colorScheme)
case ._400: return Design.col(Asset.Colors.ZDesign.brand400.color, Asset.Colors.ZDesign.brand600.color, colorScheme)
case ._500: return Design.col(Asset.Colors.ZDesign.brand500.color, Asset.Colors.ZDesign.brand500.color, colorScheme)
case ._600: return Design.col(Asset.Colors.ZDesign.brand600.color, Asset.Colors.ZDesign.brand400.color, colorScheme)
case ._700: return Design.col(Asset.Colors.ZDesign.brand700.color, Asset.Colors.ZDesign.brand300.color, colorScheme)
case ._800: return Design.col(Asset.Colors.ZDesign.brand800.color, Asset.Colors.ZDesign.brand200.color, colorScheme)
case ._900: return Design.col(Asset.Colors.ZDesign.brand900.color, Asset.Colors.ZDesign.brand100.color, colorScheme)
}
}
}
@ -694,7 +694,39 @@ public extension Design.Utility.Brand {
// MARK: Helpers
private extension Design {
static func col(_ light: Color, _ dark: Color) -> Color {
UITraitCollection.current.userInterfaceStyle == .light ? light : dark
static func col(_ light: Color, _ dark: Color, _ colorScheme: ColorScheme) -> Color {
colorScheme == .light ? light : dark
}
}
// MARK: - View Modifiers
struct ZashiForegroundColorModifier: ViewModifier {
@Environment(\.colorScheme) var colorScheme
let style: Colorable
func body(content: Content) -> some View {
content.foregroundColor(style.color(colorScheme))
}
}
public extension View {
func zForegroundColor(_ style: Colorable) -> some View {
modifier(ZashiForegroundColorModifier(style: style))
}
}
struct ZashiColorBackgroundModifier: ViewModifier {
@Environment(\.colorScheme) var colorScheme
let style: Colorable
func body(content: Content) -> some View {
content.background(style.color(colorScheme))
}
}
public extension View {
func zBackground(_ style: Colorable) -> some View {
modifier(ZashiColorBackgroundModifier(style: style))
}
}

View File

@ -49,22 +49,22 @@ public struct TransactionState: Equatable, Identifiable {
public var rawID: Data? = nil
// UI Colors
public var balanceColor: Color {
public func balanceColor(_ colorScheme: ColorScheme) -> Color {
status == .failed
? Design.Utility.ErrorRed._600.color
? Design.Utility.ErrorRed._600.color(colorScheme)
: (isSpending || isShieldingTransaction)
? Design.Utility.ErrorRed._600.color
? Design.Utility.ErrorRed._600.color(colorScheme)
: Asset.Colors.primary.color
}
public var titleColor: Color {
public func titleColor(_ colorScheme: ColorScheme) -> Color {
status == .failed
? Design.Utility.ErrorRed._600.color
? Design.Utility.ErrorRed._600.color(colorScheme)
: isPending
? Asset.Colors.shade47.color
: Asset.Colors.primary.color
}
public var isUnread: Bool {
// in case memos haven't been loaded yet
// non-nil rawID represents unloaded memos state

View File

@ -86,23 +86,27 @@ extension View {
}
public func applyErredScreenBackground() -> some View {
self.modifier(
@Environment(\.colorScheme) var colorScheme
return self.modifier(
ScreenGradientBackgroundModifier(
stops: [
Gradient.Stop(color: Design.Utility.WarningYellow._100.color, location: 0.0),
Gradient.Stop(color: Design.screenBackground.color, location: 0.4)
Gradient.Stop(color: Design.Utility.WarningYellow._100.color(colorScheme), location: 0.0),
Gradient.Stop(color: Design.screenBackground.color(colorScheme), location: 0.4)
]
)
)
}
public func applyBrandedScreenBackground() -> some View {
self.modifier(
@Environment(\.colorScheme) var colorScheme
return self.modifier(
ScreenGradientBackgroundModifier(
stops: [
Gradient.Stop(color: Design.Utility.Brand._600.color, location: 0.0),
Gradient.Stop(color: Design.Utility.Brand._400.color, location: 0.5),
Gradient.Stop(color: Design.screenBackground.color, location: 0.75)
Gradient.Stop(color: Design.Utility.Brand._600.color(colorScheme), location: 0.0),
Gradient.Stop(color: Design.Utility.Brand._400.color(colorScheme), location: 0.5),
Gradient.Stop(color: Design.screenBackground.color(colorScheme), location: 0.75)
]
)
)
@ -115,22 +119,26 @@ extension View {
}
public func applySuccessScreenBackground() -> some View {
self.modifier(
@Environment(\.colorScheme) var colorScheme
return self.modifier(
ScreenGradientBackgroundModifier(
stops: [
Gradient.Stop(color: Design.Utility.SuccessGreen._100.color, location: 0.0),
Gradient.Stop(color: Design.screenBackground.color, location: 0.4)
Gradient.Stop(color: Design.Utility.SuccessGreen._100.color(colorScheme), location: 0.0),
Gradient.Stop(color: Design.screenBackground.color(colorScheme), location: 0.4)
]
)
)
}
public func applyFailureScreenBackground() -> some View {
self.modifier(
@Environment(\.colorScheme) var colorScheme
return self.modifier(
ScreenGradientBackgroundModifier(
stops: [
Gradient.Stop(color: Design.Utility.ErrorRed._100.color, location: 0.0),
Gradient.Stop(color: Design.screenBackground.color, location: 0.4)
Gradient.Stop(color: Design.Utility.ErrorRed._100.color(colorScheme), location: 0.0),
Gradient.Stop(color: Design.screenBackground.color(colorScheme), location: 0.4)
]
)
)

View File

@ -10,6 +10,8 @@ import SwiftUI
import Generated
public struct PrivacyBadge: View {
@Environment(\.colorScheme) private var colorScheme
public enum Privacy {
case low
case max
@ -50,14 +52,14 @@ public struct PrivacyBadge: View {
.background {
RoundedRectangle(cornerRadius: 16)
.fill(privacy == .max
? Design.Utility.Purple._50.color
: Design.Utility.WarningYellow._50.color
? Design.Utility.Purple._50.color(colorScheme)
: Design.Utility.WarningYellow._50.color(colorScheme)
)
.background {
RoundedRectangle(cornerRadius: 16)
.stroke(privacy == .max
? Design.Utility.Purple._200.color
: Design.Utility.WarningYellow._200.color
? Design.Utility.Purple._200.color(colorScheme)
: Design.Utility.WarningYellow._200.color(colorScheme)
)
}
}

View File

@ -31,7 +31,7 @@ public struct BalanceWithIconView: View {
Circle()
.frame(width: 25, height: 25)
.foregroundColor(Design.Surfaces.brandBg.color)
.zForegroundColor(Design.Surfaces.brandBg)
.overlay {
ZcashSymbol()
.frame(width: 15, height: 15)

View File

@ -11,6 +11,7 @@ import Generated
public struct ActionRow<AccessoryContent>: View where AccessoryContent: View {
@Environment(\.isEnabled) private var isEnabled
@Environment(\.colorScheme) private var colorScheme
let icon: Image
let title: String
@ -64,8 +65,8 @@ public struct ActionRow<AccessoryContent>: View where AccessoryContent: View {
.background {
Circle()
.fill(isEnabled
? Design.Surfaces.bgTertiary.color
: Design.Surfaces.bgSecondary.color)
? Design.Surfaces.bgTertiary.color(colorScheme)
: Design.Surfaces.bgSecondary.color(colorScheme))
}
.padding(.trailing, 16)
}
@ -111,7 +112,7 @@ public struct ActionRow<AccessoryContent>: View where AccessoryContent: View {
.padding(.horizontal, horizontalPadding)
if divider {
Design.Surfaces.divider.color
Design.Surfaces.divider.color(colorScheme)
.frame(height: 1)
.padding(.top, 12)
}

View File

@ -9,6 +9,8 @@ import SwiftUI
import Generated
public struct CheckboxToggleStyle: ToggleStyle {
@Environment(\.colorScheme) private var colorScheme
public init() { }
public func makeBody(configuration: Configuration) -> some View {
@ -16,7 +18,7 @@ public struct CheckboxToggleStyle: ToggleStyle {
ZStack {
if configuration.isOn {
RoundedRectangle(cornerRadius: 4)
.fill(Design.Checkboxes.onBg.color)
.fill(Design.Checkboxes.onBg.color(colorScheme))
.frame(width: 16, height: 16)
.overlay {
Asset.Assets.check.image
@ -24,11 +26,11 @@ public struct CheckboxToggleStyle: ToggleStyle {
}
} else {
RoundedRectangle(cornerRadius: 4)
.fill(Design.Checkboxes.offBg.color)
.fill(Design.Checkboxes.offBg.color(colorScheme))
.frame(width: 16, height: 16)
.background {
RoundedRectangle(cornerRadius: 4)
.stroke(Design.Checkboxes.offStroke.color)
.stroke(Design.Checkboxes.offStroke.color(colorScheme))
}
}
}

View File

@ -22,6 +22,7 @@ public struct ZashiButton<PrefixContent, AccessoryContent>: View where PrefixCon
}
@Environment(\.isEnabled) var isEnabled
@Environment(\.colorScheme) private var colorScheme
let title: String
let type: `Type`
@ -66,129 +67,129 @@ public struct ZashiButton<PrefixContent, AccessoryContent>: View where PrefixCon
.padding(.leading, 8)
}
}
.foregroundColor(fgColor())
.zForegroundColor(fgColor())
.padding(.horizontal, 18)
.padding(.vertical, 12)
.frame(maxWidth: infinityWidth ? .infinity : nil)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(bgColor())
.fill(bgColor().color(colorScheme))
.overlay {
RoundedRectangle(cornerRadius: 12)
.stroke(strokeColor())
.stroke(strokeColor().color(colorScheme))
}
}
}
}
private func bgColor() -> Color {
private func bgColor() -> Colorable {
switch type {
case .primary:
return isEnabled
? Design.Btns.Primary.bg.color
: Design.Btns.Primary.bgDisabled.color
? Design.Btns.Primary.bg
: Design.Btns.Primary.bgDisabled
case .secondary:
return isEnabled
? Design.Btns.Secondary.bg.color
: Design.Btns.Secondary.bgDisabled.color
? Design.Btns.Secondary.bg
: Design.Btns.Secondary.bgDisabled
case .tertiary:
return isEnabled
? Design.Btns.Tertiary.bg.color
: Design.Btns.Tertiary.bgDisabled.color
? Design.Btns.Tertiary.bg
: Design.Btns.Tertiary.bgDisabled
case .quaternary:
return isEnabled
? Design.Btns.Quaternary.bg.color
: Design.Btns.Quaternary.bgDisabled.color
? Design.Btns.Quaternary.bg
: Design.Btns.Quaternary.bgDisabled
case .destructive1:
return isEnabled
? Design.Btns.Destructive1.bg.color
: Design.Btns.Destructive1.bgDisabled.color
? Design.Btns.Destructive1.bg
: Design.Btns.Destructive1.bgDisabled
case .destructive2:
return isEnabled
? Design.Btns.Destructive2.bg.color
: Design.Btns.Destructive2.bgDisabled.color
? Design.Btns.Destructive2.bg
: Design.Btns.Destructive2.bgDisabled
case .brand:
return isEnabled
? Design.Btns.Brand.bg.color
: Design.Btns.Brand.bgDisabled.color
? Design.Btns.Brand.bg
: Design.Btns.Brand.bgDisabled
case .ghost:
return isEnabled
? Design.Btns.Ghost.bg.color
: Design.Btns.Ghost.bgDisabled.color
? Design.Btns.Ghost.bg
: Design.Btns.Ghost.bgDisabled
}
}
private func fgColor() -> Color {
private func fgColor() -> Colorable {
switch type {
case .primary:
return isEnabled
? Design.Btns.Primary.fg.color
: Design.Btns.Primary.fgDisabled.color
? Design.Btns.Primary.fg
: Design.Btns.Primary.fgDisabled
case .secondary:
return isEnabled
? Design.Btns.Secondary.fg.color
: Design.Btns.Secondary.fgDisabled.color
? Design.Btns.Secondary.fg
: Design.Btns.Secondary.fgDisabled
case .tertiary:
return isEnabled
? Design.Btns.Tertiary.fg.color
: Design.Btns.Tertiary.fgDisabled.color
? Design.Btns.Tertiary.fg
: Design.Btns.Tertiary.fgDisabled
case .quaternary:
return isEnabled
? Design.Btns.Quaternary.fg.color
: Design.Btns.Quaternary.fgDisabled.color
? Design.Btns.Quaternary.fg
: Design.Btns.Quaternary.fgDisabled
case .destructive1:
return isEnabled
? Design.Btns.Destructive1.fg.color
: Design.Btns.Destructive1.fgDisabled.color
? Design.Btns.Destructive1.fg
: Design.Btns.Destructive1.fgDisabled
case .destructive2:
return isEnabled
? Design.Btns.Destructive2.fg.color
: Design.Btns.Destructive2.fgDisabled.color
? Design.Btns.Destructive2.fg
: Design.Btns.Destructive2.fgDisabled
case .brand:
return isEnabled
? Design.Btns.Brand.fg.color
: Design.Btns.Brand.fgDisabled.color
? Design.Btns.Brand.fg
: Design.Btns.Brand.fgDisabled
case .ghost:
return isEnabled
? Design.Btns.Ghost.fg.color
: Design.Btns.Ghost.fgDisabled.color
? Design.Btns.Ghost.fg
: Design.Btns.Ghost.fgDisabled
}
}
private func strokeColor() -> Color {
private func strokeColor() -> Colorable {
switch type {
case .primary:
return isEnabled
? Design.Btns.Primary.bg.color
: Design.Btns.Primary.bgDisabled.color
? Design.Btns.Primary.bg
: Design.Btns.Primary.bgDisabled
case .secondary:
return isEnabled
? Design.Btns.Secondary.border.color
: Design.Btns.Secondary.bgDisabled.color
? Design.Btns.Secondary.border
: Design.Btns.Secondary.bgDisabled
case .tertiary:
return isEnabled
? Design.Btns.Tertiary.bg.color
: Design.Btns.Tertiary.bgDisabled.color
? Design.Btns.Tertiary.bg
: Design.Btns.Tertiary.bgDisabled
case .quaternary:
return isEnabled
? Design.Btns.Quaternary.bg.color
: Design.Btns.Quaternary.bgDisabled.color
? Design.Btns.Quaternary.bg
: Design.Btns.Quaternary.bgDisabled
case .destructive1:
return isEnabled
? Design.Btns.Destructive1.border.color
: Design.Btns.Destructive1.bgDisabled.color
? Design.Btns.Destructive1.border
: Design.Btns.Destructive1.bgDisabled
case .destructive2:
return isEnabled
? Design.Btns.Destructive2.bg.color
: Design.Btns.Destructive2.bgDisabled.color
? Design.Btns.Destructive2.bg
: Design.Btns.Destructive2.bgDisabled
case .brand:
return isEnabled
? Design.Btns.Brand.bg.color
: Design.Btns.Brand.bgDisabled.color
? Design.Btns.Brand.bg
: Design.Btns.Brand.bgDisabled
case .ghost:
return isEnabled
? Design.Btns.Ghost.bg.color
: Design.Btns.Ghost.bgDisabled.color
? Design.Btns.Ghost.bg
: Design.Btns.Ghost.bgDisabled
}
}
}

View File

@ -9,6 +9,8 @@ import SwiftUI
import Generated
public struct ContactView: View {
@Environment(\.colorScheme) private var colorScheme
var iconText: String
var title: String
var desc: String?
@ -35,24 +37,24 @@ public struct ContactView: View {
Text(iconText)
.minimumScaleFactor(0.5)
.font(.custom(FontFamily.Inter.semiBold.name, size: 14))
.foregroundColor(Design.Avatars.textFg.color)
.zForegroundColor(Design.Avatars.textFg)
.frame(width: 20, height: 20)
.padding(10)
.background {
Circle()
.fill(Design.Avatars.bg.color)
.fill(Design.Avatars.bg.color(colorScheme))
}
.padding(.trailing, 16)
VStack(alignment: .leading, spacing: 0) {
Text(title)
.font(.custom(FontFamily.Inter.semiBold.name, size: 14))
.foregroundColor(Design.Text.primary.color)
.zForegroundColor(Design.Text.primary)
if let desc {
Text(desc)
.font(.custom(FontFamily.Inter.regular.name, size: 14))
.foregroundColor(Design.Text.tertiary.color)
.zForegroundColor(Design.Text.tertiary)
.lineLimit(1)
.truncationMode(.middle)
.padding(.top, 2)

View File

@ -19,7 +19,7 @@ public extension Image {
.resizable()
.renderingMode(.template)
.frame(width: width, height: height)
.foregroundColor(style.color)
.zForegroundColor(style)
}
func zImage(
@ -42,7 +42,7 @@ public extension Image {
.resizable()
.renderingMode(.template)
.frame(width: size, height: size)
.foregroundColor(style.color)
.zForegroundColor(style)
}
func zImage(

View File

@ -10,6 +10,8 @@ import SwiftUI
import Generated
public struct InfoRow: View {
@Environment(\.colorScheme) private var colorScheme
let icon: Image
let title: String
@ -28,7 +30,7 @@ public struct InfoRow: View {
.padding(10)
.background {
Circle()
.fill(Design.Surfaces.bgTertiary.color)
.fill(Design.Surfaces.bgTertiary.color(colorScheme))
}
.padding(.trailing, 16)

View File

@ -22,7 +22,7 @@ public struct ZashiSyncingProgressStyle: ProgressViewStyle {
Rectangle()
.frame(width: 232 * fractionCompleted, height: 14)
.offset(x: -116 + (116 * fractionCompleted), y: 0)
.foregroundColor(Design.Surfaces.brandBg.color)
.zForegroundColor(Design.Surfaces.brandBg)
}
}
}

View File

@ -39,7 +39,7 @@ public struct ZashiFontModifier: ViewModifier {
public func body(content: Content) -> some View {
content
.font(.custom(fontName(weight, addressFont: addressFont), size: size))
.foregroundColor(style.color)
.zForegroundColor(style)
}
private func fontName(_ weight: FontWeight, addressFont: Bool = false) -> String {

View File

@ -22,6 +22,7 @@ public extension View {
}
public struct MessageEditorView: View {
@Environment(\.colorScheme) private var colorScheme
@Perception.Bindable var store: StoreOf<MessageEditor>
let title: String
@ -57,7 +58,7 @@ public struct MessageEditorView: View {
.padding(.horizontal, 10)
.padding(.top, 2)
.padding(.bottom, 10)
.colorBackground(Design.Inputs.Default.bg.color)
.colorBackground(Design.Inputs.Default.bg.color(colorScheme))
.cornerRadius(10)
.overlay {
if store.text.isEmpty {
@ -65,7 +66,7 @@ public struct MessageEditorView: View {
VStack {
Text(placeholder)
.font(.custom(FontFamily.Inter.regular.name, size: 16))
.foregroundColor(Design.Inputs.Default.text.color)
.zForegroundColor(Design.Inputs.Default.text)
.onTapGesture {
isFocused = true
}
@ -89,8 +90,8 @@ public struct MessageEditorView: View {
.font(.custom(FontFamily.Inter.regular.name, size: 14))
.foregroundColor(
store.isValid
? Design.Inputs.Default.hint.color
: Design.Inputs.Filled.required.color
? Design.Inputs.Default.hint.color(colorScheme)
: Design.Inputs.Filled.required.color(colorScheme)
)
.padding(.trailing, 14)
.padding(.bottom, 14)
@ -100,14 +101,14 @@ public struct MessageEditorView: View {
}
.background {
RoundedRectangle(cornerRadius: 10)
.fill(Design.Inputs.Default.bg.color)
.fill(Design.Inputs.Default.bg.color(colorScheme))
}
if store.featureFlags.addUAtoMemo && isAddUAtoMemoActive && !store.uAddress.isEmpty {
ZashiToggle(
isOn: $store.isUAaddedToMemo,
label: store.isUAaddedToMemo ? L10n.MessageEditor.removeUA : L10n.MessageEditor.addUA,
textColor: Design.Inputs.Filled.label.color
textColor: Design.Inputs.Filled.label.color(colorScheme)
)
.padding(.top, 12)
.padding(.leading, 1)

View File

@ -10,6 +10,8 @@ import SwiftUI
import Generated
public struct ZashiTextField<PrefixContent, AccessoryContent>: View where PrefixContent: View, AccessoryContent: View {
@Environment(\.colorScheme) private var colorScheme
let addressFont: Bool
var text: Binding<String>
var placeholder: String
@ -44,7 +46,7 @@ public struct ZashiTextField<PrefixContent, AccessoryContent>: View where Prefix
.lineLimit(1)
.truncationMode(.middle)
.font(.custom(FontFamily.Inter.medium.name, size: 14))
.foregroundColor(Design.Inputs.Filled.label.color)
.zForegroundColor(Design.Inputs.Filled.label)
.padding(.bottom, 6)
}
@ -60,7 +62,7 @@ public struct ZashiTextField<PrefixContent, AccessoryContent>: View where Prefix
prompt:
Text(placeholder)
.font(.custom(FontFamily.Inter.regular.name, size: 16))
.foregroundColor(Design.Inputs.Default.text.color)
.foregroundColor(Design.Inputs.Default.text.color(colorScheme))
)
.autocapitalization(.none)
.font(.custom(
@ -84,20 +86,20 @@ public struct ZashiTextField<PrefixContent, AccessoryContent>: View where Prefix
.padding(.horizontal, 12)
.background(
RoundedRectangle(cornerRadius: 10)
.fill(Design.Inputs.Default.bg.color)
.fill(Design.Inputs.Default.bg.color(colorScheme))
.overlay {
RoundedRectangle(cornerRadius: 10)
.stroke(
error == nil
? Design.Inputs.Default.bg.color
: Design.Inputs.ErrorFilled.stroke.color
? Design.Inputs.Default.bg.color(colorScheme)
: Design.Inputs.ErrorFilled.stroke.color(colorScheme)
)
}
)
if let error {
Text(error)
.foregroundColor(Design.Inputs.ErrorFilled.hint.color)
.zForegroundColor(Design.Inputs.ErrorFilled.hint)
.font(.custom(FontFamily.Inter.regular.name, size: 14))
.padding(.top, 6)
}
@ -120,7 +122,7 @@ public struct ZashiTextField<PrefixContent, AccessoryContent>: View where Prefix
prefixView:
ZcashSymbol()
.frame(width: 12, height: 20)
.foregroundColor(Design.Inputs.Default.text.color)
.zForegroundColor(Design.Inputs.Default.text)
)
ZashiTextField(

View File

@ -10,6 +10,8 @@ import ComposableArchitecture
import Generated
public struct Toast: ViewModifier {
@Environment(\.colorScheme) private var colorScheme
public enum Edge: Equatable {
case top(String)
case bottom(String)
@ -39,7 +41,7 @@ public struct Toast: ViewModifier {
.padding(.vertical, 12)
.background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Btns.Primary.bg.color)
.fill(Design.Btns.Primary.bg.color(colorScheme))
}
if top {

View File

@ -9,6 +9,7 @@ import SwiftUI
import Generated
struct ZashiBackV2Modifier: ViewModifier {
@Environment(\.colorScheme) private var colorScheme
@Environment(\.dismiss) private var dismiss
let disabled: Bool
@ -48,7 +49,7 @@ struct ZashiBackV2Modifier: ViewModifier {
.background {
if background {
RoundedRectangle(cornerRadius: 12)
.fill(Design.Btns.Tertiary.bg.color)
.fill(Design.Btns.Tertiary.bg.color(colorScheme))
}
}
}

View File

@ -39,12 +39,12 @@ public struct Tooltip: View {
VStack(alignment: .leading) {
Text(title)
.font(.custom(FontFamily.Inter.semiBold.name, size: 16))
.foregroundColor(Design.Text.light.color)
.zForegroundColor(Design.Text.light)
.padding(.bottom, 4)
Text(desc)
.font(.custom(FontFamily.Inter.medium.name, size: 14))
.foregroundColor(Design.Text.lightSupport.color)
.zForegroundColor(Design.Text.lightSupport)
.lineLimit(nil)
.lineSpacing(1.5)
}
@ -52,10 +52,10 @@ public struct Tooltip: View {
Asset.Assets.buttonCloseX.image
.resizable()
.frame(width: 20, height: 20)
.foregroundColor(Design.HintTooltips.defaultFg.color)
.zForegroundColor(Design.HintTooltips.defaultFg)
}
.padding(12)
.background(Design.HintTooltips.surfacePrimary.color)
.zBackground(Design.HintTooltips.surfacePrimary)
.cornerRadius(8)
// TODO: Colors from Design once available
.shadow(color: Color(red: 0.137, green: 0.122, blue: 0.125).opacity(0.03), radius: 4, x: 0, y: 4)