Play’s SwiftUI Code Challenge - https://createwithplay.notion.site/Play-s-SwiftUI-Code-Challenge-07a945fe917f4e6399413530230ce2ac

Card.swift

import SwiftUI

struct Card: View {

  var body: some View {
    HStack(spacing: 0) {
      Color.gray
        .frame(width: Size.largeImageSize)
      ZStack(alignment: .leading) {
        Color.yellow
        Text("Discover the Benefits of This Lifehack")
          .font(.system(size: Size.cardFont))
          .padding(.leading, Size.mediumSpacing)
      }
    }
    .cornerRadius(Size.cornerRadius)
    .frame(height: Size.largeImageSize)
  }
}

struct Card_Previews: PreviewProvider {
  static var previews: some View {
    Card()
  }
}

ContentView.swift

import SwiftUI

enum Size {
  static let smallSpacing: CGFloat = 4
  static let mediumSpacing: CGFloat = 12
  static let headerHeight: CGFloat = 180
  static let footerHeight: CGFloat = 264
  static let padding: CGFloat = 24
  static let bottomPadding: CGFloat = 53
  static let smallImageSize: CGFloat = 48
  static let largeImageSize: CGFloat = 80
  static let headerFont: CGFloat = 34
  static let cardFont: CGFloat = 20
  static let cornerRadius: CGFloat = 8
}

struct ContentView: View {

  @State
  private var date = Date(timeIntervalSince1970: 1664463300)

  var body: some View {
    VStack(spacing: 0) {
      Color.gray
        .frame(height: Size.headerHeight)
      ScrollView {
        VStack(alignment: .leading, spacing: Size.padding) {
          Header()
          Card()
          DatePicker("", selection: self.$date)
            .labelsHidden()
          Text("The bedding was hardly able to cover it and seemed ready to slide off any moment. His many legs, pitifully thin compares with the size of the rest of him.")
        }
        .padding(Size.padding)
      }
      Grid()
    }
    .ignoresSafeArea()
  }
}

struct ContentView_Previews: PreviewProvider {
  static var previews: some View {
    ContentView()
  }
}

Grid.swift

import SwiftUI

struct Grid: View {
  var body: some View {
    HStack(spacing: Size.smallSpacing) {
      Color.gray
      VStack(spacing: Size.smallSpacing) {
        Color.gray
        Color.gray
      }
    }
    .frame(height: Size.footerHeight)
    .padding(.bottom, Size.bottomPadding)
  }
}

struct Grid_Previews: PreviewProvider {
  static var previews: some View {
    Grid()
  }
}

Header.swift

import SwiftUI

struct Header: View {

  var body: some View {
    VStack(alignment: .leading, spacing: Size.smallSpacing) {
      Text("Learn These Breathing Techniques")
        .font(.system(size: Size.headerFont))
      HStack(spacing: Size.smallSpacing) {
        ForEach(["water", "wind", "sun"], id: \.self) {
          Image($0)
            .frame(width: Size.smallImageSize, height: Size.smallImageSize)
        }
      }
    }
  }
}

struct Header_Previews: PreviewProvider {
  static var previews: some View {
    Header()
  }
}