Tweaks to Onboarding following design review.

Use constants for consistent top padding and icon sizes.
Match layout of AnalyticsPrompt on iPad to other views.
Update icon in use case selection screen to allow tinting.
This commit is contained in:
Doug
2022-03-30 18:55:22 +01:00
parent 7b043fabcf
commit 512f498ff1
8 changed files with 47 additions and 24 deletions
@@ -34,6 +34,11 @@ struct OnboardingUseCaseSelectionScreen: View {
var titleContent: some View {
VStack(spacing: 8) {
Image(Asset.Images.onboardingUseCaseIcon.name)
.resizable()
.renderingMode(.template)
.foregroundColor(theme.colors.accent)
.frame(width: OnboardingMetrics.iconSize, height: OnboardingMetrics.iconSize)
.background(Circle().foregroundColor(.white).padding(2))
.padding(.bottom, 8)
.accessibilityHidden(true)
@@ -99,9 +104,9 @@ struct OnboardingUseCaseSelectionScreen: View {
useCaseButtons
}
.frame(maxWidth: OnboardingMetrics.maxContentWidth,
maxHeight: OnboardingMetrics.maxContentHeight)
.padding(16)
.frame(maxWidth: OnboardingMetrics.maxContentWidth)
.padding(.top, OnboardingMetrics.topPaddingToNavigationBar)
.padding(.horizontal, 16)
}
.frame(maxWidth: .infinity)
@@ -120,11 +125,11 @@ struct OnboardingUseCaseSelectionScreen: View {
@available(iOS 14.0, *)
struct OnboardingUseCase_Previews: PreviewProvider {
static let stateRenderer = MockOnboardingUseCaseSelectionScreenState.stateRenderer
static var previews: some View {
NavigationView {
stateRenderer.screenGroup()
.navigationBarTitleDisplayMode(.inline)
}
.navigationViewStyle(StackNavigationViewStyle())
stateRenderer.screenGroup(addNavigation: true)
.theme(.light).preferredColorScheme(.light)
stateRenderer.screenGroup(addNavigation: true)
.theme(.dark).preferredColorScheme(.dark)
}
}