-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[MBL-1458 pt 1] Add alert flag for PPO (#2120)
* Add alert flag for PPO * Add shared style file for PPO cards * Move project details to PPO card styles * Move project creator to PPO card styles * Fix formatting * More discussion on architecture
- Loading branch information
1 parent
5016b15
commit 38a8907
Showing
9 changed files
with
195 additions
and
21 deletions.
There are no files selected for viewing
12 changes: 12 additions & 0 deletions
12
Kickstarter-iOS/Assets.xcassets/icons/icon-limited-time.imageset/Contents.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
{ | ||
"images" : [ | ||
{ | ||
"filename" : "clock.pdf", | ||
"idiom" : "universal" | ||
} | ||
], | ||
"info" : { | ||
"author" : "xcode", | ||
"version" : 1 | ||
} | ||
} |
Binary file added
BIN
+1.04 KB
Kickstarter-iOS/Assets.xcassets/icons/icon-limited-time.imageset/clock.pdf
Binary file not shown.
12 changes: 12 additions & 0 deletions
12
Kickstarter-iOS/Assets.xcassets/icons/icon-notice.imageset/Contents.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
{ | ||
"images" : [ | ||
{ | ||
"filename" : "Icon.pdf", | ||
"idiom" : "universal" | ||
} | ||
], | ||
"info" : { | ||
"author" : "xcode", | ||
"version" : 1 | ||
} | ||
} |
Binary file not shown.
110 changes: 110 additions & 0 deletions
110
Kickstarter-iOS/Features/PledgedProjectsOverview/CardView/PPOAlertFlag.swift
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,110 @@ | ||
import Library | ||
import SwiftUI | ||
|
||
struct PPOAlertFlag: View { | ||
let alert: Alert | ||
|
||
var body: some View { | ||
HStack { | ||
self.image | ||
.renderingMode(.template) | ||
.aspectRatio(contentMode: .fit) | ||
.foregroundStyle(self.foregroundColor) | ||
.frame(width: Constants.imageSize, height: Constants.imageSize) | ||
Spacer() | ||
.frame(width: Constants.spacerWidth) | ||
Text(self.alert.message) | ||
.font(Font(PPOCardStyles.title.font)) | ||
.foregroundStyle(self.foregroundColor) | ||
} | ||
.padding(Constants.padding) | ||
.background(self.backgroundColor) | ||
.clipShape(RoundedRectangle(cornerSize: CGSize( | ||
width: Constants.cornerRadius, | ||
height: Constants.cornerRadius | ||
))) | ||
} | ||
|
||
var image: Image { | ||
switch self.alert.type { | ||
case .time: | ||
Image(PPOCardStyles.timeImage) | ||
case .alert: | ||
Image(PPOCardStyles.alertImage) | ||
} | ||
} | ||
|
||
var foregroundColor: Color { | ||
switch self.alert.icon { | ||
case .warning: | ||
Color(uiColor: PPOCardStyles.warningColor.foreground) | ||
case .alert: | ||
Color(uiColor: PPOCardStyles.alertColor.foreground) | ||
} | ||
} | ||
|
||
var backgroundColor: Color { | ||
switch self.alert.icon { | ||
case .warning: | ||
Color(uiColor: PPOCardStyles.warningColor.background) | ||
case .alert: | ||
Color(uiColor: PPOCardStyles.alertColor.background) | ||
} | ||
} | ||
|
||
struct Alert: Identifiable { | ||
let type: AlertType | ||
let icon: AlertIcon | ||
let message: String | ||
|
||
var id: String { | ||
"\(self.type)-\(self.icon)-\(self.message)" | ||
} | ||
|
||
enum AlertType: Identifiable { | ||
case time | ||
case alert | ||
|
||
var id: String { | ||
switch self { | ||
case .time: | ||
"time" | ||
case .alert: | ||
"alert" | ||
} | ||
} | ||
} | ||
|
||
enum AlertIcon: Identifiable { | ||
case warning | ||
case alert | ||
|
||
var id: String { | ||
switch self { | ||
case .warning: | ||
"warning" | ||
case .alert: | ||
"alert" | ||
} | ||
} | ||
} | ||
} | ||
|
||
private enum Constants { | ||
static let imageSize: CGFloat = 18 | ||
static let spacerWidth: CGFloat = 4 | ||
static let cornerRadius: CGFloat = 6 | ||
static let font = UIFont.ksr_caption1().bolded | ||
static let padding = EdgeInsets(top: 4, leading: 12, bottom: 4, trailing: 8) | ||
} | ||
} | ||
|
||
#Preview("Stack of flags") { | ||
VStack(alignment: .leading, spacing: 8) { | ||
PPOAlertFlag(alert: .init(type: .time, icon: .warning, message: "Address locks in 8 hours")) | ||
PPOAlertFlag(alert: .init(type: .alert, icon: .warning, message: "Survey available")) | ||
PPOAlertFlag(alert: .init(type: .alert, icon: .alert, message: "Payment failed")) | ||
PPOAlertFlag(alert: .init(type: .time, icon: .alert, message: "Pledge will be dropped in 6 days")) | ||
PPOAlertFlag(alert: .init(type: .alert, icon: .alert, message: "Card needs authentication")) | ||
} | ||
} |
28 changes: 28 additions & 0 deletions
28
Kickstarter-iOS/Features/PledgedProjectsOverview/CardView/PPOCardStyles.swift
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
import Foundation | ||
import Library | ||
import SwiftUI | ||
|
||
enum PPOCardStyles { | ||
static let warningColor = ( | ||
foreground: UIColor.ksr_support_400, | ||
background: UIColor.ksr_celebrate_100 | ||
) | ||
|
||
static let alertColor = ( | ||
foreground: UIColor.hex(0x73140D), | ||
background: UIColor.hex(0xFEF2F1) | ||
) | ||
|
||
static let title = ( | ||
font: UIFont.ksr_caption1().bolded, | ||
color: UIColor.ksr_black | ||
) | ||
|
||
static let subtitle = ( | ||
font: UIFont.ksr_footnote(), | ||
color: UIColor.ksr_support_400 | ||
) | ||
|
||
static let timeImage = ImageResource.iconLimitedTime | ||
static let alertImage = ImageResource.iconNotice | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters