improve main content ui

Pocket Poster/Views/ContentView.swift

@@ -30,13 +30,11 @@ struct ContentView: View {
     
     var body: some View {
         NavigationStack {
-            ScrollView {
+            List {
-                HStack {
+                Section {} header: {
                     Label("Version \(Bundle.main.releaseVersionNumber ?? "UNKNOWN") (\(Int(buildNumber) != 0 ? "Beta \(buildNumber)" : NSLocalizedString("Release", comment:"")))", systemImage: "info.circle.fill")
-                    Spacer()
-                }
                         .font(.caption)
-                    .padding(.bottom, 10)
+                }
                 
                 Section {
                     Button(action: {
@@ -46,21 +44,18 @@ struct ContentView: View {
                         Text("Select Tendies")
                     }
                     .buttonStyle(TintedButton(color: .green, fullwidth: true))
-                    .padding(.vertical, 10)
+                }
+                .listRowInsets(EdgeInsets())
+                .padding(7)
                 
                 if !selectedTendies.wrappedValue.isEmpty {
-                        HStack {
+                    Section {
-                            Text("Selected Tendies")
-                                .font(.headline)
-                            Spacer()
-                        }
-                        List {
                         ForEach(selectedTendies.wrappedValue, id: \.self) { tendie in
                             Text(tendie.deletingPathExtension().lastPathComponent)
                         }
                         .onDelete(perform: delete)
-                        }
+                    } header: {
-                        .frame(height: CGFloat((selectedTendies.wrappedValue.count * 65) + (selectedTendies.wrappedValue.count < 3 ? 100 : 0)), alignment: .top)
+                        Label("Selected Tendies", systemImage: "document")
                     }
                 }
                 
@@ -68,6 +63,7 @@ struct ContentView: View {
                     if pbHash == "" {
                         Text("Enter your PosterBoard app hash in Settings.")
                     } else {
+                        VStack {
                             if !selectedTendies.wrappedValue.isEmpty {
                                 Button(action: {
                                     UIImpactFeedbackGenerator(style: .soft).impactOccurred()
@@ -101,9 +97,13 @@ struct ContentView: View {
                             }
                             .buttonStyle(TintedButton(color: .red, fullwidth: true))
                         }
+                        .listRowInsets(EdgeInsets())
+                        .padding(7)
+                    }
+                } header: {
+                    Label("Actions", systemImage: "hammer")
                 }
             }
-            .padding()
             .navigationTitle("Pocket Poster")
             .toolbar {
                 ToolbarItem(placement: .topBarLeading) {