Image and Button title in VStack button - swift

Question

Code below in xcode swiftui will generate the BEFORE screen but I want to move the House image just above the "Houses" text (see AFTER screen), I have spent a full day on this and I can't figure out how to make it possible, if anyone is willing to step in for help will be much appreciated! Full code provided below...
Before and After VStack button
import SwiftUI
struct LightGreenButton: View {
var body: some View {
VStack {
Image(systemName: "house")
.resizable()
.frame(width: 50, height: 50, alignment: .center)
//.opacity(0.6)
.clipped()
.foregroundColor(Color(#colorLiteral(red: 0.005, green: 0.4422248602, blue: 0.3870742321, alpha: 1)))
.offset(x: 0, y: 0)
Text("Houses")
.font(.system(size: 20, weight: .semibold, design: .rounded))
.frame(width: 150, height: 100)
.foregroundColor(Color(#colorLiteral(red: 0.005, green: 0.4422248602, blue: 0.3870742321, alpha: 1)))
.background(
ZStack {
Color(#colorLiteral(red: 0.6574724317, green: 0.8923466802, blue: 0.8671938181, alpha: 1))
RoundedRectangle(cornerRadius: 16, style: .continuous)
.foregroundColor(.white)
.blur(radius: 4)
.offset(x: -8, y: -8)
RoundedRectangle(cornerRadius: 16, style: .continuous)
.fill(
LinearGradient(gradient: Gradient(colors: [Color(#colorLiteral(red: 0.6574724317, green: 0.8923466802, blue: 0.8671938181, alpha: 1)), Color.white]), startPoint: .topLeading, endPoint: .bottomTrailing)
)
.padding(2)
.blur(radius: 1)
}
)
.clipShape(RoundedRectangle(cornerRadius: 16, style: .continuous))
.shadow(color: Color(#colorLiteral(red: 0.8696053624, green: 0.8697276711, blue: 0.8695667386, alpha: 1)), radius: 20, x: 20, y: 20)
.shadow(color: Color(#colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)), radius: 20, x: -20, y: -20)
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(Color(#colorLiteral(red: 0.9447055279, green: 0.954059048, blue: 0.954059048, alpha: 1)))
.edgesIgnoringSafeArea(.all)
}
}
struct LightGreenButton_Previews: PreviewProvider {
static var previews: some View {
LightGreenButton()
}
}

Answer 1

Here is a solution. Tested with Xcode 11.4 / iOS 13.4.
struct LightGreenButton: View {
var body: some View {
VStack {
Image(systemName: "house")
.resizable()
.frame(width: 50, height: 50, alignment: .center)
//.opacity(0.6)
.clipped()
.foregroundColor(Color(#colorLiteral(red: 0.005, green: 0.4422248602, blue: 0.3870742321, alpha: 1)))
.offset(x: 0, y: 0)
Text("Houses")
.font(.system(size: 20, weight: .semibold, design: .rounded))
.foregroundColor(Color(#colorLiteral(red: 0.005, green: 0.4422248602, blue: 0.3870742321, alpha: 1)))
}
.frame(width: 150, height: 100)
.background(
ZStack {
Color(#colorLiteral(red: 0.6574724317, green: 0.8923466802, blue: 0.8671938181, alpha: 1))
RoundedRectangle(cornerRadius: 16, style: .continuous)
.foregroundColor(.white)
.blur(radius: 4)
.offset(x: -8, y: -8)
RoundedRectangle(cornerRadius: 16, style: .continuous)
.fill(
LinearGradient(gradient: Gradient(colors: [Color(#colorLiteral(red: 0.6574724317, green: 0.8923466802, blue: 0.8671938181, alpha: 1)), Color.white]), startPoint: .topLeading, endPoint: .bottomTrailing)
)
.padding(2)
.blur(radius: 1)
})
.clipShape(RoundedRectangle(cornerRadius: 16, style: .continuous))
.shadow(color: Color(#colorLiteral(red: 0.8696053624, green: 0.8697276711, blue: 0.8695667386, alpha: 1)), radius: 20, x: 20, y: 20)
.shadow(color: Color(#colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)), radius: 20, x: -20, y: -20)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(Color(#colorLiteral(red: 0.9447055279, green: 0.954059048, blue: 0.954059048, alpha: 1)))
.edgesIgnoringSafeArea(.all)
}
}