Merge pull request #69 from zcash/empty-chip
Empty chip First Iteration
This commit is contained in:
Francisco Gindre
GitHub
commit
89f4699dec
|
|
@ -8,6 +8,8 @@
|
|||
|
||||
/* Begin PBXBuildFile section */
|
||||
0D170A7226BC802800EB6A46 /* Router.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0D170A7126BC802800EB6A46 /* Router.swift */; };
|
||||
0D185819272723FF0046B928 /* BlueChip.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0D185818272723FF0046B928 /* BlueChip.swift */; };
|
||||
0D18581B272728D60046B928 /* PhraseChip.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0D18581A272728D60046B928 /* PhraseChip.swift */; };
|
||||
0D1922EA26BDD96A00052649 /* ViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0D1922E926BDD96A00052649 /* ViewModel.swift */; };
|
||||
0D1922ED26BDE0C600052649 /* AppRouter.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0D1922EC26BDE0C600052649 /* AppRouter.swift */; };
|
||||
0D1922F226BDE29300052649 /* ZcashSDKStubs.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0D1922F126BDE29300052649 /* ZcashSDKStubs.swift */; };
|
||||
|
|
@ -68,6 +70,8 @@
|
|||
0DACFA9A27209FA70039EEA5 /* Roboto-Light.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 0DACFA8D27209FA70039EEA5 /* Roboto-Light.ttf */; };
|
||||
0DACFA9C27209FA70039EEA5 /* Roboto-ThinItalic.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 0DACFA8F27209FA70039EEA5 /* Roboto-ThinItalic.ttf */; };
|
||||
0DB8AA81271DC7520035BC9D /* DesignGuide.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0DB8AA80271DC7520035BC9D /* DesignGuide.swift */; };
|
||||
0DF2DC51272344E400FA31E2 /* EmptyChip.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0DF2DC50272344E400FA31E2 /* EmptyChip.swift */; };
|
||||
0DF2DC5427235E3E00FA31E2 /* View+InnerShadow.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0DF2DC5327235E3E00FA31E2 /* View+InnerShadow.swift */; };
|
||||
660558E9270C7A54009D6954 /* Colors.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 660558E8270C7A54009D6954 /* Colors.xcassets */; };
|
||||
660558F7270C862F009D6954 /* Fonts+Generated.swift in Sources */ = {isa = PBXBuildFile; fileRef = 660558F5270C862F009D6954 /* Fonts+Generated.swift */; };
|
||||
660558F8270C862F009D6954 /* XCAssets+Generated.swift in Sources */ = {isa = PBXBuildFile; fileRef = 660558F6270C862F009D6954 /* XCAssets+Generated.swift */; };
|
||||
|
|
@ -103,6 +107,8 @@
|
|||
|
||||
/* Begin PBXFileReference section */
|
||||
0D170A7126BC802800EB6A46 /* Router.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Router.swift; sourceTree = "<group>"; };
|
||||
0D185818272723FF0046B928 /* BlueChip.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = BlueChip.swift; sourceTree = "<group>"; };
|
||||
0D18581A272728D60046B928 /* PhraseChip.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PhraseChip.swift; sourceTree = "<group>"; };
|
||||
0D1922E926BDD96A00052649 /* ViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ViewModel.swift; sourceTree = "<group>"; };
|
||||
0D1922EC26BDE0C600052649 /* AppRouter.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppRouter.swift; sourceTree = "<group>"; };
|
||||
0D1922F126BDE29300052649 /* ZcashSDKStubs.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ZcashSDKStubs.swift; sourceTree = "<group>"; };
|
||||
|
|
@ -169,6 +175,8 @@
|
|||
0DACFA8D27209FA70039EEA5 /* Roboto-Light.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = "Roboto-Light.ttf"; sourceTree = "<group>"; };
|
||||
0DACFA8F27209FA70039EEA5 /* Roboto-ThinItalic.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; path = "Roboto-ThinItalic.ttf"; sourceTree = "<group>"; };
|
||||
0DB8AA80271DC7520035BC9D /* DesignGuide.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DesignGuide.swift; sourceTree = "<group>"; };
|
||||
0DF2DC50272344E400FA31E2 /* EmptyChip.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = EmptyChip.swift; sourceTree = "<group>"; };
|
||||
0DF2DC5327235E3E00FA31E2 /* View+InnerShadow.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "View+InnerShadow.swift"; sourceTree = "<group>"; };
|
||||
660558E8270C7A54009D6954 /* Colors.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Colors.xcassets; sourceTree = "<group>"; };
|
||||
660558F5270C862F009D6954 /* Fonts+Generated.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = "Fonts+Generated.swift"; sourceTree = "<group>"; };
|
||||
660558F6270C862F009D6954 /* XCAssets+Generated.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = "XCAssets+Generated.swift"; sourceTree = "<group>"; };
|
||||
|
|
@ -415,6 +423,9 @@
|
|||
isa = PBXGroup;
|
||||
children = (
|
||||
0D535FE1271F9476009A9E3E /* EnumeratedChip.swift */,
|
||||
0DF2DC50272344E400FA31E2 /* EmptyChip.swift */,
|
||||
0D185818272723FF0046B928 /* BlueChip.swift */,
|
||||
0D18581A272728D60046B928 /* PhraseChip.swift */,
|
||||
);
|
||||
path = Chips;
|
||||
sourceTree = "<group>";
|
||||
|
|
@ -457,6 +468,7 @@
|
|||
0DA13C9126C15E1900E3B610 /* UI Components */ = {
|
||||
isa = PBXGroup;
|
||||
children = (
|
||||
0DF2DC5227235E1F00FA31E2 /* Extensions */,
|
||||
0D535FE0271F945C009A9E3E /* Chips */,
|
||||
663FAB9A271D873300E495F8 /* Buttons */,
|
||||
66A0807A271993C500118B79 /* OnboardingProgressIndicator.swift */,
|
||||
|
|
@ -529,6 +541,14 @@
|
|||
path = Roboto;
|
||||
sourceTree = "<group>";
|
||||
};
|
||||
0DF2DC5227235E1F00FA31E2 /* Extensions */ = {
|
||||
isa = PBXGroup;
|
||||
children = (
|
||||
0DF2DC5327235E3E00FA31E2 /* View+InnerShadow.swift */,
|
||||
);
|
||||
path = Extensions;
|
||||
sourceTree = "<group>";
|
||||
};
|
||||
660558F4270C85F7009D6954 /* Generated */ = {
|
||||
isa = PBXGroup;
|
||||
children = (
|
||||
|
|
@ -799,6 +819,7 @@
|
|||
0DA13C9826C186FF00E3B610 /* RestoreWalletScreenViewModel.swift in Sources */,
|
||||
0D32283326C5877A00262533 /* BalanceScreenViewModel.swift in Sources */,
|
||||
0D5D16F526E24CCF00AD33D1 /* AppError.swift in Sources */,
|
||||
0D18581B272728D60046B928 /* PhraseChip.swift in Sources */,
|
||||
0DB8AA81271DC7520035BC9D /* DesignGuide.swift in Sources */,
|
||||
0D32282326C586A800262533 /* HistoryScreen.swift in Sources */,
|
||||
0D864A0A26E154FD00A61879 /* InitFailedScreenViewModel.swift in Sources */,
|
||||
|
|
@ -811,13 +832,16 @@
|
|||
660558F7270C862F009D6954 /* Fonts+Generated.swift in Sources */,
|
||||
0DA13C9726C186FF00E3B610 /* RestoreWalletScreen.swift in Sources */,
|
||||
0DACFA8127208D940039EEA5 /* UInt+SuperscriptText.swift in Sources */,
|
||||
0DF2DC51272344E400FA31E2 /* EmptyChip.swift in Sources */,
|
||||
0D1922EA26BDD96A00052649 /* ViewModel.swift in Sources */,
|
||||
0D4E7A0926B364170058B01E /* SecantApp.swift in Sources */,
|
||||
66DC733F271D88CC0053CBB6 /* StandardButtonStyle.swift in Sources */,
|
||||
0D864A0926E154FD00A61879 /* InitFailedScreen.swift in Sources */,
|
||||
663FABA0271D876200E495F8 /* PrimaryButton.swift in Sources */,
|
||||
663FAB9C271D874D00E495F8 /* ActiveButton.swift in Sources */,
|
||||
0DF2DC5427235E3E00FA31E2 /* View+InnerShadow.swift in Sources */,
|
||||
0D32281A26C5864B00262533 /* ProfileScreenViewModel.swift in Sources */,
|
||||
0D185819272723FF0046B928 /* BlueChip.swift in Sources */,
|
||||
0D864A0F26E1583000A61879 /* LoadingScreenViewModel.swift in Sources */,
|
||||
0DA13CA126C1955600E3B610 /* HomeScreen.swift in Sources */,
|
||||
0DA13C9026C15D1D00E3B610 /* WelcomeScreenViewModel.swift in Sources */,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"info" : {
|
||||
"author" : "xcode",
|
||||
"version" : 1
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
{
|
||||
"colors" : [
|
||||
{
|
||||
"color" : {
|
||||
"color-space" : "srgb",
|
||||
"components" : {
|
||||
"alpha" : "1.000",
|
||||
"blue" : "0xE3",
|
||||
"green" : "0xD4",
|
||||
"red" : "0xC3"
|
||||
}
|
||||
},
|
||||
"idiom" : "universal"
|
||||
},
|
||||
{
|
||||
"appearances" : [
|
||||
{
|
||||
"appearance" : "luminosity",
|
||||
"value" : "dark"
|
||||
}
|
||||
],
|
||||
"color" : {
|
||||
"color-space" : "srgb",
|
||||
"components" : {
|
||||
"alpha" : "1.000",
|
||||
"blue" : "1.000",
|
||||
"green" : "1.000",
|
||||
"red" : "1.000"
|
||||
}
|
||||
},
|
||||
"idiom" : "universal"
|
||||
}
|
||||
],
|
||||
"info" : {
|
||||
"author" : "xcode",
|
||||
"version" : 1
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"info" : {
|
||||
"author" : "xcode",
|
||||
"version" : 1
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
{
|
||||
"colors" : [
|
||||
{
|
||||
"color" : {
|
||||
"color-space" : "srgb",
|
||||
"components" : {
|
||||
"alpha" : "1.000",
|
||||
"blue" : "0xD6",
|
||||
"green" : "0xC5",
|
||||
"red" : "0xB6"
|
||||
}
|
||||
},
|
||||
"idiom" : "universal"
|
||||
},
|
||||
{
|
||||
"appearances" : [
|
||||
{
|
||||
"appearance" : "luminosity",
|
||||
"value" : "dark"
|
||||
}
|
||||
],
|
||||
"color" : {
|
||||
"color-space" : "srgb",
|
||||
"components" : {
|
||||
"alpha" : "1.000",
|
||||
"blue" : "0xE6",
|
||||
"green" : "0xE5",
|
||||
"red" : "0xE0"
|
||||
}
|
||||
},
|
||||
"idiom" : "universal"
|
||||
}
|
||||
],
|
||||
"info" : {
|
||||
"author" : "xcode",
|
||||
"version" : 1
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
{
|
||||
"colors" : [
|
||||
{
|
||||
"color" : {
|
||||
"color-space" : "srgb",
|
||||
"components" : {
|
||||
"alpha" : "0.200",
|
||||
"blue" : "0x36",
|
||||
"green" : "0x2C",
|
||||
"red" : "0x27"
|
||||
}
|
||||
},
|
||||
"idiom" : "universal"
|
||||
},
|
||||
{
|
||||
"appearances" : [
|
||||
{
|
||||
"appearance" : "luminosity",
|
||||
"value" : "dark"
|
||||
}
|
||||
],
|
||||
"idiom" : "universal"
|
||||
}
|
||||
],
|
||||
"info" : {
|
||||
"author" : "xcode",
|
||||
"version" : 1
|
||||
}
|
||||
}
|
||||
|
|
@ -30,6 +30,9 @@ internal enum Asset {
|
|||
}
|
||||
}
|
||||
internal enum Colors {
|
||||
internal enum BackgroundColors {
|
||||
internal static let phraseGridDarkGray = ColorAsset(name: "phraseGridDarkGray")
|
||||
}
|
||||
internal enum Buttons {
|
||||
internal static let activeButton = ColorAsset(name: "ActiveButton")
|
||||
internal static let createButton = ColorAsset(name: "CreateButton")
|
||||
|
|
@ -57,6 +60,10 @@ internal enum Asset {
|
|||
internal static let gradientEnd = ColorAsset(name: "gradientEnd")
|
||||
internal static let gradientStart = ColorAsset(name: "gradientStart")
|
||||
}
|
||||
internal enum Shadow {
|
||||
internal static let emptyChipInnerShadow = ColorAsset(name: "emptyChipInnerShadow")
|
||||
internal static let numberedTextShadow = ColorAsset(name: "numberedTextShadow")
|
||||
}
|
||||
internal enum Text {
|
||||
internal static let activeButtonText = ColorAsset(name: "ActiveButtonText")
|
||||
internal static let button = ColorAsset(name: "Button")
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ enum AppRouterScreen {
|
|||
case createRestoreWallet
|
||||
case home
|
||||
case loadingFailed
|
||||
case designGuide
|
||||
}
|
||||
|
||||
class AppRouter: Router {
|
||||
|
|
@ -29,6 +30,9 @@ class AppRouter: Router {
|
|||
NavigationView {
|
||||
AppRouterView(router: self)
|
||||
}
|
||||
.onTapGesture(count: 10) {
|
||||
self.screen = .designGuide
|
||||
}
|
||||
}
|
||||
|
||||
@ViewBuilder func createNew() -> some View {
|
||||
|
|
@ -49,6 +53,10 @@ class AppRouter: Router {
|
|||
@ViewBuilder func loadingFailedScreen() -> some View {
|
||||
Text("loading failed")
|
||||
}
|
||||
|
||||
@ViewBuilder func designGuide() -> some View {
|
||||
DesignGuide()
|
||||
}
|
||||
}
|
||||
|
||||
struct AppRouterView: View {
|
||||
|
|
@ -56,6 +64,7 @@ struct AppRouterView: View {
|
|||
|
||||
var body: some View {
|
||||
viewForScreen(router.screen)
|
||||
.applyScreenBackground()
|
||||
}
|
||||
|
||||
@ViewBuilder func viewForScreen(_ screen: AppRouterScreen) -> some View {
|
||||
|
|
@ -64,6 +73,7 @@ struct AppRouterView: View {
|
|||
case .createRestoreWallet: router.createNew()
|
||||
case .home: router.home()
|
||||
case .loadingFailed: router.loadingFailedScreen()
|
||||
case .designGuide: router.designGuide()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,34 @@
|
|||
//
|
||||
// BlueChip.swift
|
||||
// secant-testnet
|
||||
//
|
||||
// Created by Francisco Gindre on 10/25/21.
|
||||
//
|
||||
|
||||
import SwiftUI
|
||||
|
||||
struct BlueChip: View {
|
||||
var word: String
|
||||
var body: some View {
|
||||
Text(word)
|
||||
.font(FontFamily.Rubik.regular.textStyle(.body))
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: 120,
|
||||
minHeight: 30,
|
||||
idealHeight: 40
|
||||
)
|
||||
.foregroundColor(Asset.Colors.Text.activeButtonText.color)
|
||||
.padding(.horizontal, 4)
|
||||
.padding(.vertical, 4)
|
||||
.background(Asset.Colors.Buttons.activeButton.color)
|
||||
.cornerRadius(6)
|
||||
}
|
||||
}
|
||||
|
||||
struct BlueChip_Previews: PreviewProvider {
|
||||
static var previews: some View {
|
||||
BlueChip(word: "negative")
|
||||
.applyScreenBackground()
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,60 @@
|
|||
//
|
||||
// EmptyChip.swift
|
||||
// secant-testnet
|
||||
//
|
||||
// Created by Francisco Gindre on 10/22/21.
|
||||
//
|
||||
|
||||
import SwiftUI
|
||||
|
||||
struct EmptyChip: View {
|
||||
var body: some View {
|
||||
RoundedRectangle(cornerRadius: 6, style: RoundedCornerStyle.continuous)
|
||||
.stroke(Asset.Colors.Text.activeButtonText.color, lineWidth: 0.5)
|
||||
.shadow(
|
||||
color: Asset.Colors.Text.activeButtonText.color,
|
||||
radius: -0.5,
|
||||
x: -0.1,
|
||||
y: -0.1
|
||||
)
|
||||
.innerShadow(
|
||||
using: RoundedRectangle(cornerRadius: 6, style: RoundedCornerStyle.continuous),
|
||||
angle: .degrees(180),
|
||||
color: Asset.Colors.Shadow.emptyChipInnerShadow.color,
|
||||
width: 4,
|
||||
blur: 2
|
||||
)
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: .infinity,
|
||||
minHeight: 40,
|
||||
idealHeight: 40,
|
||||
maxHeight: .infinity,
|
||||
alignment: .leading
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
struct EmptyChip_Previews: PreviewProvider {
|
||||
static var previews: some View {
|
||||
Group {
|
||||
ZStack {
|
||||
Asset.Colors.BackgroundColors.phraseGridDarkGray.color
|
||||
EmptyChip()
|
||||
.frame(width: 100, height: 40, alignment: .leading)
|
||||
}
|
||||
}
|
||||
.previewLayout(.fixed(width: 200, height: 100))
|
||||
.preferredColorScheme(.light)
|
||||
|
||||
Group {
|
||||
ZStack {
|
||||
ScreenBackground()
|
||||
EmptyChip()
|
||||
.frame(width: 100, height: 40, alignment: .leading)
|
||||
}
|
||||
}
|
||||
.previewLayout(.fixed(width: 200, height: 100))
|
||||
.preferredColorScheme(.dark)
|
||||
}
|
||||
}
|
||||
|
|
@ -15,20 +15,18 @@ struct EnumeratedChip: View {
|
|||
|
||||
var body: some View {
|
||||
NumberedText(number: index, text: text)
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: .infinity,
|
||||
minHeight: 30,
|
||||
idealHeight: 40,
|
||||
maxHeight: .infinity,
|
||||
alignment: .leading
|
||||
)
|
||||
.padding(.horizontal, 16)
|
||||
.padding(.vertical, 8)
|
||||
.background(
|
||||
Asset.Colors.Buttons.primaryButtonPressed.color
|
||||
)
|
||||
.cornerRadius(6)
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: .infinity,
|
||||
minHeight: 30,
|
||||
idealHeight: 40,
|
||||
maxHeight: .infinity,
|
||||
alignment: .leading
|
||||
)
|
||||
.padding(.horizontal, 16)
|
||||
.padding(.vertical, 4)
|
||||
.background(Asset.Colors.Buttons.primaryButtonPressed.color)
|
||||
.cornerRadius(6)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -38,29 +36,21 @@ struct NumberedText: View {
|
|||
|
||||
@ViewBuilder var numberedText: some View {
|
||||
Text(number.superscriptRepresentation)
|
||||
.foregroundColor(
|
||||
Asset.Colors.Text.highlightedSuperscriptText.color
|
||||
)
|
||||
.font(
|
||||
.custom(
|
||||
FontFamily.Roboto.black.name,
|
||||
size: 24
|
||||
)
|
||||
) +
|
||||
.foregroundColor(Asset.Colors.Text.highlightedSuperscriptText.color)
|
||||
.font(.custom(FontFamily.Roboto.bold.name, size: 20)) +
|
||||
Text(" \(text)")
|
||||
.foregroundColor(
|
||||
Asset.Colors.Text.button.color
|
||||
)
|
||||
.font(
|
||||
.custom(
|
||||
FontFamily.Rubik.regular.name,
|
||||
size: 15
|
||||
)
|
||||
)
|
||||
.foregroundColor(Asset.Colors.Text.button.color)
|
||||
.font(.custom(FontFamily.Rubik.medium.name, size: 16))
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
numberedText
|
||||
.shadow(
|
||||
color: Asset.Colors.Shadow.numberedTextShadow.color,
|
||||
radius: 1,
|
||||
x: 0,
|
||||
y: 1
|
||||
)
|
||||
.layoutPriority(1)
|
||||
.fixedSize(horizontal: false, vertical: false)
|
||||
}
|
||||
|
|
@ -76,9 +66,9 @@ struct EnumeratedChip_Previews: PreviewProvider {
|
|||
count: 3
|
||||
)
|
||||
|
||||
static var words = [
|
||||
private static var words = [
|
||||
"pyramid", "negative", "page",
|
||||
"crown", "secret", "zebra"
|
||||
"crown", "", "zebra"
|
||||
]
|
||||
|
||||
@ViewBuilder static var grid: some View {
|
||||
|
|
@ -88,44 +78,70 @@ struct EnumeratedChip_Previews: PreviewProvider {
|
|||
spacing: 15
|
||||
) {
|
||||
ForEach(Array(zip(words.indices, words)), id: \.1) { i, word in
|
||||
EnumeratedChip(index: (i + 1), text: word)
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: .infinity,
|
||||
minHeight: 30,
|
||||
idealHeight: 40
|
||||
)
|
||||
if word.isEmpty {
|
||||
EmptyChip()
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: .infinity,
|
||||
minHeight: 30,
|
||||
idealHeight: 40
|
||||
)
|
||||
} else {
|
||||
EnumeratedChip(index: (i + 1), text: word)
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: .infinity,
|
||||
minHeight: 30,
|
||||
idealHeight: 40
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
.padding()
|
||||
.applyScreenBackground()
|
||||
}
|
||||
|
||||
static var previews: some View {
|
||||
grid
|
||||
.background(Asset.Colors.BackgroundColors.phraseGridDarkGray.color)
|
||||
.previewLayout(.fixed(width: 428, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.previewLayout(.fixed(width: 428, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.previewLayout(.fixed(width: 428, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.preferredColorScheme(.dark)
|
||||
.previewLayout(.fixed(width: 428, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.previewLayout(.fixed(width: 390, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.preferredColorScheme(.dark)
|
||||
.previewLayout(.fixed(width: 390, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.previewLayout(.fixed(width: 375, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.preferredColorScheme(.dark)
|
||||
.previewLayout(.fixed(width: 375, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.previewLayout(.fixed(width: 320, height: 200))
|
||||
|
||||
grid
|
||||
.applyScreenBackground()
|
||||
.preferredColorScheme(.dark)
|
||||
.previewLayout(.fixed(width: 320, height: 200))
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,58 @@
|
|||
//
|
||||
// PhraseChip.swift
|
||||
// secant-testnet
|
||||
//
|
||||
// Created by Francisco Gindre on 10/25/21.
|
||||
//
|
||||
|
||||
import SwiftUI
|
||||
|
||||
struct PhraseChip: View {
|
||||
enum Kind {
|
||||
case empty
|
||||
case unassigned(word: String)
|
||||
case ordered(position: Int, word: String)
|
||||
}
|
||||
|
||||
var kind: Kind
|
||||
|
||||
var body: some View {
|
||||
chipFor(for: kind)
|
||||
.frame(
|
||||
minWidth: 0,
|
||||
maxWidth: 120,
|
||||
minHeight: 30,
|
||||
idealHeight: 40
|
||||
)
|
||||
.animation(.easeIn)
|
||||
}
|
||||
|
||||
@ViewBuilder func chipFor(for kind: Kind) -> some View {
|
||||
switch kind {
|
||||
case .empty:
|
||||
EmptyChip()
|
||||
|
||||
case let .ordered(position, word):
|
||||
EnumeratedChip(index: position, text: word)
|
||||
|
||||
case .unassigned(let word):
|
||||
BlueChip(word: word)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
struct PhraseChip_Previews: PreviewProvider {
|
||||
static var previews: some View {
|
||||
VStack {
|
||||
PhraseChip(kind: .unassigned(word: "negative"))
|
||||
.frame(height: 40)
|
||||
|
||||
PhraseChip(kind: .empty)
|
||||
.frame(height: 40)
|
||||
|
||||
PhraseChip(kind: .ordered(position: 23, word: "mutual"))
|
||||
.frame(height: 40)
|
||||
}
|
||||
.applyScreenBackground()
|
||||
}
|
||||
}
|
||||
|
|
@ -8,12 +8,18 @@
|
|||
import SwiftUI
|
||||
|
||||
struct DesignGuide: View {
|
||||
let columns = [GridItem(.adaptive(minimum: 320, maximum: .infinity))]
|
||||
|
||||
var body: some View {
|
||||
HStack {
|
||||
TextAndPlaceholdersGuide()
|
||||
SmallVisualElements()
|
||||
ButtonGuide()
|
||||
ScrollView {
|
||||
LazyVGrid(columns: columns) {
|
||||
TextAndPlaceholdersGuide()
|
||||
SmallVisualElements()
|
||||
ButtonGuide()
|
||||
}
|
||||
}
|
||||
.padding(30)
|
||||
.navigationBarHidden(true)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -44,6 +50,7 @@ struct TextAndPlaceholdersGuide: View {
|
|||
|
||||
struct SmallVisualElements: View {
|
||||
let gridItems = [GridItem(.flexible(minimum: 40, maximum: 100)), GridItem(.flexible(minimum: 40, maximum: 100))]
|
||||
|
||||
var body: some View {
|
||||
VStack {
|
||||
Text("Navigation Buttons")
|
||||
|
|
@ -69,6 +76,8 @@ struct SmallVisualElements: View {
|
|||
.font(.caption)
|
||||
EnumeratedChip(index: 1, text: "Salami")
|
||||
.frame(width: 100, height: 40)
|
||||
EmptyChip()
|
||||
.frame(width: 100, height: 40)
|
||||
Text("shield icon")
|
||||
.frame(width: 76, height: 76)
|
||||
Text("profile icon")
|
||||
|
|
@ -81,6 +90,7 @@ struct SmallVisualElements: View {
|
|||
|
||||
struct ButtonGuide: View {
|
||||
let buttonHeight: CGFloat = 60
|
||||
|
||||
var body: some View {
|
||||
VStack(spacing: 30) {
|
||||
// Idle Primary Button
|
||||
|
|
@ -143,16 +153,15 @@ struct ButtonGuide: View {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
struct DesignGuide_Previews: PreviewProvider {
|
||||
static var previews: some View {
|
||||
DesignGuide()
|
||||
.padding(30)
|
||||
.applyScreenBackground()
|
||||
.preferredColorScheme(.dark)
|
||||
.previewLayout(.fixed(width: 1086, height: 1080))
|
||||
.previewLayout(.fixed(width: 420, height: 1080))
|
||||
|
||||
DesignGuide()
|
||||
.padding(30)
|
||||
.applyScreenBackground()
|
||||
.preferredColorScheme(.light)
|
||||
.previewLayout(.fixed(width: 1086, height: 1080))
|
||||
|
|
|
|||
|
|
@ -0,0 +1,33 @@
|
|||
//
|
||||
// View+InnerShadow.swift
|
||||
// secant-testnet
|
||||
//
|
||||
// Created by Francisco Gindre on 10/22/21.
|
||||
//
|
||||
|
||||
import SwiftUI
|
||||
|
||||
extension View {
|
||||
/**
|
||||
drops an inner shadow with the given shape in the receiving view.
|
||||
Credits: https://www.hackingwithswift.com/plus/swiftui-special-effects/shadows-and-glows
|
||||
*/
|
||||
func innerShadow<S: Shape>(
|
||||
using shape: S,
|
||||
angle: Angle = .degrees(0),
|
||||
color: Color = .black,
|
||||
width: CGFloat = 6,
|
||||
blur: CGFloat = 6
|
||||
) -> some View {
|
||||
let finalX = CGFloat(cos(angle.radians - .pi / 2))
|
||||
let finalY = CGFloat(sin(angle.radians - .pi / 2))
|
||||
return self
|
||||
.overlay(
|
||||
shape
|
||||
.stroke(color, lineWidth: width)
|
||||
.offset(x: finalX * width * 0.6, y: finalY * width * 0.6)
|
||||
.blur(radius: blur)
|
||||
.mask(shape)
|
||||
)
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue