From 15352931b6bae00d9452d69bf9c13a73647b6975 Mon Sep 17 00:00:00 2001 From: xan-m Date: Fri, 20 Aug 2021 20:27:09 -0700 Subject: [PATCH] - Some quick UI color stuff -- I hadn't seen it in light mode yet and noticed some pretty glaring issues! --- Infini-iOS/Utilities/ColorPalette.swift | 2 + .../View Components/BLEStatusView.swift | 7 +- Infini-iOS/View Components/DFU/DFUView.swift | 4 +- Infini-iOS/View Components/SideMenu.swift | 1 + .../StatusViewTabs.swift | 73 +++++++++---------- 5 files changed, 42 insertions(+), 45 deletions(-) diff --git a/Infini-iOS/Utilities/ColorPalette.swift b/Infini-iOS/Utilities/ColorPalette.swift index 50645d1..d05e1b1 100644 --- a/Infini-iOS/Utilities/ColorPalette.swift +++ b/Infini-iOS/Utilities/ColorPalette.swift @@ -13,4 +13,6 @@ import SwiftUI extension Color { static let darkGray = Color(red: 50 / 255, green: 50 / 255, blue: 50 / 255) static let darkestGray = Color(red: 25 / 255, green: 25 / 255, blue: 25 / 255) + static let lightGray = Color(red: 200 / 255, green: 200 / 255, blue: 200 / 255) + } diff --git a/Infini-iOS/View Components/BLEStatusView.swift b/Infini-iOS/View Components/BLEStatusView.swift index 65f8f21..3a53e28 100644 --- a/Infini-iOS/View Components/BLEStatusView.swift +++ b/Infini-iOS/View Components/BLEStatusView.swift @@ -11,6 +11,7 @@ import SwiftUI struct StatusView: View { @EnvironmentObject var bleManager: BLEManager + @Environment(\.colorScheme) var colorScheme var body: some View { VStack (spacing: 10){ @@ -30,7 +31,7 @@ struct StatusView: View { .padding() .padding(.vertical, 7) .frame(maxWidth: .infinity, alignment: .center) - .background(Color.gray) + .background(colorScheme == .dark ? Color.darkGray : Color.gray) .foregroundColor(Color.white) .cornerRadius(10) .padding(.horizontal, 20) @@ -41,8 +42,8 @@ struct StatusView: View { .padding() .padding(.vertical, 7) .frame(maxWidth: .infinity, alignment: .center) - .background(Color.darkGray) - .foregroundColor(Color.gray) + .background(colorScheme == .dark ? Color.gray : Color.lightGray) + .foregroundColor(colorScheme == .dark ? Color.gray : Color.white) .cornerRadius(10) .padding(.horizontal, 20) .padding(.bottom) diff --git a/Infini-iOS/View Components/DFU/DFUView.swift b/Infini-iOS/View Components/DFU/DFUView.swift index a11078a..0bdbaeb 100644 --- a/Infini-iOS/View Components/DFU/DFUView.swift +++ b/Infini-iOS/View Components/DFU/DFUView.swift @@ -92,7 +92,7 @@ struct DFUView: View { .padding() .padding(.vertical, 7) .frame(maxWidth: .infinity, alignment: .center) - .background(firmwareSelected ? Color.gray : Color.darkGray) + .background(colorScheme == .dark ? (firmwareSelected ? Color.darkGray : Color.darkestGray) : (firmwareSelected ? Color.gray : Color.lightGray)) .foregroundColor(firmwareSelected ? Color.white : Color.gray) .cornerRadius(10) .padding(.horizontal, 20) @@ -108,7 +108,7 @@ struct DFUView: View { .padding() .padding(.vertical, 7) .frame(maxWidth: .infinity, alignment: .center) - .background(firmwareSelected ? Color.gray : Color.darkGray) + .background(colorScheme == .dark ? (firmwareSelected ? Color.darkGray : Color.darkestGray) : (firmwareSelected ? Color.gray : Color.lightGray)) .foregroundColor(firmwareSelected ? Color.white : Color.gray) .cornerRadius(10) .padding(.horizontal, 20) diff --git a/Infini-iOS/View Components/SideMenu.swift b/Infini-iOS/View Components/SideMenu.swift index f274832..ac58b04 100644 --- a/Infini-iOS/View Components/SideMenu.swift +++ b/Infini-iOS/View Components/SideMenu.swift @@ -77,6 +77,7 @@ struct SideMenu: View { VStack (alignment: .center, spacing:10) { Text("STATUS") .font(.headline) + .foregroundColor(Color.gray) if bleManager.isSwitchedOn { diff --git a/Infini-iOS/View Components/Status View Components/StatusViewTabs.swift b/Infini-iOS/View Components/Status View Components/StatusViewTabs.swift index 1ad989e..79b3f77 100644 --- a/Infini-iOS/View Components/Status View Components/StatusViewTabs.swift +++ b/Infini-iOS/View Components/Status View Components/StatusViewTabs.swift @@ -14,53 +14,46 @@ struct StatusTabs: View { @EnvironmentObject var bleManager: BLEManager @State var trueIfHeart = true - + @State var trueIfBat = false + @Environment(\.colorScheme) var colorScheme + var body: some View{ VStack { - if !bleManager.isConnectedToPinetime { - Text("Disconnected") - .foregroundColor(Color.white) + HStack { + Button (action: { + self.trueIfHeart = true + self.trueIfBat = false + }) { + (Text(Image(systemName: "heart")) + .foregroundColor(Color.pink) + + Text(": " + String(format: "%.0f", bleManager.heartBPM)) + .foregroundColor(Color.white)) + .frame(maxWidth:.infinity, alignment: .center) + .padding() + .background(colorScheme == .dark ? (trueIfHeart ? Color.darkGray : Color.darkestGray) : (trueIfHeart ? Color.gray : Color.lightGray)) + .cornerRadius(5) + .font(.title) + }.padding(.leading, 10) + Button (action: { + self.trueIfHeart = false + self.trueIfBat = true + }) { + (Text(Image(systemName: "battery.100")) + .foregroundColor(Color.green) + + Text(": " + String(format: "%.0f", bleManager.batteryLevel)) + .foregroundColor(Color.white)) .frame(maxWidth: .infinity, alignment: .center) .padding() - .background(Color.darkGray) + .background(colorScheme == .dark ? (trueIfBat ? Color.darkGray : Color.darkestGray) : (trueIfBat ? Color.gray : Color.lightGray)) .cornerRadius(5) .font(.title) - .padding(.horizontal, 10) - } else { - HStack { - Button (action: { - self.trueIfHeart = true - }) { - (Text(Image(systemName: "heart")) - .foregroundColor(Color.pink) + - Text(": " + String(format: "%.0f", bleManager.heartBPM)) - .foregroundColor(Color.white)) - .frame(maxWidth:.infinity, alignment: .center) - .padding() - .background(trueIfHeart ? Color.darkGray : Color.darkestGray) - .cornerRadius(5) - .font(.title) - }.padding(.leading, 10) - Button (action: { - self.trueIfHeart = false - }) { - (Text(Image(systemName: "battery.100")) - .foregroundColor(Color.green) + - Text(": " + String(format: "%.0f", bleManager.batteryLevel)) - .foregroundColor(Color.white)) - .frame(maxWidth: .infinity, alignment: .center) - .padding() - .background(trueIfHeart ? Color.darkestGray : Color.darkGray) - .cornerRadius(5) - .font(.title) - } - .padding(.trailing, 10) - } - if trueIfHeart { - HeartChart() - } else { - BatteryChart() } + .padding(.trailing, 10) + } + if trueIfHeart { + HeartChart() + } else { + BatteryChart() } } }