Huge gap for navigation bar (Lunch Card expansion)

By the way, this is the last expansion before the app reaches its first finished build. Almost there!

I've seen many forums about this problem, but they've never solved my problem. Especially with the new .navigationTitle modifier instead of the - what seems to be - deprecated .navigationBarTitle.

This problem is evident in two views: CardFullView - which is just a detail view for the cards - and ColophonView - which is basically the Lunch Card version of Widgetsmith's colophon.

There's a huge gap above the view. For CardFullView, it's an inline navigation bar. ColophonView doesn't have one - it has a custom title which is basically just a ZStack rectangle.

Here's the full code for each view:

CardFullView: Note: CardView has split into two views, CardViewV and CardViewH. These are for features I still need to develop. Please don't mind them.

Code Block 
import SwiftUI
struct CardFullView: View {
    let cname: String
    let name: String
    let id: String
//    let code: String
    
    var body: some View {
        NavigationView {
            CardViewV(name: name, id: id)
            
            .navigationBarTitle(Text(cname), displayMode: .inline)
        }
    }
}

ColophonView:

Code Block 
struct ColophonView: View {
    @Environment(\.colorScheme) var colorScheme
    
    var body: some View {
        ScrollView {
            VStack {
                ZStack {
                    Rectangle()
                        .frame(maxWidth: .infinity, maxHeight: 75)
                        .foregroundColor(colorScheme == .light ? .white : .black)
                        .overlay(LinearGradient(gradient: Gradient(colors: colorScheme == .light ? [Color.white, Color("Light")] : [Color.black, Color("Light")]), startPoint: .topLeading, endPoint: .bottomTrailing))
                    HStack {
                        Text("Colophon")
                           .font(.system(.headline, design: .monospaced))
                        Text("by Joshua Srery")
                            .font(.system(.body, design: .monospaced))
                            .foregroundColor(.secondary)
                    }
                }
                .cornerRadius(25)
                .padding()
                ScrollView {
                    Text("Lunch Card was built in Xcode 12.3+ on a 15 inch, 2019 Macbook Pro running macOS Big Sur.\n\nI'd like to thank the LPS school district for letting the idea spark.  Lunch Card wouldn't exist without the new precautions.\n\nI would also like to thank Apple Developer Forums user OOPer for providing most of the code to power the card system.  This app would still be in development (probably for more than a year) without their help.")
                        .padding()
                    .font(.system(.body, design: .monospaced))
                }
            }.edgesIgnoringSafeArea(.all)
        }
    }
}

Remember, these views work as expected. The only issue is the hierarchy that is adding to that gap.

Please look at previous threads for other code samples.