Test

import SwiftUI
//            HStack {
//                Button("Vanilla"){
//                    cakeColor = .orange
//                }
//                .padding()
//                .background(.orange)
//                .foregroundStyle(.white)
//                Button("Cocoa"){
//                    cakeColor = .brown
//                }
//                .padding()
//                .background(.brown)
//                .foregroundStyle(.white)
//                Button("Berry"){
//                    cakeColor = .pink
//                }
//                .padding()
//                .background(.pink)
//                .foregroundStyle(.white)
//            }
//            .padding()
struct Cake: Identifiable {
    var id = UUID()
    var flavor: Color
    var size: Double
    var addCherry: Bool
    var sweetness: Double
}

struct ContentView: View {
    @State var flavor: Color = Color.mint 
    @State var size: Double = 1.0
    @State var addCherry: Bool = false
    @State var sweetness: Double = 50.0
    @State var menu: [Cake] = []
    var body: some View {
        NavigationView {
            VStack {
                ZStack {
                    Image(systemName: "birthday.cake.fill")
                        .resizable()
                        .frame(width: 150, height: 150)
//                        .padding(.bottom,50)
                        .foregroundStyle(flavor)
                        .scaleEffect(CGSize(width: size, height: size))
                        .opacity(sweetness / 100)
                        .animation(.easeIn, value: flavor)
                        .animation(.bouncy, value: size)
                        .animation(.easeIn, value: sweetness)
                        .padding(.top,50)
                    if addCherry {
                        Text("🍒")
                            .font(.system(size: 60))
                    }
                }
                HStack{ 
                    Text("Flavor")
                    Spacer()
                    Picker("Choose Flavor", selection: $flavor){
                        Text("Vanilla").tag(Color.yellow)
                        Text("Chocolate").tag(Color.brown)
                        Text("Berry").tag(Color.pink)
                    }
                    .tint(.red)
                }
                .padding()
                HStack{ 
                    Text("Size")
                    Spacer()
                    Picker("Choose Size", selection: $size){
                        Text("Small").tag(0.5)
                        Text("Medium").tag(1.0)
                        Text("Large").tag(1.3)
                    }
                    .tint(.red)
                }
                .padding()
                Toggle("Add Cherry", isOn: $addCherry)
                    .tint(.red)
                    .padding()
                Text("Sweetness: \(sweetness)")
                Slider(value: $sweetness, in: 20...100)
                    .animation(.easeIn, value: sweetness)
                    .tint(.red)
                HStack {
                    Button("Random", systemImage: "arrowshape.forward.circle.fill"){
                        flavor = [Color.yellow,Color.brown,Color.pink].randomElement()!
                        size = [0.5,1.0,1.5].randomElement()!
                        addCherry = Bool.random()
                        sweetness = Double.random(in: 20...100)
                    }
                    Button("Create", systemImage: "pencil.circle.fill"){
                        let cake =  Cake(flavor: flavor, size: size, addCherry: addCherry, sweetness: sweetness)
                        menu.append(cake)
                    }
                    .padding()
                    .background(.pink)
                    .foregroundStyle(.white)
                    .cornerRadius(12)
                    
                    NavigationLink{
                        MenuView(menu: menu)
                    }label: {
                        Text("Next Page")
                    }
                }
                
            }
            .navigationTitle("🧁 My Bakery 🍒")
        }
    }
}
struct MenuView: View {
    
    var menu: [Cake]
    
    var body: some View{
        List(menu) { item in
            Image(systemName: "birthday.cake.fill")
                .resizable()
                .frame(width: 150,height: 150)
                .foregroundStyle(item.flavor)
            
        }
    }
}

#Preview {
    ContentView()
}