gistfile1.txt

import SwiftUI

struct AccountView: View {
    var cardViews: [NameData] = DataList.allItems
    
    let columns = [GridItem(.adaptive(minimum: 150))]
    
    @State private var showMoreButton = false
    
    var body: some View {
                ZStack {
                    Color.gray
                        .opacity(0.2)
                        .ignoresSafeArea()
                    
                            ScrollView {
                                VStack {
                                    ScrollView { // denna ska bli scrollview
                                        VStack {
                                                HStack {
                                                    Text("Menu")
                                                        .font(.title)
                                                        .bold()
                                                    
                                                    Spacer()
                                                    
                                                    Image(systemName: "magnifyingglass")
                                                        .font(.title3)
                                                        .background(
                                                            Circle()
                                                                .frame(width: 30, height: 30)
                                                                .foregroundColor(.gray)
                                                                .opacity(0.3)
                                                
                                                        )
                                                        .padding(.horizontal, 10)
                                                }
                                                .padding(.horizontal)
                                                
                                                HStack(spacing: 15) {
                                                    Image("IMG_7112")
                                                        .resizable()
                                                        .frame(width: 50, height: 50)
                                                        .scaledToFill()
                                                        .clipShape(Circle())
                                                    
                                                    VStack(alignment: .leading) {
                                                        Text("MR SwiftUI")
                                                            .font(.title3)
                                                            .bold()
                                                        
                                                        Text("Show your profile")
                                                            .foregroundColor(.secondary)
                                                        
                                                        Spacer()
                                                    }
                                                        Spacer()
                                                }
                                                .padding(.horizontal)
                                                
                                                    LazyVGrid(columns: columns, spacing: 10) {
                                                                ForEach(cardViews, id: \.self) { cardview in
                                                                    RoundedRectangle(cornerRadius: 15)
                                                                            .frame(width: 175, height: 80)
                                                                            .foregroundColor(.white).opacity(0.7)
                                                                            .overlay(
                                                                                HStack {
                                                                                    VStack(alignment: .leading, spacing: 5) {
                                                                                        Image(systemName: cardview.imageName)
                                                                                            .foregroundColor(cardview.imageColor)
                                                                                        
                                                                                        Text(cardview.title)
                                                                                    }
                                                                                    Spacer()
                                                                                }
                                                                                .padding(.horizontal, 7)
                                                                                .font(.title3)
                                                                            )
                                                                }
                                                            }
                                                            .padding()
                                        }
                                        
                                    }
                                    .frame(height: showMoreButton ? 570 : 295) // width: gp.size.width,
                                    
                                    
                                    Button(action: {
                                        showMoreButton.toggle()
                                    }, label: {
                                        Text("Show more")
                                            .font(.caption).bold()
                                            .padding(.vertical, 8)
                                            .frame(maxWidth: .infinity)
                                            .foregroundColor(.black)
                                            .background(
                                            RoundedRectangle(cornerRadius: 5)
                                                .foregroundColor(.gray).opacity(0.3)
                                            )
                                            .padding(.horizontal)
                                    })
                                  
                                    // MARK: DisclosureGroups
                                    VStack {
                                        Divider()
                                        
                                        DisclosureGroup(content: {
                                            RoundedRectangle(cornerRadius: 15)
                                                .frame(width: 300, height: 200)
                                                .foregroundColor(.blue)
                                        }, label: {
                                            HStack {
                                                Image(systemName: "hands.sparkles")
                                                Text("Community resources")
                                            }
                                        })
                                        
                                        Divider()
                                        
                                        DisclosureGroup(content: {
                                            RoundedRectangle(cornerRadius: 15)
                                                .frame(width: 300, height: 200)
                                                .foregroundColor(.red)
                                        }, label: {
                                            HStack {
                                                Image(systemName: "questionmark.circle.fill")
                                                Text("Help and support")
                                            }
                                        })
                                        
                                        Divider()
                                        
                                        DisclosureGroup(content: {
                                            RoundedRectangle(cornerRadius: 15)
                                                .frame(width: 300, height: 200)
                                                .foregroundColor(.green)
                                        }, label: {
                                            HStack {
                                                Image(systemName: "gear.circle")
                                                Text("Settings and privacy")
                                            }
                                        })
                                        
                                        Divider()
                                        
                                        DisclosureGroup(content: {
                                            RoundedRectangle(cornerRadius: 15)
                                                .frame(width: 300, height: 200)
                                                .foregroundColor(.orange)
                                        }, label: {
                                            HStack {
                                                Image(systemName: "square.grid.3x3.square")
                                                Text("Also from Meta")
                                            }
                                        })
                                        
                                        Divider()
                                    }
                                    .accentColor(.black)
                                    .padding()
                                }
                                .animation(.easeInOut(duration: 0.5), value: showMoreButton)
                            }
                }
    }
}