minor UI changes
This commit is contained in:
parent
586f5fcea0
commit
58e5c2c555
@ -1,4 +1,5 @@
|
|||||||
import SwiftUI
|
import SwiftUI
|
||||||
|
import SwiftData
|
||||||
|
|
||||||
extension View {
|
extension View {
|
||||||
func placeholder<Content: View>(
|
func placeholder<Content: View>(
|
||||||
@ -69,6 +70,7 @@ struct PowerModeView: View {
|
|||||||
var body: some View {
|
var body: some View {
|
||||||
NavigationStack(path: $navigationPath) {
|
NavigationStack(path: $navigationPath) {
|
||||||
VStack(spacing: 0) {
|
VStack(spacing: 0) {
|
||||||
|
// Header Section
|
||||||
VStack(spacing: 12) {
|
VStack(spacing: 12) {
|
||||||
HStack {
|
HStack {
|
||||||
VStack(alignment: .leading, spacing: 4) {
|
VStack(alignment: .leading, spacing: 4) {
|
||||||
@ -135,120 +137,122 @@ struct PowerModeView: View {
|
|||||||
.padding(.horizontal, 24)
|
.padding(.horizontal, 24)
|
||||||
.padding(.top, 20)
|
.padding(.top, 20)
|
||||||
.padding(.bottom, 16)
|
.padding(.bottom, 16)
|
||||||
|
.frame(maxWidth: .infinity)
|
||||||
|
.background(Color(NSColor.windowBackgroundColor))
|
||||||
|
|
||||||
Rectangle()
|
// Content Section
|
||||||
.fill(Color(NSColor.separatorColor))
|
Group {
|
||||||
.frame(height: 1)
|
if isReorderMode {
|
||||||
.padding(.horizontal, 24)
|
VStack(spacing: 12) {
|
||||||
|
List {
|
||||||
if isReorderMode {
|
ForEach(powerModeManager.configurations) { config in
|
||||||
VStack(spacing: 12) {
|
HStack(spacing: 12) {
|
||||||
List {
|
ZStack {
|
||||||
ForEach(powerModeManager.configurations) { config in
|
Circle()
|
||||||
HStack(spacing: 12) {
|
.fill(Color(NSColor.controlBackgroundColor))
|
||||||
ZStack {
|
.frame(width: 40, height: 40)
|
||||||
Circle()
|
Text(config.emoji)
|
||||||
.fill(Color(NSColor.controlBackgroundColor))
|
.font(.system(size: 20))
|
||||||
.frame(width: 40, height: 40)
|
|
||||||
Text(config.emoji)
|
|
||||||
.font(.system(size: 20))
|
|
||||||
}
|
|
||||||
|
|
||||||
Text(config.name)
|
|
||||||
.font(.system(size: 15, weight: .semibold))
|
|
||||||
|
|
||||||
Spacer()
|
|
||||||
|
|
||||||
HStack(spacing: 6) {
|
|
||||||
if config.isDefault {
|
|
||||||
Text("Default")
|
|
||||||
.font(.system(size: 11, weight: .medium))
|
|
||||||
.padding(.horizontal, 6)
|
|
||||||
.padding(.vertical, 2)
|
|
||||||
.background(Capsule().fill(Color.accentColor))
|
|
||||||
.foregroundColor(.white)
|
|
||||||
}
|
}
|
||||||
if !config.isEnabled {
|
|
||||||
Text("Disabled")
|
Text(config.name)
|
||||||
.font(.system(size: 11, weight: .medium))
|
.font(.system(size: 15, weight: .semibold))
|
||||||
.padding(.horizontal, 8)
|
|
||||||
.padding(.vertical, 4)
|
|
||||||
.background(Capsule().fill(Color(NSColor.controlBackgroundColor)))
|
|
||||||
.overlay(
|
|
||||||
Capsule().stroke(Color(NSColor.separatorColor), lineWidth: 0.5)
|
|
||||||
)
|
|
||||||
.foregroundColor(.secondary)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.padding(.vertical, 12)
|
|
||||||
.padding(.horizontal, 14)
|
|
||||||
.background(CardBackground(isSelected: false))
|
|
||||||
.listRowInsets(EdgeInsets())
|
|
||||||
.listRowBackground(Color.clear)
|
|
||||||
.listRowSeparator(.hidden)
|
|
||||||
.padding(.vertical, 6)
|
|
||||||
}
|
|
||||||
.onMove(perform: powerModeManager.moveConfigurations)
|
|
||||||
}
|
|
||||||
.listStyle(.plain)
|
|
||||||
.listRowSeparator(.hidden)
|
|
||||||
.scrollContentBackground(.hidden)
|
|
||||||
.background(Color(NSColor.controlBackgroundColor))
|
|
||||||
}
|
|
||||||
.padding(.horizontal, 24)
|
|
||||||
.padding(.vertical, 20)
|
|
||||||
} else {
|
|
||||||
GeometryReader { geometry in
|
|
||||||
ScrollView {
|
|
||||||
VStack(spacing: 0) {
|
|
||||||
if powerModeManager.configurations.isEmpty {
|
|
||||||
VStack(spacing: 24) {
|
|
||||||
Spacer()
|
Spacer()
|
||||||
.frame(height: geometry.size.height * 0.2)
|
|
||||||
|
HStack(spacing: 6) {
|
||||||
VStack(spacing: 16) {
|
if config.isDefault {
|
||||||
Image(systemName: "square.grid.2x2.fill")
|
Text("Default")
|
||||||
.font(.system(size: 48, weight: .regular))
|
.font(.system(size: 11, weight: .medium))
|
||||||
.foregroundColor(.secondary.opacity(0.6))
|
.padding(.horizontal, 6)
|
||||||
|
.padding(.vertical, 2)
|
||||||
VStack(spacing: 8) {
|
.background(Capsule().fill(Color.accentColor))
|
||||||
Text("No Power Modes Yet")
|
.foregroundColor(.white)
|
||||||
.font(.system(size: 20, weight: .medium))
|
}
|
||||||
.foregroundColor(.primary)
|
if !config.isEnabled {
|
||||||
|
Text("Disabled")
|
||||||
Text("Create first power mode to automate your VoiceInk workflow based on apps/website you are using")
|
.font(.system(size: 11, weight: .medium))
|
||||||
.font(.system(size: 14))
|
.padding(.horizontal, 8)
|
||||||
|
.padding(.vertical, 4)
|
||||||
|
.background(Capsule().fill(Color(NSColor.controlBackgroundColor)))
|
||||||
|
.overlay(
|
||||||
|
Capsule().stroke(Color(NSColor.separatorColor), lineWidth: 0.5)
|
||||||
|
)
|
||||||
.foregroundColor(.secondary)
|
.foregroundColor(.secondary)
|
||||||
.multilineTextAlignment(.center)
|
|
||||||
.lineSpacing(2)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Spacer()
|
|
||||||
}
|
}
|
||||||
.frame(maxWidth: .infinity)
|
.padding(.vertical, 12)
|
||||||
.frame(minHeight: geometry.size.height)
|
.padding(.horizontal, 14)
|
||||||
} else {
|
.background(CardBackground(isSelected: false))
|
||||||
VStack(spacing: 0) {
|
.listRowInsets(EdgeInsets())
|
||||||
PowerModeConfigurationsGrid(
|
.listRowBackground(Color.clear)
|
||||||
powerModeManager: powerModeManager,
|
.listRowSeparator(.hidden)
|
||||||
onEditConfig: { config in
|
.padding(.vertical, 6)
|
||||||
configurationMode = .edit(config)
|
}
|
||||||
navigationPath.append(configurationMode!)
|
.onMove(perform: powerModeManager.moveConfigurations)
|
||||||
|
}
|
||||||
|
.listStyle(.plain)
|
||||||
|
.listRowSeparator(.hidden)
|
||||||
|
.scrollContentBackground(.hidden)
|
||||||
|
.background(Color(NSColor.controlBackgroundColor))
|
||||||
|
}
|
||||||
|
.padding(.horizontal, 16)
|
||||||
|
.padding(.vertical, 20)
|
||||||
|
} else {
|
||||||
|
GeometryReader { geometry in
|
||||||
|
ScrollView {
|
||||||
|
VStack(spacing: 0) {
|
||||||
|
if powerModeManager.configurations.isEmpty {
|
||||||
|
VStack(spacing: 24) {
|
||||||
|
Spacer()
|
||||||
|
.frame(height: geometry.size.height * 0.2)
|
||||||
|
|
||||||
|
VStack(spacing: 16) {
|
||||||
|
Image(systemName: "square.grid.2x2.fill")
|
||||||
|
.font(.system(size: 48, weight: .regular))
|
||||||
|
.foregroundColor(.secondary.opacity(0.6))
|
||||||
|
|
||||||
|
VStack(spacing: 8) {
|
||||||
|
Text("No Power Modes Yet")
|
||||||
|
.font(.system(size: 20, weight: .medium))
|
||||||
|
.foregroundColor(.primary)
|
||||||
|
|
||||||
|
Text("Create first power mode to automate your VoiceInk workflow based on apps/website you are using")
|
||||||
|
.font(.system(size: 14))
|
||||||
|
.foregroundColor(.secondary)
|
||||||
|
.multilineTextAlignment(.center)
|
||||||
|
.lineSpacing(2)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
)
|
|
||||||
.padding(.horizontal, 24)
|
Spacer()
|
||||||
.padding(.vertical, 20)
|
}
|
||||||
|
.frame(maxWidth: .infinity)
|
||||||
Spacer()
|
.frame(minHeight: geometry.size.height)
|
||||||
.frame(height: 40)
|
} else {
|
||||||
|
VStack(spacing: 0) {
|
||||||
|
PowerModeConfigurationsGrid(
|
||||||
|
powerModeManager: powerModeManager,
|
||||||
|
onEditConfig: { config in
|
||||||
|
configurationMode = .edit(config)
|
||||||
|
navigationPath.append(configurationMode!)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.padding(.horizontal, 24)
|
||||||
|
.padding(.vertical, 20)
|
||||||
|
|
||||||
|
Spacer()
|
||||||
|
.frame(height: 40)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.frame(maxWidth: .infinity, maxHeight: .infinity)
|
||||||
|
.background(Color(NSColor.controlBackgroundColor))
|
||||||
}
|
}
|
||||||
.background(Color(NSColor.controlBackgroundColor))
|
.background(Color(NSColor.controlBackgroundColor))
|
||||||
.navigationDestination(for: ConfigurationMode.self) { mode in
|
.navigationDestination(for: ConfigurationMode.self) { mode in
|
||||||
@ -259,11 +263,9 @@ struct PowerModeView: View {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// New component for section headers
|
|
||||||
struct SectionHeader: View {
|
struct SectionHeader: View {
|
||||||
let title: String
|
let title: String
|
||||||
|
|
||||||
var body: some View {
|
var body: some View {
|
||||||
Text(title)
|
Text(title)
|
||||||
.font(.system(size: 16, weight: .bold))
|
.font(.system(size: 16, weight: .bold))
|
||||||
|
|||||||
@ -65,7 +65,6 @@ struct PowerModeConfigurationsGrid: View {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.padding(.horizontal)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -186,7 +185,7 @@ struct ConfigurationRow: View {
|
|||||||
.font(.caption2)
|
.font(.caption2)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if websiteCount > 0 {
|
if websiteCount > 0 {
|
||||||
HStack(spacing: 4) {
|
HStack(spacing: 4) {
|
||||||
Image(systemName: "globe")
|
Image(systemName: "globe")
|
||||||
@ -196,6 +195,7 @@ struct ConfigurationRow: View {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.padding(.top, 2)
|
||||||
.foregroundColor(.secondary)
|
.foregroundColor(.secondary)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -213,7 +213,6 @@ struct ConfigurationRow: View {
|
|||||||
|
|
||||||
if selectedModel != nil || selectedLanguage != nil || config.isAIEnhancementEnabled || config.isAutoSendEnabled {
|
if selectedModel != nil || selectedLanguage != nil || config.isAIEnhancementEnabled || config.isAutoSendEnabled {
|
||||||
Divider()
|
Divider()
|
||||||
.padding(.horizontal, 16)
|
|
||||||
|
|
||||||
HStack(spacing: 8) {
|
HStack(spacing: 8) {
|
||||||
if let model = selectedModel, model != "Default" {
|
if let model = selectedModel, model != "Default" {
|
||||||
@ -223,8 +222,8 @@ struct ConfigurationRow: View {
|
|||||||
Text(model)
|
Text(model)
|
||||||
.font(.caption)
|
.font(.caption)
|
||||||
}
|
}
|
||||||
.padding(.horizontal, 8)
|
.padding(.horizontal, 6)
|
||||||
.padding(.vertical, 4)
|
.padding(.vertical, 2)
|
||||||
.background(Capsule()
|
.background(Capsule()
|
||||||
.fill(Color(NSColor.controlBackgroundColor)))
|
.fill(Color(NSColor.controlBackgroundColor)))
|
||||||
.overlay(
|
.overlay(
|
||||||
@ -240,8 +239,8 @@ struct ConfigurationRow: View {
|
|||||||
Text(language)
|
Text(language)
|
||||||
.font(.caption)
|
.font(.caption)
|
||||||
}
|
}
|
||||||
.padding(.horizontal, 8)
|
.padding(.horizontal, 6)
|
||||||
.padding(.vertical, 4)
|
.padding(.vertical, 2)
|
||||||
.background(Capsule()
|
.background(Capsule()
|
||||||
.fill(Color(NSColor.controlBackgroundColor)))
|
.fill(Color(NSColor.controlBackgroundColor)))
|
||||||
.overlay(
|
.overlay(
|
||||||
@ -257,8 +256,8 @@ struct ConfigurationRow: View {
|
|||||||
Text(modelName.count > 20 ? String(modelName.prefix(18)) + "..." : modelName)
|
Text(modelName.count > 20 ? String(modelName.prefix(18)) + "..." : modelName)
|
||||||
.font(.caption)
|
.font(.caption)
|
||||||
}
|
}
|
||||||
.padding(.horizontal, 8)
|
.padding(.horizontal, 6)
|
||||||
.padding(.vertical, 4)
|
.padding(.vertical, 2)
|
||||||
.background(Capsule()
|
.background(Capsule()
|
||||||
.fill(Color(NSColor.controlBackgroundColor)))
|
.fill(Color(NSColor.controlBackgroundColor)))
|
||||||
.overlay(
|
.overlay(
|
||||||
@ -274,8 +273,8 @@ struct ConfigurationRow: View {
|
|||||||
Text("Auto Send")
|
Text("Auto Send")
|
||||||
.font(.caption)
|
.font(.caption)
|
||||||
}
|
}
|
||||||
.padding(.horizontal, 8)
|
.padding(.horizontal, 6)
|
||||||
.padding(.vertical, 4)
|
.padding(.vertical, 2)
|
||||||
.background(Capsule()
|
.background(Capsule()
|
||||||
.fill(Color(NSColor.controlBackgroundColor)))
|
.fill(Color(NSColor.controlBackgroundColor)))
|
||||||
.overlay(
|
.overlay(
|
||||||
@ -291,8 +290,8 @@ struct ConfigurationRow: View {
|
|||||||
Text("Context Awareness")
|
Text("Context Awareness")
|
||||||
.font(.caption)
|
.font(.caption)
|
||||||
}
|
}
|
||||||
.padding(.horizontal, 8)
|
.padding(.horizontal, 6)
|
||||||
.padding(.vertical, 4)
|
.padding(.vertical, 2)
|
||||||
.background(Capsule()
|
.background(Capsule()
|
||||||
.fill(Color(NSColor.controlBackgroundColor)))
|
.fill(Color(NSColor.controlBackgroundColor)))
|
||||||
.overlay(
|
.overlay(
|
||||||
@ -307,8 +306,8 @@ struct ConfigurationRow: View {
|
|||||||
Text(selectedPrompt?.title ?? "AI")
|
Text(selectedPrompt?.title ?? "AI")
|
||||||
.font(.caption)
|
.font(.caption)
|
||||||
}
|
}
|
||||||
.padding(.horizontal, 8)
|
.padding(.horizontal, 6)
|
||||||
.padding(.vertical, 4)
|
.padding(.vertical, 2)
|
||||||
.background(Capsule()
|
.background(Capsule()
|
||||||
.fill(Color.accentColor.opacity(0.1)))
|
.fill(Color.accentColor.opacity(0.1)))
|
||||||
.foregroundColor(.accentColor)
|
.foregroundColor(.accentColor)
|
||||||
@ -316,10 +315,13 @@ struct ConfigurationRow: View {
|
|||||||
|
|
||||||
Spacer()
|
Spacer()
|
||||||
}
|
}
|
||||||
.padding(.vertical, 10)
|
|
||||||
|
.padding(.vertical, 6)
|
||||||
.padding(.horizontal, 16)
|
.padding(.horizontal, 16)
|
||||||
|
.background(Color.secondary.opacity(0.1))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.clipShape(RoundedRectangle(cornerRadius: 16))
|
||||||
.background(CardBackground(isSelected: isEditing))
|
.background(CardBackground(isSelected: isEditing))
|
||||||
.opacity(config.isEnabled ? 1.0 : 0.5)
|
.opacity(config.isEnabled ? 1.0 : 0.5)
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user