Specify accent color in style

This commit is contained in:
Christoph Hagen 2023-08-23 16:17:34 +02:00
parent cd37df22bf
commit c9ab73c4ae
10 changed files with 48 additions and 25 deletions

View File

@ -12,10 +12,13 @@ struct CV: View {
var body: some View { var body: some View {
VStack { VStack {
TopView(info: info.top, style: style.header) TopView(
info: info.top,
style: style.header,
accent: style.accentColor)
.frame(height: style.header.height) .frame(height: style.header.height)
Rectangle() Rectangle()
.fill(Color.accentColor) .fill(style.accentColor)
.frame(height: style.header.lineWidth) .frame(height: style.header.lineWidth)
GeometryReader { geo in GeometryReader { geo in
let columnWidth = max(0, (geo.size.width - twoColumnSpacing)) / 2 let columnWidth = max(0, (geo.size.width - twoColumnSpacing)) / 2
@ -23,9 +26,11 @@ struct CV: View {
VStack(alignment: .leading) { VStack(alignment: .leading) {
TitledCareerSection( TitledCareerSection(
style: style.section, style: style.section,
accent: style.accentColor,
content: info.work) content: info.work)
TitledCareerSection( TitledCareerSection(
style: style.section, style: style.section,
accent: style.accentColor,
content: info.education) content: info.education)
}.frame(width: columnWidth) }.frame(width: columnWidth)
VStack(alignment: .leading) { VStack(alignment: .leading) {
@ -36,7 +41,8 @@ struct CV: View {
PublicationView( PublicationView(
info: item, info: item,
borderSpacing: style.section.borderSpacing, borderSpacing: style.section.borderSpacing,
borderWidth: style.section.borderWidth) borderWidth: style.section.borderWidth,
accent: style.accentColor)
.padding(.bottom, style.section.bottomSpacing) .padding(.bottom, style.section.bottomSpacing)
} }
} }

View File

@ -59,7 +59,9 @@ struct ContentView: View {
Toggle("Dark mode", isOn: $darkModeEnabled) Toggle("Dark mode", isOn: $darkModeEnabled)
.toggleStyle(SwitchToggleStyle()) .toggleStyle(SwitchToggleStyle())
} }
.padding() .padding([.top, .trailing])
.padding(.leading, 6)
.padding(.bottom, 4)
ScrollView(.vertical) { ScrollView(.vertical) {
CV(info: info, style: style) CV(info: info, style: style)
}.frame(width: style.pageWidth) }.frame(width: style.pageWidth)

View File

@ -3,6 +3,7 @@ import SwiftUI
let cvStyle = CVStyle( let cvStyle = CVStyle(
pageWidth: 600, pageWidth: 600,
accentColor: .init(244, 144, 0),
header: HeaderStyle( header: HeaderStyle(
height: 100, height: 100,
lineWidth: 1, lineWidth: 1,

View File

@ -9,14 +9,15 @@ struct CareerStationView: View {
let borderWidth: CGFloat let borderWidth: CGFloat
let accent: Color
var body: some View { var body: some View {
LeftBorderView(color: .accentColor, spacing: borderSpacing, borderWidth: borderWidth) { LeftBorderView(color: accent, spacing: borderSpacing, borderWidth: borderWidth) {
VStack(alignment: .leading) { VStack(alignment: .leading) {
HStack { HStack {
RightImageLabel(info.time, systemSymbol: .calendar) RightImageLabel(info.time, systemSymbol: .calendar)
.padding(.leading, -4)
Spacer() Spacer()
RightImageLabel(info.location, systemSymbol: .pin) RightImageLabel(info.location, systemSymbol: .house)
} }
.font(.caption) .font(.caption)
.foregroundColor(.secondary) .foregroundColor(.secondary)
@ -26,7 +27,7 @@ struct CareerStationView: View {
if let subtitle = info.subtitle { if let subtitle = info.subtitle {
Text(subtitle) Text(subtitle)
.font(.subheadline) .font(.subheadline)
.foregroundColor(.accentColor) .foregroundColor(accent)
} }
if let text = info.text { if let text = info.text {
Text(text) Text(text)
@ -40,14 +41,16 @@ struct CareerStationView: View {
struct CareerStationView_Previews: PreviewProvider { struct CareerStationView_Previews: PreviewProvider {
static var previews: some View { static var previews: some View {
CareerStationView(info: .init( CareerStationView(
time: "Jul 2020 - Jul 2023", info: .init(
location: "Braunschweig, Germany", time: "Jul 2020 - Jul 2023",
title: "German Aerospace Center", location: "Braunschweig, Germany",
subtitle: "Systems engineer", title: "German Aerospace Center",
text: "Responsible for aircraft systems and avionics of a high-altitude solar drone, safety, and software."), subtitle: "Systems engineer",
borderSpacing: 5, text: "Responsible for aircraft systems and avionics of a high-altitude solar drone, safety, and software."),
borderWidth: 3) borderSpacing: 5,
borderWidth: 3,
accent: .orange)
.previewLayout(.fixed(width: 300, height: 100)) .previewLayout(.fixed(width: 300, height: 100))
} }
} }

View File

@ -8,8 +8,10 @@ struct PublicationView: View {
let borderWidth: CGFloat let borderWidth: CGFloat
let accent: Color
var body: some View { var body: some View {
LeftBorderView(color: .accentColor, spacing: borderSpacing, borderWidth: borderWidth) { LeftBorderView(color: accent, spacing: borderSpacing, borderWidth: borderWidth) {
VStack(alignment: .leading) { VStack(alignment: .leading) {
Text(info.venue) Text(info.venue)
.font(.caption) .font(.caption)
@ -28,6 +30,7 @@ struct PublicationView_Previews: PreviewProvider {
venue: "My venue", venue: "My venue",
title: "The publication title"), title: "The publication title"),
borderSpacing: 5, borderSpacing: 5,
borderWidth: 3) borderWidth: 3,
accent: .orange)
} }
} }

View File

@ -13,7 +13,7 @@ struct LeftImageLabel: View {
} }
var body: some View { var body: some View {
HStack(spacing: 0) { HStack(alignment: .firstTextBaseline, spacing: 0) {
Text(text) Text(text)
Image(systemSymbol: systemSymbol) Image(systemSymbol: systemSymbol)
.frame(width: 20) .frame(width: 20)

View File

@ -13,9 +13,9 @@ struct RightImageLabel: View {
} }
var body: some View { var body: some View {
HStack(spacing: 0) { HStack(alignment: .firstTextBaseline, spacing: 3) {
Image(systemSymbol: systemSymbol) Image(systemSymbol: systemSymbol)
.frame(width: 20) .aspectRatio(1, contentMode: .fill)
Text(text) Text(text)
} }
} }

View File

@ -4,6 +4,8 @@ struct TitledCareerSection: View {
let style: CVStyle.Section let style: CVStyle.Section
let accent: Color
let content: Titled<CareerStation> let content: Titled<CareerStation>
var body: some View { var body: some View {
@ -12,7 +14,8 @@ struct TitledCareerSection: View {
CareerStationView( CareerStationView(
info: item, info: item,
borderSpacing: style.borderSpacing, borderSpacing: style.borderSpacing,
borderWidth: style.borderWidth) borderWidth: style.borderWidth,
accent: accent)
.padding(.bottom, style.bottomSpacing) .padding(.bottom, style.bottomSpacing)
} }
} }
@ -23,6 +26,7 @@ struct TitledItemSection_Previews: PreviewProvider {
static var previews: some View { static var previews: some View {
TitledCareerSection( TitledCareerSection(
style: .init(), style: .init(),
accent: .orange,
content: .init( content: .init(
title: "Work experience", title: "Work experience",
items: [ items: [

View File

@ -7,6 +7,8 @@ struct TopView: View {
let style: HeaderStyle let style: HeaderStyle
let accent: Color
var body: some View { var body: some View {
GeometryReader { geo in GeometryReader { geo in
let sideWidth = max(0, (geo.size.width - geo.size.height) / 2) let sideWidth = max(0, (geo.size.width - geo.size.height) / 2)
@ -14,7 +16,7 @@ struct TopView: View {
VStack(alignment: .leading, spacing: 0) { VStack(alignment: .leading, spacing: 0) {
Text(info.name) Text(info.name)
.font(.title) .font(.title)
.foregroundColor(.accentColor) .foregroundColor(accent)
Spacer(minLength: 0) Spacer(minLength: 0)
Text(info.tagLine) Text(info.tagLine)
.font(.subheadline) .font(.subheadline)
@ -22,7 +24,6 @@ struct TopView: View {
Spacer(minLength: 0) Spacer(minLength: 0)
HStack { HStack {
RightImageLabel(info.place, systemSymbol: .house) RightImageLabel(info.place, systemSymbol: .house)
.padding(.leading, -4)
RightImageLabel(info.ageText, systemSymbol: .hourglass) RightImageLabel(info.ageText, systemSymbol: .hourglass)
Spacer() Spacer()
}.font(.subheadline) }.font(.subheadline)
@ -71,7 +72,8 @@ struct TopView_Previews: PreviewProvider {
email: "jobs@christophhagen.de", email: "jobs@christophhagen.de",
phone: "Upon Request", phone: "Upon Request",
github: "github.com/christophhagen"), github: "github.com/christophhagen"),
style: HeaderStyle()) style: HeaderStyle(),
accent: .orange)
.previewLayout(.fixed(width: 540, height: 120)) .previewLayout(.fixed(width: 540, height: 120))
} }
} }

View File

@ -26,6 +26,8 @@ struct CVStyle {
let pageWidth: CGFloat let pageWidth: CGFloat
let accentColor: Color
let header: HeaderStyle let header: HeaderStyle
let columnSpacing: CGFloat let columnSpacing: CGFloat