mirror of
https://github.com/nicoverbruggen/phpmon.git
synced 2025-11-08 05:30:05 +01:00
🍱 Tweaked onboarding view
This commit is contained in:
@@ -8,96 +8,109 @@
|
|||||||
|
|
||||||
import SwiftUI
|
import SwiftUI
|
||||||
|
|
||||||
|
struct OnboardingTextItem: View {
|
||||||
|
@State var icon: String
|
||||||
|
@State var title: String
|
||||||
|
@State var description: String
|
||||||
|
var body: some View {
|
||||||
|
HStack(spacing: 15) {
|
||||||
|
Image(systemName: icon)
|
||||||
|
.resizable()
|
||||||
|
.aspectRatio(contentMode: .fit)
|
||||||
|
.frame(width: 24, height: 24)
|
||||||
|
.foregroundColor(Color.appPrimary)
|
||||||
|
.padding(.trailing, 10)
|
||||||
|
VStack(alignment: .leading, spacing: 4) {
|
||||||
|
Text(title.localizedForSwiftUI)
|
||||||
|
.font(.system(size: 15))
|
||||||
|
Text(description.localizedForSwiftUI)
|
||||||
|
.foregroundColor(Color.secondary)
|
||||||
|
.font(.system(size: 13))
|
||||||
|
.fixedSize(horizontal: false, vertical: true)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
struct OnboardingView: View {
|
struct OnboardingView: View {
|
||||||
var body: some View {
|
var body: some View {
|
||||||
VStack {
|
VStack(spacing: 10) {
|
||||||
VStack(alignment: .leading) {
|
VStack(alignment: .center) {
|
||||||
HStack {
|
HStack {
|
||||||
Image(nsImage: NSApp.applicationIconImage)
|
Image(nsImage: NSApp.applicationIconImage)
|
||||||
.resizable()
|
.resizable()
|
||||||
.frame(width: 80, height: 80)
|
.frame(width: 80, height: 80)
|
||||||
.padding(.bottom, 5)
|
|
||||||
.padding(.trailing, 25)
|
|
||||||
VStack(alignment: .leading, spacing: 0) {
|
|
||||||
Text("onboarding.welcome".localized)
|
|
||||||
.font(.title)
|
|
||||||
.bold()
|
|
||||||
.padding(.bottom, 5)
|
.padding(.bottom, 5)
|
||||||
Text("onboarding.explore".localized)
|
.padding(.trailing, 25)
|
||||||
.padding(.bottom)
|
VStack(alignment: .leading, spacing: 0) {
|
||||||
}.padding(.top, 10)
|
Text("onboarding.welcome".localized)
|
||||||
}
|
.font(.title)
|
||||||
|
.bold()
|
||||||
TabView {
|
.padding(.bottom, 5)
|
||||||
|
Text("onboarding.explore".localized)
|
||||||
|
.padding(.bottom)
|
||||||
|
}
|
||||||
|
.padding(.top, 10)
|
||||||
|
}
|
||||||
VStack {
|
VStack {
|
||||||
Image("Tour.MenuBar")
|
VStack(alignment: .leading, spacing: 20) {
|
||||||
.resizable()
|
OnboardingTextItem(
|
||||||
.aspectRatio(contentMode: .fit)
|
icon: "sparkles.rectangle.stack",
|
||||||
.padding(.top)
|
title: "onboarding.tour.menu_bar.title",
|
||||||
Text("onboarding.tour.menu_bar".localizedForSwiftUI)
|
description: "onboarding.tour.menu_bar"
|
||||||
.padding(.init(top: 5, leading: 20, bottom: 20, trailing: 20))
|
)
|
||||||
}.tabItem { Label("onboarding.tour.menu_bar.title".localized,
|
OnboardingTextItem(
|
||||||
systemImage: "info.circle.fill") }
|
icon: "list.star",
|
||||||
VStack {
|
title: "onboarding.tour.domains.title",
|
||||||
Image("Tour.Domains")
|
description: "onboarding.tour.domains"
|
||||||
.resizable()
|
)
|
||||||
.aspectRatio(contentMode: .fit)
|
OnboardingTextItem(
|
||||||
.padding(.top)
|
icon: "pin.fill",
|
||||||
Text("onboarding.tour.domains".localized)
|
title: "onboarding.tour.isolation.title",
|
||||||
.padding(.init(top: 5, leading: 20, bottom: 20, trailing: 20))
|
description: "onboarding.tour.isolation"
|
||||||
}.tabItem { Label("onboarding.tour.domains.title".localized,
|
)
|
||||||
systemImage: "info.circle.fill") }
|
}
|
||||||
VStack {
|
.padding(20)
|
||||||
Image("Tour.Isolation")
|
.overlay(
|
||||||
.resizable()
|
RoundedRectangle(cornerRadius: 10)
|
||||||
.aspectRatio(contentMode: .fit)
|
.stroke(Color.gray.opacity(0.3), lineWidth: 1)
|
||||||
.padding(.top)
|
)
|
||||||
Text("onboarding.tour.isolation".localized)
|
}.padding()
|
||||||
.padding(.init(top: 5, leading: 20, bottom: 20, trailing: 20))
|
VStack(spacing: 20) {
|
||||||
}.tabItem { Label("onboarding.tour.isolation.title".localized,
|
HStack {
|
||||||
systemImage: "info.circle.fill") }
|
Image(systemName: "questionmark.circle.fill")
|
||||||
|
.resizable()
|
||||||
|
.frame(width: 24, height: 24)
|
||||||
|
.foregroundColor(Color.appSecondary)
|
||||||
|
.padding(.trailing, 10)
|
||||||
|
Text("onboarding.tour.faq_hint".localizedForSwiftUI)
|
||||||
|
}
|
||||||
|
VStack {
|
||||||
|
Text("onboarding.tour.once".localized)
|
||||||
|
.font(.subheadline)
|
||||||
|
.foregroundColor(.gray)
|
||||||
|
.padding(.top, 5)
|
||||||
|
.padding(.bottom, 5)
|
||||||
|
Button("onboarding.tour.close".localized) {
|
||||||
|
App.shared.onboardingWindowController?.close()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}.padding()
|
||||||
}
|
}
|
||||||
}
|
.frame(maxWidth: .infinity)
|
||||||
.frame(maxWidth: .infinity)
|
.frame(maxHeight: 580)
|
||||||
|
|
||||||
VStack(alignment: .center) {
|
|
||||||
HStack {
|
|
||||||
Image(systemName: "person.fill.questionmark")
|
|
||||||
.resizable()
|
|
||||||
.frame(width: 24, height: 24)
|
|
||||||
.foregroundColor(.accentColor)
|
|
||||||
.padding(.trailing, 10)
|
|
||||||
Text("onboarding.tour.faq_hint".localizedForSwiftUI)
|
|
||||||
}.padding()
|
|
||||||
Text("onboarding.tour.once".localized)
|
|
||||||
.font(.subheadline)
|
|
||||||
.foregroundColor(.gray)
|
|
||||||
.padding(.top, 5)
|
|
||||||
.padding(.bottom, 5)
|
|
||||||
Button("Close Tour") {
|
|
||||||
App.shared.onboardingWindowController?.close()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.frame(maxWidth: .infinity)
|
|
||||||
}
|
}
|
||||||
.padding(.top, 8)
|
.padding(.top, 8)
|
||||||
.padding(.leading)
|
.padding(.leading)
|
||||||
.padding(.trailing)
|
.padding(.trailing)
|
||||||
.padding(.bottom)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
struct OnboardingView_Previews: PreviewProvider {
|
struct OnboardingView_Previews: PreviewProvider {
|
||||||
static var previews: some View {
|
static var previews: some View {
|
||||||
Group {
|
Group {
|
||||||
OnboardingView().frame(
|
OnboardingView()
|
||||||
width: 600,
|
OnboardingView().preferredColorScheme(.dark)
|
||||||
height: 600
|
|
||||||
)
|
|
||||||
OnboardingView().preferredColorScheme(.dark).frame(
|
|
||||||
width: 600,
|
|
||||||
height: 600
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -513,12 +513,13 @@ If you are seeing this message but are confused why this folder has gone missing
|
|||||||
|
|
||||||
"onboarding.title" = "Welcome Tour";
|
"onboarding.title" = "Welcome Tour";
|
||||||
"onboarding.welcome" = "Welcome to PHP Monitor!";
|
"onboarding.welcome" = "Welcome to PHP Monitor!";
|
||||||
"onboarding.explore" = "Explore some of the cool features PHP Monitor has to offer.";
|
"onboarding.explore" = "Learn more about some of the features that PHP Monitor has to offer.";
|
||||||
"onboarding.tour.menu_bar.title" = "Get Started";
|
"onboarding.tour.menu_bar.title" = "Get Started";
|
||||||
"onboarding.tour.menu_bar" = "PHP Monitor lives in your menu bar. From here, you can switch the globally linked PHP version, start or stop services, locate configuration files, and more.";
|
"onboarding.tour.menu_bar" = "PHP Monitor lives in your menu bar. From here, you can switch the globally linked PHP version, start or stop services, locate configuration files, and more.";
|
||||||
"onboarding.tour.faq_hint" = "**If you are new to PHP Monitor**, I recommend that you check out the [README](https://github.com/nicoverbruggen/phpmon/blob/main/README.md) on GitHub: it contains a comprehensive FAQ with various tips and common questions and answers. Don't hesitate to get in touch either.";
|
"onboarding.tour.faq_hint" = "I recommend that you check out the [README](https://github.com/nicoverbruggen/phpmon/blob/main/README.md) on GitHub: it contains a comprehensive FAQ with various tips and common questions and answers.";
|
||||||
"onboarding.tour.domains.title" = "Domains";
|
"onboarding.tour.domains.title" = "Domains";
|
||||||
"onboarding.tour.domains" = "By opening the Domains window via the Menu Bar item, you can view which domains are linked and parked.";
|
"onboarding.tour.domains" = "By opening the Domains window via the Menu Bar item, you can view which domains are linked and parked.";
|
||||||
"onboarding.tour.isolation.title" = "Isolation";
|
"onboarding.tour.isolation.title" = "Isolation";
|
||||||
"onboarding.tour.isolation" = "If you have Valet 3 installed, you can even use domain isolation by right-clicking on a given domain in the Domains window. This allows you to pick a specific version of PHP to use for that domain!";
|
"onboarding.tour.isolation" = "If you have Valet 3 installed, you can even use domain isolation by right-clicking on a given domain in the Domains window. This allows you to pick a specific version of PHP to use for that domain!";
|
||||||
"onboarding.tour.once" = "You will only see the Welcome Tour once. You can re-open the Welcome Tour later via the menu bar icon.";
|
"onboarding.tour.once" = "You will only see the Welcome Tour once. You can re-open the Welcome Tour later via the menu bar icon.";
|
||||||
|
"onboarding.tour.close" = "Close Tour";
|
||||||
|
|||||||
Reference in New Issue
Block a user