iPodMini.swift

// Recreated from Jordan Singer's iPod.swift - https://gist.github.com/jordansinger/b3ba0e6063116e5dae01b82301545818

import SwiftUI
import PlaygroundSupport

struct iPod: View {
    var body: some View {
        VStack(spacing: 56) {
            Screen()
            ClickWheel()
            Spacer()
        }
        .padding(.top, 48)
        .frame(width: 340, height: 620)
        .background(Color(UIColor.tertiarySystemBackground))
        .cornerRadius(3)
        .shadow(color: Color(UIColor.black.withAlphaComponent(0.15)), radius: 32, x: 0, y: 10)
        .overlay(
            RoundedRectangle(cornerRadius: 3)
                .stroke(Color.clear, lineWidth: 12)
                .shadow(color: Color(UIColor.black.withAlphaComponent(0.5)), radius: 8, x: 18)
                .clipShape(
                    RoundedRectangle(cornerRadius: 3)
            )
        )
            .overlay(
                RoundedRectangle(cornerRadius: 6)
                    .stroke(Color.clear, lineWidth: 12)
                    .shadow(color: Color(UIColor.black.withAlphaComponent(0.5)), radius: 8, x: -18)
                    .clipShape(
                        RoundedRectangle(cornerRadius: 6)
                )
        )
    }
}

struct Screen: View {
    var body: some View {
        RoundedRectangle(cornerRadius: 8)
            .fill(Color(#colorLiteral(red: 0.4313725531101227, green: 0.46666666865348816, blue: 0.35686275362968445, alpha: 1)))
            .frame(width: 230, height: 180)
            .overlay(
                RoundedRectangle(cornerRadius: 8)
                    .stroke(Color.clear, lineWidth: 8)
                    .shadow(color: Color(UIColor.black.withAlphaComponent(0.5)), radius: 6, x: 0)
                    .clipShape(
                        RoundedRectangle(cornerRadius: 8)
                )
        )
    }
}

struct ClickWheel: View {
    var body: some View {
        ZStack {
            Circle()
                .fill(LinearGradient(
                    gradient: Gradient(stops: [
                        .init(color: Color(#colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)), location: 0),
                        .init(color: Color(#colorLiteral(red: 0.949999988079071, green: 0.949999988079071, blue: 0.949999988079071, alpha: 1)), location: 1)]),
                    startPoint: UnitPoint(x: 0, y: 0),
                    endPoint: UnitPoint(x: 0, y: 1)))
                .frame(height: 256)
                .shadow(color: Color(UIColor.black.withAlphaComponent(0.05)), radius: 4, x: 0, y: 0)
                .overlay(
                    Circle()
                        .fill(LinearGradient(
                            gradient: Gradient(stops: [
                                .init(color: Color(#colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)), location: 0),
                                .init(color: Color(#colorLiteral(red: 0.949999988079071, green: 0.949999988079071, blue: 0.949999988079071, alpha: 1)), location: 1)]),
                            startPoint: UnitPoint(x: 0, y: 0),
                            endPoint: UnitPoint(x: 0, y: 1)))
                        .frame(width: 90, height: 90)
                        .overlay(
                            Circle()
                                .stroke(Color(UIColor.black.withAlphaComponent(0.2)), lineWidth: 0.5)
                    )
                        .overlay(
                            Circle()
                                .stroke(Color.clear, lineWidth: 2)
                                .shadow(color: Color(UIColor.black.withAlphaComponent(0.05)), radius: 2, x: 0, y: 1)
                                .clipShape(
                                    Circle()
                            )
                    )
            )
            
            VStack(spacing: 0) {
                Text("MENU")
                    .fontWeight(.bold)
                Spacer()
                HStack {
                    Image(systemName: "backward.end.alt.fill")
                    Spacer()
                    Image(systemName: "forward.end.alt.fill")
                }
                Spacer()
                Image(systemName: "playpause.fill")
            }
            .padding()
            .frame(width: 256, height: 256)
            .foregroundColor(Color(UIColor.lightGray))
            .font(.body)
        }
    }
}

PlaygroundPage.current.setLiveView(iPod())