@@ -10,8 +10,6 @@ public struct HomePage: Page {
1010 public init ( ) { }
1111
1212 public var head : some HTML {
13- meta ( name: . viewport, content: " width=device-width, initial-scale=1.0 " )
14- BaseStylings ( )
1513 /// Xcode Styling
1614 style { HTMLRaw ( " .xml .hljs-meta{color:#6C7986}.hljs-comment,.hljs-quote{color:#6C7986}.hljs-tag,.hljs-attribute,.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-name{color:#FC5FA3}.hljs-variable,.hljs-template-variable{color:#FC5FA3}.hljs-code,.hljs-string,.hljs-meta-string{color:#FC6A5D}.hljs-regexp,.hljs-link{color:#5482FF}.hljs-title,.hljs-symbol,.hljs-bullet,.hljs-number{color:#41A1C0}.hljs-section,.hljs-meta{color:#FC5FA3}.hljs-class .hljs-title,.hljs-type,.hljs-built_in,.hljs-builtin-name,.hljs-params{color:#D0A8FF}.hljs-attr{color:#BF8555}.hljs-subst{color:#FFF}.hljs-formula{font-style:italic}.hljs-selector-id,.hljs-selector-class{color:#9b703f}.hljs-doctag,.hljs-strong{font-weight:bold}.hljs-emphasis{font-style:italic} " ) }
1715 script ( . src( " https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js " ) , . defer)
@@ -24,23 +22,29 @@ public struct HomePage: Page {
2422
2523 public var body : some HTML {
2624 div ( . v. scope ( " { showCode: true, selection: undefined } " ) ) {
25+ HeaderView ( )
26+ Spacer ( )
2727 main {
28- Spacer ( )
2928 UserView ( )
3029 Spacer ( )
3130 PostsView ( )
32- Spacer ( )
3331 }
32+ Spacer ( )
3433 FooterView ( )
3534 }
35+ . inlineStyle ( " overflow-x " , " hidden " )
3636 . inlineStyle ( " background-color " , " #1c1c1c " )
3737 . inlineStyle ( " color " , " #fafafa " )
3838 . inlineStyle ( " font-optical-sizing " , " auto " )
39- . inlineStyle ( " font-size " , " 0.9em " )
40- . inlineStyle ( " font-size " , " 0.8em " , media: . maxWidth( 480 ) )
41- . inlineStyle ( " font-size " , " 0.7em " , media: . maxWidth( 380 ) )
39+ . inlineStyle ( " font-size " , " 0.7em " )
40+ . inlineStyle ( " font-size " , " 0.8em " , media: . minWidth( 390 ) )
41+ . inlineStyle ( " font-size " , " 0.9em " , media: . minWidth( 480 ) )
42+ }
4243
43- VueScript ( )
44+ struct HeaderView : HTML {
45+ var content : some HTML {
46+ EmptyHTML ( )
47+ }
4448 }
4549
4650 struct FooterView : HTML {
@@ -76,18 +80,10 @@ public struct HomePage: Page {
7680private struct SectionView < Body: HTML > : HTML {
7781 let codeTag : String
7882 let codeHeader : String
79- let body : ( ) -> Body
80- private let id : String
81-
82- init (
83- codeTag: String ,
84- codeHeader: String ,
85- @HTMLBuilder body: @escaping ( ) -> Body
86- ) {
87- self . codeTag = codeTag
88- self . codeHeader = codeHeader
89- self . body = body
90- self . id = codeTag. enumerated ( ) . flatMap { idx, char in
83+ @HTMLBuilder let body : ( ) -> Body
84+
85+ private var id : String {
86+ codeTag. enumerated ( ) . flatMap { idx, char in
9187 [
9288 char. isUppercase && idx > 0 ? " - " : nil ,
9389 String ( char) . lowercased ( ) ,
@@ -101,17 +97,8 @@ private struct SectionView<Body: HTML>: HTML {
10197 section ( . id( self . id) ) {
10298 div {
10399 header {
104- CodeTag ( id: self . id, tag: self . codeTag)
105- pre {
106- code ( . class( " hljs language-swift " ) ) {
107- """
108- /// \( self . codeTag) .swift
109- /// Portfolio
110- \( self . codeHeader)
111- """
112- }
113- }
114- . inlineStyle ( " padding " , " 0 1.5rem 1.5rem " )
100+ CodeTag ( id: self . id, codeTag: self . codeTag)
101+ CodeHeader ( codeTag: self . codeTag, codeHeader: self . codeHeader)
115102 }
116103
117104 self . body ( )
@@ -121,24 +108,39 @@ private struct SectionView<Body: HTML>: HTML {
121108 . wrappedStyling ( )
122109 }
123110
124- private struct CodeTag : HTML {
125- var id : String
126- var tag : String
111+ struct CodeTag : HTML {
112+ let id : String
113+ let codeTag : String
127114
128115 var content : some HTML {
129116 pre {
130117 a ( . href( " # \( self . id) " ) ) {
131- code { " \( self . tag) .swift " }
132- . inlineStyle ( " display " , " block " )
133- . inlineStyle ( " color " , " #777 " )
134- . inlineStyle ( " text-align " , " end " )
135- . inlineStyle ( " font-size " , " 0.75em " )
136- . inlineStyle ( " font-weight " , " 500 " )
137- . inlineStyle ( " font-family " , " \" CommitMono \" , monospace " )
138- . inlineStyle ( " padding " , " 1.5rem 1.5rem 0.75rem " )
118+ code { " \( self . codeTag) .swift " }
139119 }
140- . inlineStyle ( " text-decoration " , " none " )
120+ . inlineStyle ( " color " , " #777 " )
141121 }
122+ . inlineStyle ( " font-size " , " 0.75em " )
123+ . inlineStyle ( " font-weight " , " 500 " )
124+ . inlineStyle ( " text-align " , " end " )
125+ . inlineStyle ( " padding " , " 1.5rem 1.5rem 0 " )
126+ }
127+ }
128+
129+ struct CodeHeader : HTML {
130+ let codeTag : String
131+ let codeHeader : String
132+
133+ var content : some HTML {
134+ pre {
135+ code ( . class( " hljs language-swift " ) ) {
136+ """
137+ /// \( self . codeTag) .swift
138+ /// Portfolio
139+ \( self . codeHeader)
140+ """
141+ }
142+ }
143+ . inlineStyle ( " padding " , " 0.75rem 1.5rem 1.5rem " )
142144 }
143145 }
144146}
@@ -194,95 +196,19 @@ private struct UserView: HTML {
194196 }
195197 }
196198
197- // code(.data("highlighted", value: "yes"), .class("hljs language-swift")) {
198- // span(.class("hljs-comment")) { "/// User.swift\n" }
199- // span(.class("hljs-comment")) { "/// Portfolio\n" }
200- // span(.class("hljs-keyword")) { "struct" }
201- // " "
202- // span(.class("hljs-title class_")) { "User" }
203- // ": "
204- // span(.class("hljs-title class_")) { "Portfolio" }
205- // " {\n "
206-
207- // span(.class("hljs-keyword")) { "let" }
208- // " name = "
209- // span(.class("hljs-string")) {
210- // "\""
211- // span(.class("hero-title")) { "Erik Bautista Santibanez" }
212- // "\""
213- // }
214- // "\n "
215-
216- // span(.class("hljs-keyword")) { "let" }
217- // " role = "
218- // span(.class("hljs-string")) {
219- // "\""
220- // span(.class("hero-subtitle")) { "Mobile & Web Developer" }
221- // "\""
222- // }
223- // "\n "
224-
225- // span(.class("hljs-keyword")) { "let" }
226- // " home = "
227- // span(.class("hljs-string")) {
228- // "\""
229- // span { self.residency }
230- // .inlineStyle("color", "#D0D0D0")
231- // "\""
232- // }
233- // "\n"
234- // self.location
235- // "}"
236- // }
237-
238- // @HTMLBuilder
239- // var residency: some HTML {
240- // let location = self.activityClient.location()
241- // let residency = location?.residency ?? .default
242-
243199 // svg(.xmlns(), .fill("currentColor"), .viewBox("0 0 256 256"), .aria.label("Map pin icon")) {
244200 // path(
245201 // .d("M128,16a88.1,88.1,0,0,0-88,88c0,75.3,80,132.17,83.41,134.55a8,8,0,0,0,9.18,0C136,236.17,216,179.3,216,104A88.1,88.1,0,0,0,128,16Zm0,56a32,32,0,1,1-32,32A32,32,0,0,1,128,72Z")
246202 // )
247203 // }
248204 // .svgIconStyling()
249- // " \(residency)"
250- // }
251-
252- // @HTMLBuilder
253- // var location: some HTML {
254- // let location = self.activityClient.location()
255- // let residency = location?.residency ?? .default
256-
257- // if let location, location.city != residency.city || location.state != residency.state {
258- // " "
259- // span(.class("hljs-keyword")) { "let" }
260- // " location = "
261- // span(.class("hljs-string")) {
262- // "\""
263- // span(.aria.label("Location")) {
264- // svg(.xmlns(), .fill("currentColor"), .viewBox("0 0 256 256"), .aria.label("Navigation icon")) {
265- // path(.d("M234.35,129,152,152,129,234.35a8,8,0,0,1-15.21.27l-65.28-176A8,8,0,0,1,58.63,48.46l176,65.28A8,8,0,0,1,234.35,129Z"))
266- // path(.d("M237.33,106.21,61.41,41l-.16-.05A16,16,0,0,0,40.9,61.25a1,1,0,0,0,.05.16l65.26,175.92A15.77,15.77,0,0,0,121.28,248h.3a15.77,15.77,0,0,0,15-11.29l.06-.2,21.84-78,78-21.84.2-.06a16,16,0,0,0,.62-30.38ZM149.84,144.3a8,8,0,0,0-5.54,5.54L121.3,232l-.06-.17L56,56l175.82,65.22.16.06Z"))
267- // }
268- // .inlineStyle("scale", "calc(100% * -1) 100%")
269- // .svgIconStyling()
270-
271- // " Currently in "
272-
273- // b {
274- // [location.city, location.state, location.region == "United States" ? nil : location.region]
275- // .compactMap(\.self)
276- // .jo: ReversedCollection<[Post]>.Elementined(separator: ", ")
277- // }
278- // }
279- // .inlineStyle("color", "#D0D0D0")
280- // "\"\n"
281- // }
282- // } else {
283- // EmptyHTML()
205+
206+ // svg(.xmlns(), .fill("currentColor"), .viewBox("0 0 256 256"), .aria.label("Navigation icon")) {
207+ // path(.d("M234.35,129,152,152,129,234.35a8,8,0,0,1-15.21.27l-65.28-176A8,8,0,0,1,58.63,48.46l176,65.28A8,8,0,0,1,234.35,129Z"))
208+ // path(.d("M237.33,106.21,61.41,41l-.16-.05A16,16,0,0,0,40.9,61.25a1,1,0,0,0,.05.16l65.26,175.92A15.77,15.77,0,0,0,121.28,248h.3a15.77,15.77,0,0,0,15-11.29l.06-.2,21.84-78,78-21.84.2-.06a16,16,0,0,0,.62-30.38ZM149.84,144.3a8,8,0,0,0-5.54,5.54L121.3,232l-.06-.17L56,56l175.82,65.22.16.06Z"))
284209 // }
285- // }
210+ // .inlineStyle("scale", "calc(100% * -1) 100%")
211+ // .svgIconStyling()
286212}
287213
288214private struct PostsView : HTML {
@@ -291,7 +217,7 @@ private struct PostsView: HTML {
291217 SectionView (
292218 codeTag: " DevLogs " ,
293219 codeHeader: """
294- var logs: [DevLog] = try await fetch(.all)
220+ var logs: [DevLog] = await fetch(.all)
295221 """
296222 ) {
297223 for (num, post) in Post . allCases. enumerated ( ) . reversed ( ) {
@@ -412,7 +338,7 @@ private struct PostsView: HTML {
412338 . inlineStyle ( " margin-top " , " 1.25rem " , post: " > * " )
413339 . inlineStyle ( " margin-bottom " , " 1.25rem " , post: " > * " )
414340 . inlineStyle ( " border " , " 1.5px solid #3A3A3A " , post: " > * " )
415- . inlineStyle ( " border-radius " , " 0.85rem " , post: " > * " )
341+ . inlineStyle ( " border-radius " , " 1rem " , post: " > * " )
416342 . postCodeBlockStyling ( )
417343 }
418344 }
@@ -487,7 +413,7 @@ private extension HTML where Tag: HTMLTrait.Attributes.Global {
487413 self . inlineStyle ( " padding " , " 0.75rem " , post: " pre " )
488414 . inlineStyle ( " background " , " #242424 " , post: " pre " )
489415 . inlineStyle ( " border " , " 1.5px solid #3A3A3A " , post: " pre " )
490- . inlineStyle ( " border-radius " , " 0.5rem " , post: " pre " )
416+ . inlineStyle ( " border-radius " , " 0.75rem " , post: " pre " )
491417 . inlineStyle ( " overflow-x " , " auto " , post: " pre " )
492418 . inlineStyle ( " font-size " , " 0.85em " , post: " pre " )
493419 }
0 commit comments