From 8b103bb61f329107e01ed14d3ec04a5f76cf2bfd Mon Sep 17 00:00:00 2001 From: Anthony Li Date: Sun, 25 Feb 2024 12:45:54 -0500 Subject: [PATCH 1/3] Tweak home page card styling --- PennMobile/Home/HomeCardView.swift | 30 +++++++++++------------------- PennMobile/Home/HomeView.swift | 10 +++++++--- 2 files changed, 18 insertions(+), 22 deletions(-) diff --git a/PennMobile/Home/HomeCardView.swift b/PennMobile/Home/HomeCardView.swift index f42acbc0c..4755f7996 100644 --- a/PennMobile/Home/HomeCardView.swift +++ b/PennMobile/Home/HomeCardView.swift @@ -61,7 +61,6 @@ struct GenericPostCardView: View { if let description { Text(description) .font(.caption) - .lineLimit(3) } } .padding() @@ -71,30 +70,21 @@ struct GenericPostCardView: View { var body: some View { HomeCardView { if let imageURL { - ZStack(alignment: .bottom) { - Rectangle().fill(Material.ultraThin) - .background( - KFImage(imageURL) - .resizable() - .scaledToFill() - ) + VStack(spacing: 0) { + KFImage(imageURL) + .resizable() + .scaledToFill() - Rectangle().fill(.clear) - .overlay( + content + .background(.regularMaterial) + .background(alignment: .top) { KFImage(imageURL) .resizable() .scaledToFill() - ) - .mask(alignment: .top) { - VStack(spacing: 0) { - Rectangle().fill(.white).frame(height: 93) - LinearGradient(colors: [.white, .clear], startPoint: .top, endPoint: .bottom).frame(height: 64) - } + .scaleEffect(x: 1, y: -1) + .clipped() } - - content.padding(.top, 150) } - .environment(\.colorScheme, .dark) } else { content } @@ -181,5 +171,7 @@ struct NewsDetailView: UIViewControllerRepresentable { PostCardView(post: Post(id: 1, title: "Congratulations!", subtitle: "You are our lucky winner", postUrl: "https://www.youtube.com/watch?v=dQw4w9WgXcQ", imageUrl: "https://www.cnet.com/a/img/resize/2bec42558a71a3922e6e590476b919288a015288/hub/2017/06/01/a176bcb9-1442-4d6d-a7d9-f01efdbcc4bc/broken-screen-ipad-6200-002.jpg?auto=webp&fit=crop&height=675&width=1200", createdDate: Date(), startDate: Date.midnightYesterday, expireDate: Date.midnightToday, source: "Totally Legit Source")) } .frame(width: 400) + .fixedSize(horizontal: false, vertical: true) .padding(.vertical) + .frame(maxHeight: .infinity) } diff --git a/PennMobile/Home/HomeView.swift b/PennMobile/Home/HomeView.swift index 7a550ecb4..656c6cf78 100644 --- a/PennMobile/Home/HomeView.swift +++ b/PennMobile/Home/HomeView.swift @@ -23,7 +23,11 @@ struct HomeView: View { } var backgroundGradient: some View { - LinearGradient(colors: [colorScheme == .dark ? Color("baseDarkBlue") : Color("baseLabsBlue").opacity(0.5), .clear], startPoint: .topLeading, endPoint: .center) + if colorScheme == .dark { + return LinearGradient(colors: [Color("baseDarkBlue"), .clear], startPoint: .topLeading, endPoint: .center) + } else { + return LinearGradient(colors: [Color("baseLabsBlue").opacity(0.15), .clear], startPoint: .topLeading, endPoint: .center) + } } var body: some View { @@ -47,7 +51,7 @@ struct HomeView: View { .background(GeometryReader { geometry in let minY = geometry.frame(in: .global).minY Color.clear.onChange(of: minY) { minY in - showTitle = minY <= 32 + showTitle = minY <= 16 } }) @@ -55,8 +59,8 @@ struct HomeView: View { HStack(alignment: .top) { Text(splashText) .fontWeight(.medium) + .opacity(0.7) } - .foregroundStyle(.secondary) } } .offset(y: -16) From 2583e72f2391b94bc9b034728bce84e65eef9c65 Mon Sep 17 00:00:00 2001 From: Anthony Li Date: Sun, 25 Feb 2024 12:58:24 -0500 Subject: [PATCH 2/3] Composite blur effect --- PennMobile/Home/HomeCardView.swift | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/PennMobile/Home/HomeCardView.swift b/PennMobile/Home/HomeCardView.swift index 4755f7996..dabf75f32 100644 --- a/PennMobile/Home/HomeCardView.swift +++ b/PennMobile/Home/HomeCardView.swift @@ -76,14 +76,17 @@ struct GenericPostCardView: View { .scaledToFill() content - .background(.regularMaterial) .background(alignment: .top) { - KFImage(imageURL) - .resizable() - .scaledToFill() - .scaleEffect(x: 1, y: -1) - .clipped() + ZStack { + KFImage(imageURL) + .resizable() + .scaledToFill() + .scaleEffect(x: 1, y: -1) + Rectangle().fill(.regularMaterial) + } + .drawingGroup() } + .clipped() } } else { content From 70c66bf78564c794301f85dcec955436088d9304 Mon Sep 17 00:00:00 2001 From: Anthony Li Date: Sun, 25 Feb 2024 12:59:42 -0500 Subject: [PATCH 3/3] Nuke the background gradient --- PennMobile/Home/HomeView.swift | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/PennMobile/Home/HomeView.swift b/PennMobile/Home/HomeView.swift index 656c6cf78..13ca97310 100644 --- a/PennMobile/Home/HomeView.swift +++ b/PennMobile/Home/HomeView.swift @@ -22,14 +22,6 @@ struct HomeView: View { .day() } - var backgroundGradient: some View { - if colorScheme == .dark { - return LinearGradient(colors: [Color("baseDarkBlue"), .clear], startPoint: .topLeading, endPoint: .center) - } else { - return LinearGradient(colors: [Color("baseLabsBlue").opacity(0.15), .clear], startPoint: .topLeading, endPoint: .center) - } - } - var body: some View { Group { switch viewModel.data { @@ -37,7 +29,6 @@ struct HomeView: View { ProgressView() .controlSize(.large) .frame(maxWidth: .infinity, maxHeight: .infinity) - .background(backgroundGradient) .ignoresSafeArea() case .some(.success(let data)): NavigationStack { @@ -97,7 +88,6 @@ struct HomeView: View { .refreshable { try? await viewModel.fetchData(force: true) } - .background(backgroundGradient.ignoresSafeArea(edges: .all)) } case .some(.failure(let error)): VStack(spacing: 16) { @@ -126,8 +116,6 @@ struct HomeView: View { .multilineTextAlignment(.center) .padding() .frame(maxWidth: .infinity, maxHeight: .infinity) - .background(LinearGradient(colors: [.red, .clear], startPoint: .topLeading, endPoint: .center)) - .ignoresSafeArea() } }.onAppear { Task {