Merge pull request #3154 from omnivore-app/fix/ios-dark-light-switch

jacksonh · web-flow · commit 8f0f09084c56 · 2023-11-22T13:13:19.000+08:00
Better light/dark mode switching on iOS
diff --git a/apple/OmnivoreKit/Sources/App/Views/Home/HomeFeedViewIOS.swift b/apple/OmnivoreKit/Sources/App/Views/Home/HomeFeedViewIOS.swift
@@ -482,7 +482,7 @@ struct AnimatingCellHeight: AnimatableModifier {
             }
           }
         }
-        .background(Color.isDarkMode ? Color(hex: "#1C1C1C") : Color.systemBackground)
+        .background(Color.themeFeatureBackground)
         .frame(height: 190)
 
         if !Color.isDarkMode {
@@ -567,7 +567,7 @@ struct AnimatingCellHeight: AnimatableModifier {
             featureCard
               .listRowInsets(.init(top: 0, leading: 0, bottom: 0, trailing: 0))
               .listRowSeparator(.hidden, edges: .all)
-              .modifier(AnimatingCellHeight(height: 190 + (Color.isDarkMode ? 13 : 13)))
+              .modifier(AnimatingCellHeight(height: 190 + 13))
               .onDisappear {
                 withAnimation {
                   isListScrolled = true
diff --git a/apple/OmnivoreKit/Sources/Views/Colors/Colors.swift b/apple/OmnivoreKit/Sources/Views/Colors/Colors.swift
@@ -29,6 +29,8 @@ public extension Color {
   static var themeLightestGray: Color { Color("_lightestGray", bundle: .module) }
   static var themeDarkWhiteGray: Color { Color("_darkWhiteGray", bundle: .module) }
   static var themeDarkGray: Color { Color("_darkGray", bundle: .module) }
+  static var themeLibraryItemSubtle: Color { Color("_themeLibraryItemSubtle", bundle: .module) }
+  static var themeFeatureBackground: Color { Color("_themeFeatureBackground", bundle: .module) }
 
   static var themeLabelOutline: Color { Color("_labelOutline", bundle: .module) }
   static var themeLabelForeground: Color { Color("_labelForeground", bundle: .module) }
diff --git a/apple/OmnivoreKit/Sources/Views/Colors/ThemeColors.xcassets/_darkWhiteGray.colorset/Contents.json b/apple/OmnivoreKit/Sources/Views/Colors/ThemeColors.xcassets/_darkWhiteGray.colorset/Contents.json
@@ -2,7 +2,7 @@
   "colors" : [
     {
       "color" : {
-        "color-space" : "srgb",
+        "color-space" : "display-p3",
         "components" : {
           "alpha" : "1.000",
           "blue" : "0xD9",
diff --git a/apple/OmnivoreKit/Sources/Views/Colors/ThemeColors.xcassets/_themeFeatureBackground.colorset/Contents.json b/apple/OmnivoreKit/Sources/Views/Colors/ThemeColors.xcassets/_themeFeatureBackground.colorset/Contents.json
@@ -0,0 +1,38 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0xFF",
+          "green" : "0xFF",
+          "red" : "0xFE"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0x1C",
+          "green" : "0x1C",
+          "red" : "0x1C"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}
diff --git a/apple/OmnivoreKit/Sources/Views/Colors/ThemeColors.xcassets/_themeLibraryItemSubtle.colorset/Contents.json b/apple/OmnivoreKit/Sources/Views/Colors/ThemeColors.xcassets/_themeLibraryItemSubtle.colorset/Contents.json
@@ -0,0 +1,38 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0x3C",
+          "green" : "0x3C",
+          "red" : "0x3C"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "1.000",
+          "blue" : "0xD9",
+          "green" : "0xD9",
+          "red" : "0xD9"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}
diff --git a/apple/OmnivoreKit/Sources/Views/FeedItem/LibraryItemCard.swift b/apple/OmnivoreKit/Sources/Views/FeedItem/LibraryItemCard.swift
@@ -215,25 +215,24 @@ public struct LibraryItemCard: View {
         $0.icon
       }
 
-      let fgcolor = Color.isDarkMode ? Color.themeDarkWhiteGray : Color.themeMiddleGray
       Text("\(estimatedReadingTime)")
         .font(.caption2).fontWeight(.medium)
-        .foregroundColor(fgcolor)
+        .foregroundColor(Color.themeLibraryItemSubtle)
 
         +
         Text("\(readingProgress)")
         .font(.caption2).fontWeight(.medium)
-        .foregroundColor(isPartiallyRead ? Color.appGreenSuccess : fgcolor)
+        .foregroundColor(isPartiallyRead ? Color.appGreenSuccess : Color.themeLibraryItemSubtle)
 
         +
         Text("\(highlightsText)")
         .font(.caption2).fontWeight(.medium)
-        .foregroundColor(fgcolor)
+        .foregroundColor(Color.themeLibraryItemSubtle)
 
         +
         Text("\(notesText)")
         .font(.caption2).fontWeight(.medium)
-        .foregroundColor(fgcolor)
+        .foregroundColor(Color.themeLibraryItemSubtle)
     }
     .frame(maxWidth: .infinity, alignment: .leading)
   }
@@ -293,7 +292,7 @@ public struct LibraryItemCard: View {
   var byLine: some View {
     Text(bylineStr)
       .font(.caption2)
-      .foregroundColor(Color.isDarkMode ? Color.themeDarkWhiteGray : Color.themeMiddleGray)
+      .foregroundColor(Color.themeLibraryItemSubtle)
       .frame(maxWidth: .infinity, alignment: .leading)
       .lineLimit(1)
   }

Original file line number	Diff line number	Diff line change
`@@ -482,7 +482,7 @@ struct AnimatingCellHeight: AnimatableModifier {`
`482`	`482`	`}`
`483`	`483`	`}`
`484`	`484`	`}`
`485`		`- .background(Color.isDarkMode ? Color(hex: "#1C1C1C") : Color.systemBackground)`
	`485`	`+ .background(Color.themeFeatureBackground)`
`486`	`486`	`.frame(height: 190)`
`487`	`487`
`488`	`488`	`if !Color.isDarkMode {`
`@@ -567,7 +567,7 @@ struct AnimatingCellHeight: AnimatableModifier {`
`567`	`567`	`featureCard`
`568`	`568`	`.listRowInsets(.init(top: 0, leading: 0, bottom: 0, trailing: 0))`
`569`	`569`	`.listRowSeparator(.hidden, edges: .all)`
`570`		`- .modifier(AnimatingCellHeight(height: 190 + (Color.isDarkMode ? 13 : 13)))`
	`570`	`+ .modifier(AnimatingCellHeight(height: 190 + 13))`
`571`	`571`	`.onDisappear {`
`572`	`572`	`withAnimation {`
`573`	`573`	`isListScrolled = true`
Original file line number	Diff line number	Diff line change
`@@ -2,7 +2,7 @@`
`2`	`2`	`"colors" : [`
`3`	`3`	`{`
`4`	`4`	`"color" : {`
`5`		`- "color-space" : "srgb",`
	`5`	`+ "color-space" : "display-p3",`
`6`	`6`	`"components" : {`
`7`	`7`	`"alpha" : "1.000",`
`8`	`8`	`"blue" : "0xD9",`
Original file line number	Diff line number	Diff line change
`@@ -215,25 +215,24 @@ public struct LibraryItemCard: View {`
`215`	`215`	`$0.icon`
`216`	`216`	`}`
`217`	`217`
`218`		`- let fgcolor = Color.isDarkMode ? Color.themeDarkWhiteGray : Color.themeMiddleGray`
`219`	`218`	`Text("\(estimatedReadingTime)")`
`220`	`219`	`.font(.caption2).fontWeight(.medium)`
`221`		`- .foregroundColor(fgcolor)`
	`220`	`+ .foregroundColor(Color.themeLibraryItemSubtle)`
`222`	`221`
`223`	`222`	`+`
`224`	`223`	`Text("\(readingProgress)")`
`225`	`224`	`.font(.caption2).fontWeight(.medium)`
`226`		`- .foregroundColor(isPartiallyRead ? Color.appGreenSuccess : fgcolor)`
	`225`	`+ .foregroundColor(isPartiallyRead ? Color.appGreenSuccess : Color.themeLibraryItemSubtle)`
`227`	`226`
`228`	`227`	`+`
`229`	`228`	`Text("\(highlightsText)")`
`230`	`229`	`.font(.caption2).fontWeight(.medium)`
`231`		`- .foregroundColor(fgcolor)`
	`230`	`+ .foregroundColor(Color.themeLibraryItemSubtle)`
`232`	`231`
`233`	`232`	`+`
`234`	`233`	`Text("\(notesText)")`
`235`	`234`	`.font(.caption2).fontWeight(.medium)`
`236`		`- .foregroundColor(fgcolor)`
	`235`	`+ .foregroundColor(Color.themeLibraryItemSubtle)`
`237`	`236`	`}`
`238`	`237`	`.frame(maxWidth: .infinity, alignment: .leading)`
`239`	`238`	`}`
`@@ -293,7 +292,7 @@ public struct LibraryItemCard: View {`
`293`	`292`	`var byLine: some View {`
`294`	`293`	`Text(bylineStr)`
`295`	`294`	`.font(.caption2)`
`296`		`- .foregroundColor(Color.isDarkMode ? Color.themeDarkWhiteGray : Color.themeMiddleGray)`
	`295`	`+ .foregroundColor(Color.themeLibraryItemSubtle)`
`297`	`296`	`.frame(maxWidth: .infinity, alignment: .leading)`
`298`	`297`	`.lineLimit(1)`
`299`	`298`	`}`