Signed-off-by: Matt Bruce <mbrucedogs@gmail.com>

This commit is contained in:
Matt Bruce 2026-01-09 15:01:56 -06:00
parent 3807ba38dd
commit 92c941d7aa
2 changed files with 38 additions and 40 deletions

View File

@ -557,31 +557,23 @@ private struct ImageLayoutRow: View {
var body: some View { var body: some View {
VStack(alignment: .leading, spacing: Design.Spacing.medium) { VStack(alignment: .leading, spacing: Design.Spacing.medium) {
// Live card preview based on selected layout // Live card preview based on selected layout
VStack(spacing: 0) { VStack(alignment: .leading, spacing: 0) {
ZStack(alignment: .bottomLeading) { // Banner preview
// Banner preview based on layout EditorBannerPreviewView(
EditorBannerPreviewView( photoData: photoData,
photoData: photoData, coverPhotoData: coverPhotoData,
coverPhotoData: coverPhotoData, logoData: logoData,
logoData: logoData, avatarSystemName: avatarSystemName,
avatarSystemName: avatarSystemName, selectedTheme: selectedTheme,
selectedTheme: selectedTheme, selectedHeaderLayout: selectedHeaderLayout
selectedHeaderLayout: selectedHeaderLayout )
)
// Overlay content based on layout
if hasOverlappingContent {
overlayContent
.padding(.leading, Design.Spacing.large)
.padding(.trailing, Design.Spacing.large)
.offset(y: Design.CardSize.avatarOverlap)
}
}
// Spacer to make room for overlapping content // Overlay content positioned below banner, overlapping upward
if hasOverlappingContent { if hasOverlappingContent {
Spacer() overlayContent
.frame(height: Design.CardSize.avatarOverlap) .padding(.horizontal, Design.Spacing.large)
.offset(y: -Design.CardSize.avatarOverlap)
.padding(.bottom, -Design.CardSize.avatarOverlap)
} }
} }

View File

@ -51,27 +51,33 @@ struct HeaderLayoutPickerView: View {
var body: some View { var body: some View {
NavigationStack { NavigationStack {
VStack(spacing: 0) { VStack(spacing: 0) {
ScrollView(.horizontal, showsIndicators: false) { ScrollViewReader { proxy in
HStack(spacing: Design.Spacing.large) { ScrollView(.horizontal, showsIndicators: false) {
ForEach(CardHeaderLayout.allCases) { layout in HStack(spacing: Design.Spacing.large) {
LayoutPreviewCard( ForEach(CardHeaderLayout.allCases) { layout in
layout: layout, LayoutPreviewCard(
isSelected: currentLayout == layout, layout: layout,
isSuggested: layout == suggestedLayout, isSelected: currentLayout == layout,
photoData: photoData, isSuggested: layout == suggestedLayout,
coverPhotoData: coverPhotoData, photoData: photoData,
logoData: logoData, coverPhotoData: coverPhotoData,
avatarSystemName: avatarSystemName, logoData: logoData,
theme: theme avatarSystemName: avatarSystemName,
) { theme: theme
withAnimation(.snappy(duration: Design.Animation.quick)) { ) {
currentLayout = layout withAnimation(.snappy(duration: Design.Animation.quick)) {
currentLayout = layout
}
} }
.id(layout)
} }
} }
.padding(.horizontal, Design.Spacing.xLarge)
.padding(.vertical, Design.Spacing.large)
}
.onAppear {
proxy.scrollTo(currentLayout, anchor: .center)
} }
.padding(.horizontal, Design.Spacing.xLarge)
.padding(.vertical, Design.Spacing.large)
} }
.scrollClipDisabled() .scrollClipDisabled()