Specify accent color in style
This commit is contained in:
parent
cd37df22bf
commit
c9ab73c4ae
@ -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)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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)
|
||||||
|
@ -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,
|
||||||
|
@ -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))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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)
|
||||||
|
@ -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)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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: [
|
||||||
|
@ -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))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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
|
||||||
|
Loading…
Reference in New Issue
Block a user