wip

apps/ios/Shared/Views/Badges/BadgesPayView.swift

@@ -58,11 +58,12 @@ struct BadgesPayView: View {
                         .fixedSize(horizontal: false, vertical: true)
                         .padding(.top, 4)
 
+                    Spacer(minLength: 20)
+
                     HStack(alignment: .top, spacing: 12) {
                         periodCard(.oneMonth)
                         periodCard(.subscribe)
                     }
-                    .padding(.top, 12)
 
                     Spacer(minLength: 20)
 
@@ -79,12 +80,13 @@ struct BadgesPayView: View {
                     .padding(.bottom, g.safeAreaInsets.bottom == 0 ? 20 : 0)
                 }
                 .padding(.horizontal, 25)
-                .padding(.top, 8)
+                .padding(.top, 0)
                 .padding(.bottom, 20)
                 .frame(minHeight: g.size.height)
             }
         }
         .frame(maxHeight: .infinity)
+        .navigationBarTitleDisplayMode(.inline)
     }
 
     private func periodCard(_ period: BadgePeriod) -> some View {

apps/ios/Shared/Views/Badges/BadgesSupportSimplexView.swift

@@ -14,6 +14,9 @@ import SimpleXChat
 struct BadgesSupportSimplexView: View {
     @EnvironmentObject var theme: AppTheme
     @Environment(\.colorScheme) var colorScheme: ColorScheme
+    // set true when presented as a sheet root (from the chat-list banner) — that path doesn't
+    // reserve nav-bar space like a NavigationLink push does, so the title lands too close to the top
+    var showsAsSheet: Bool = false
     @State private var whyBuiltActive = false
     @State private var chooseLevelActive = false
     @State private var redeemCodeActive = false
@@ -54,7 +57,7 @@ struct BadgesSupportSimplexView: View {
                 .padding(.bottom, g.safeAreaInsets.bottom == 0 ? 20 : 0)
             }
             .padding(.horizontal, 25)
-            .padding(.top, 28)
+            .padding(.top, showsAsSheet ? 48 : 0)
             .padding(.bottom, 20)
             // .frame(height:) not minHeight — inside the banner sheet's NavigationView minHeight
             // would let the VStack expand past the visible area and inflate the hero.
@@ -62,14 +65,17 @@ struct BadgesSupportSimplexView: View {
         }
         .frame(maxHeight: .infinity)
         .modifier(ThemedBackground())
-        .navigationBarHidden(true)
+        .navigationBarTitleDisplayMode(.inline)
     }
 
     private func whyBuiltButton() -> some View {
         ZStack {
             Button { whyBuiltActive = true } label: {
-                Label("Why SimpleX is built.", systemImage: "info.circle")
-                    .font(.headline)
+                HStack(spacing: 4) {
+                    Image(systemName: "info.circle")
+                    Text("Why SimpleX is built.").fontWeight(.medium)
+                }
+                .font(.body)
             }
             NavigationLink(isActive: $whyBuiltActive) {
                 WhySimpleX(onboarding: false, titleColor: theme.colors.primary, createProfileNavLinkActive: .constant(false))

apps/ios/Shared/Views/Badges/BadgesYourLevelView.swift

@@ -105,11 +105,12 @@ struct BadgesYourLevelView: View {
                     }
                     .padding(.top, 4)
 
+                    Spacer(minLength: 20)
+
                     HStack(alignment: .top, spacing: 12) {
                         levelCard(.supporter)
                         levelCard(.legend)
                     }
-                    .padding(.top, 8)
 
                     Spacer(minLength: 20)
 
@@ -122,12 +123,13 @@ struct BadgesYourLevelView: View {
                     .padding(.bottom, g.safeAreaInsets.bottom == 0 ? 20 : 0)
                 }
                 .padding(.horizontal, 25)
-                .padding(.top, 8)
+                .padding(.top, 0)
                 .padding(.bottom, 20)
                 .frame(minHeight: g.size.height)
             }
         }
         .frame(maxHeight: .infinity)
+        .navigationBarTitleDisplayMode(.inline)
     }
 
     private func levelCard(_ level: BadgeLevel) -> some View {
@@ -187,8 +189,11 @@ struct BadgesYourLevelView: View {
             Button {
                 howItWorksActive = true
             } label: {
-                Label("How private badges work", systemImage: "info.circle")
-                    .font(.headline)
+                HStack(spacing: 4) {
+                    Image(systemName: "info.circle")
+                    Text("How private badges work").fontWeight(.medium)
+                }
+                .font(.body)
             }
 
             NavigationLink(isActive: $howItWorksActive) {

apps/ios/Shared/Views/ChatList/ChatListView.swift

@@ -215,7 +215,7 @@ struct ChatListView: View {
         }
         .appSheet(isPresented: $showBadgesSheet) {
             NavigationView {
-                BadgesSupportSimplexView()
+                BadgesSupportSimplexView(showsAsSheet: true)
             }
         }
         .onChange(of: activeUserPickerSheet) {

apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesSupportSimplexView.kt

@@ -36,7 +36,7 @@ import chat.simplex.res.MR
 fun BadgesSupportSimplexView() {
   // TODO [badges] gate on user badge status (no badge → this view, active → "Manage your badge")
   ColumnWithScrollBar(
-    Modifier.background(MaterialTheme.colors.background).padding(horizontal = 25.dp).padding(top = 28.dp, bottom = 20.dp),
+    Modifier.background(MaterialTheme.colors.background).padding(horizontal = 25.dp).padding(top = 8.dp, bottom = 20.dp),
     verticalArrangement = Arrangement.spacedBy(16.dp),
     horizontalAlignment = Alignment.CenterHorizontally,
     maxIntrinsicSize = true,