howdy-jekyll-theme 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. checksums.yaml +7 -0
  2. data/AGENTS.md +49 -0
  3. data/Gemfile +11 -0
  4. data/LICENSE +21 -0
  5. data/README.md +431 -0
  6. data/_includes/analytics.html +19 -0
  7. data/_includes/blog-pagination.html +31 -0
  8. data/_includes/comments.html +46 -0
  9. data/_includes/dark-mode-toggle.html +18 -0
  10. data/_includes/head.html +137 -0
  11. data/_includes/hero-carousel.html +80 -0
  12. data/_includes/logo.html +5 -0
  13. data/_includes/navigation.html +24 -0
  14. data/_includes/newsletter.html +10 -0
  15. data/_includes/share-buttons.html +70 -0
  16. data/_includes/social-links.html +37 -0
  17. data/_includes/toc.html +29 -0
  18. data/_layouts/autopage_collection.html +43 -0
  19. data/_layouts/blog.html +42 -0
  20. data/_layouts/default.html +86 -0
  21. data/_layouts/home.html +5 -0
  22. data/_layouts/page.html +33 -0
  23. data/_layouts/post.html +76 -0
  24. data/_layouts/project.html +61 -0
  25. data/_plugins/sort_projects.rb +6 -0
  26. data/_plugins/user_colors.rb +68 -0
  27. data/_posts/2026-01-01-beyond-pixels.md +21 -0
  28. data/_posts/2026-01-02-collaboration.md +25 -0
  29. data/_posts/2026-01-03-design-feeling.md +25 -0
  30. data/_posts/2026-01-04-finding-inspiration.md +25 -0
  31. data/_posts/2026-01-05-freebies.md +35 -0
  32. data/_posts/2026-01-06-ux-research-methods.md +25 -0
  33. data/_posts/2026-01-07-color-theory.md +25 -0
  34. data/_posts/2026-01-08-responsive-design.md +25 -0
  35. data/_posts/2026-01-09-web-performance.md +25 -0
  36. data/_posts/2026-01-10-mobile-first.md +25 -0
  37. data/_posts/2026-04-15-crafting-visual-hierarchy.md +27 -0
  38. data/_posts/2026-04-16-building-design-systems.md +27 -0
  39. data/_posts/2026-04-18-accessibility-matters.md +25 -0
  40. data/_posts/2026-04-19-motion-design.md +29 -0
  41. data/_posts/2026-04-20-typography-basics.md +25 -0
  42. data/_posts/2026-04-22-product-design-best-practices.md +239 -0
  43. data/_projects/atlas.md +26 -0
  44. data/_projects/luminous.md +26 -0
  45. data/_projects/nova.md +31 -0
  46. data/_projects/osaka.md +26 -0
  47. data/_sass/_base.scss +181 -0
  48. data/_sass/_components.scss +767 -0
  49. data/_sass/_dark-mode.scss +39 -0
  50. data/_sass/_layout.scss +1033 -0
  51. data/_sass/_typography.scss +394 -0
  52. data/_sass/_user-colors.scss +1 -0
  53. data/_sass/_variables.scss +165 -0
  54. data/about.md +62 -0
  55. data/assets/css/main.scss +10 -0
  56. data/assets/css/swiper-bundle.min.css +13 -0
  57. data/assets/fonts/ChaumontScript-Regular.otf +0 -0
  58. data/assets/fonts/DMSans-Italic-Variable.ttf +0 -0
  59. data/assets/fonts/DMSans-Variable.ttf +0 -0
  60. data/assets/illustrations/analytics.svg +218 -0
  61. data/assets/illustrations/business-strategy.svg +161 -0
  62. data/assets/illustrations/designer.svg +267 -0
  63. data/assets/illustrations/email.svg +123 -0
  64. data/assets/illustrations/friends-taking-selfie.svg +189 -0
  65. data/assets/illustrations/launch.svg +230 -0
  66. data/assets/illustrations/love-animals.svg +83 -0
  67. data/assets/illustrations/meeting.svg +292 -0
  68. data/assets/illustrations/mobile-shopping.svg +113 -0
  69. data/assets/illustrations/online-shopping.svg +148 -0
  70. data/assets/illustrations/oops-something-went-wrong.svg +97 -0
  71. data/assets/illustrations/podcast.svg +199 -0
  72. data/assets/illustrations/presentation.svg +138 -0
  73. data/assets/illustrations/programmer.svg +240 -0
  74. data/assets/illustrations/task-management.svg +174 -0
  75. data/assets/illustrations/tasks-complete.svg +161 -0
  76. data/assets/illustrations/travel-booking-hotel.svg +214 -0
  77. data/assets/illustrations/video-call.svg +178 -0
  78. data/assets/images/apple-touch-icon.png +0 -0
  79. data/assets/images/favicon-dark.png +0 -0
  80. data/assets/images/favicon-light.png +0 -0
  81. data/assets/images/howdy-theme-dark.png +0 -0
  82. data/assets/images/howdy-theme-light.png +0 -0
  83. data/assets/images/og-image.png +0 -0
  84. data/assets/js/hero-carousel.js +36 -0
  85. data/assets/js/mobile-nav.js +62 -0
  86. data/assets/js/swiper-bundle.min.js +13 -0
  87. data/assets/js/swiper-bundle.min.js.map +1 -0
  88. data/assets/js/theme-toggle.js +54 -0
  89. data/assets/resume.pdf +683 -0
  90. data/contact.md +74 -0
  91. data/howdy-jekyll-theme.gemspec +25 -0
  92. data/lib/howdy-jekyll-theme.rb +19 -0
  93. metadata +245 -0
@@ -0,0 +1,394 @@
1
+ // Howdy Jekyll Theme - Typography
2
+
3
+ @use "variables" as *;
4
+
5
+ // Heading 1 — fluid responsive sizing
6
+ h1, .h1 {
7
+ font-family: var(--howdy-font-primary);
8
+ font-weight: 600;
9
+ line-height: 1.2;
10
+ color: var(--howdy-text-primary);
11
+ transition: var(--howdy-transition);
12
+ margin: 0;
13
+ margin-top: var(--howdy-spacing-md);
14
+ scroll-margin-top: 80px;
15
+
16
+ // Fluid: 24px at 360px → 56px at 1440px+
17
+ font-size: clamp(24px, 3vw + 13px, 56px);
18
+ letter-spacing: -0.02em;
19
+
20
+ @media (max-width: $howdy-lg) {
21
+ letter-spacing: -0.01em;
22
+ }
23
+
24
+ @media (max-width: $howdy-sm) {
25
+ letter-spacing: 0;
26
+ }
27
+ }
28
+
29
+ // Lists
30
+ ul, ol {
31
+ margin: 0;
32
+ padding: 0;
33
+ list-style: none;
34
+ max-width: 65ch;
35
+ }
36
+
37
+ ul {
38
+ li {
39
+ position: relative;
40
+ padding-left: 20px;
41
+ margin-bottom: 8px;
42
+ font-family: var(--howdy-font-primary);
43
+ font-weight: 400;
44
+ font-size: 16px;
45
+ line-height: 1.6;
46
+ color: var(--howdy-text-secondary);
47
+
48
+ @media (max-width: $howdy-xl) {
49
+ font-size: 15px;
50
+ }
51
+
52
+ &::before {
53
+ content: "";
54
+ position: absolute;
55
+ left: 0;
56
+ top: 10px;
57
+ width: 6px;
58
+ height: 6px;
59
+ border-radius: 50%;
60
+ background-color: var(--howdy-text-muted);
61
+ }
62
+
63
+ &:last-child {
64
+ margin-bottom: 0;
65
+ }
66
+ }
67
+ }
68
+
69
+ ol {
70
+ counter-reset: list-counter;
71
+
72
+ li {
73
+ position: relative;
74
+ padding-left: 28px;
75
+ margin-bottom: 8px;
76
+ font-family: var(--howdy-font-primary);
77
+ font-weight: 400;
78
+ font-size: 16px;
79
+ line-height: 1.6;
80
+ color: var(--howdy-text-secondary);
81
+ counter-increment: list-counter;
82
+
83
+ @media (max-width: $howdy-xl) {
84
+ font-size: 15px;
85
+ }
86
+
87
+ &::before {
88
+ content: counter(list-counter);
89
+ position: absolute;
90
+ left: 0;
91
+ top: 0;
92
+ font-size: 13px;
93
+ font-weight: 600;
94
+ line-height: 1.4;
95
+ color: var(--howdy-text-muted);
96
+ }
97
+
98
+ &:last-child {
99
+ margin-bottom: 0;
100
+ }
101
+ }
102
+ }
103
+
104
+ // Nested lists
105
+ ul ul, ol ol, ul ol, ol ul {
106
+ margin-top: 8px;
107
+ margin-bottom: 0;
108
+
109
+ li {
110
+ font-size: 15px;
111
+ line-height: 1.5;
112
+ }
113
+ }
114
+
115
+ ul ul {
116
+ li::before {
117
+ width: 5px;
118
+ height: 5px;
119
+ background-color: var(--howdy-text-muted);
120
+ opacity: 0.5;
121
+ }
122
+ }
123
+
124
+ // Heading 2 — fluid responsive sizing
125
+ h2, .h2 {
126
+ font-family: var(--howdy-font-primary);
127
+ font-weight: 600;
128
+ // Fluid: 24px at 360px → 40px at 1440px+
129
+ font-size: clamp(24px, 1.5vw + 19px, 40px);
130
+ line-height: 1.2;
131
+ color: var(--howdy-text-primary);
132
+ transition: var(--howdy-transition);
133
+ margin: 0;
134
+ letter-spacing: -0.01em;
135
+ scroll-margin-top: 80px;
136
+
137
+ @media (max-width: $howdy-md) {
138
+ letter-spacing: 0;
139
+ }
140
+ }
141
+
142
+ // Heading 3 — fluid responsive sizing
143
+ h3, .h3 {
144
+ font-family: var(--howdy-font-primary);
145
+ font-weight: 600;
146
+ // Fluid: 18px at 480px → 24px at 1440px+
147
+ font-size: clamp(18px, 0.6vw + 15px, 24px);
148
+ line-height: 1.3;
149
+ color: var(--howdy-text-primary);
150
+ transition: var(--howdy-transition);
151
+ margin: 0;
152
+ letter-spacing: -0.01em;
153
+ scroll-margin-top: 80px;
154
+
155
+ @media (max-width: $howdy-sm) {
156
+ letter-spacing: 0;
157
+ }
158
+ }
159
+
160
+ // Body text large — fluid responsive sizing
161
+ .body-large {
162
+ font-family: var(--howdy-font-primary);
163
+ font-weight: 500;
164
+ // Fluid: 15px at 360px → 21px at 1440px+
165
+ font-size: clamp(15px, 0.55vw + 13px, 21px);
166
+ line-height: 1.6;
167
+ color: var(--howdy-text-primary);
168
+ transition: var(--howdy-transition);
169
+ letter-spacing: -0.01em;
170
+
171
+ @media (max-width: $howdy-sm) {
172
+ letter-spacing: 0;
173
+ }
174
+ }
175
+
176
+ // Body text regular
177
+ p, .body-regular {
178
+ font-family: var(--howdy-font-primary);
179
+ font-weight: 400;
180
+ font-size: 16px;
181
+ line-height: 1.6; // Loose for body text (1.5-1.6)
182
+ color: var(--howdy-text-secondary);
183
+ transition: var(--howdy-transition);
184
+ margin: 0;
185
+ max-width: 65ch; // Optimal line length (50-75 chars)
186
+ }
187
+
188
+ // Small text
189
+ .small-text {
190
+ font-family: var(--howdy-font-primary);
191
+ font-weight: 500;
192
+ font-size: 14px;
193
+ line-height: 1.2em;
194
+ color: var(--howdy-text-primary);
195
+ transition: var(--howdy-transition);
196
+ letter-spacing: 0.01em; // Required for small text (11-13px range)
197
+ }
198
+
199
+ // Button/Label text
200
+ .label-text {
201
+ font-family: var(--howdy-font-primary);
202
+ font-weight: 600;
203
+ font-size: 15px;
204
+ line-height: 1.2em;
205
+ letter-spacing: 0.02em; // Required for UI labels/buttons
206
+ transition: var(--howdy-transition);
207
+ }
208
+
209
+ // Centered text
210
+ .text-center {
211
+ text-align: center;
212
+ }
213
+
214
+ // Muted text (gray)
215
+ .text-muted {
216
+ color: var(--howdy-text-muted);
217
+ }
218
+
219
+ // Script font for logo
220
+ .script-text {
221
+ font-family: 'Chaumont Script', 'Style Script', cursive;
222
+ font-weight: 400;
223
+ font-size: 32px;
224
+ letter-spacing: 0.02em;
225
+
226
+ @media (max-width: $howdy-md) {
227
+ font-size: 28px;
228
+ }
229
+
230
+ @media (max-width: $howdy-sm) {
231
+ font-size: 24px;
232
+ }
233
+ }
234
+
235
+ // Code
236
+ code {
237
+ font-family: var(--howdy-font-mono);
238
+ font-size: 14px;
239
+ padding: 2px 6px;
240
+ border-radius: 4px;
241
+ background-color: var(--howdy-bg-light-gray);
242
+ color: var(--howdy-text-primary);
243
+ }
244
+
245
+ pre {
246
+ font-family: var(--howdy-font-mono);
247
+ font-size: 14px;
248
+ line-height: 1.6;
249
+ padding: 16px 20px;
250
+ border-radius: var(--howdy-radius-md);
251
+ background-color: var(--howdy-bg-light-gray);
252
+ color: var(--howdy-text-primary);
253
+ overflow-x: auto;
254
+ max-width: 65ch;
255
+
256
+ code {
257
+ padding: 0;
258
+ background-color: transparent;
259
+ font-size: inherit;
260
+ }
261
+ }
262
+
263
+ .highlight {
264
+ font-family: var(--howdy-font-mono);
265
+ font-size: 14px;
266
+ line-height: 1.6;
267
+ padding: 16px 20px;
268
+ border-radius: var(--howdy-radius-md);
269
+ background-color: var(--howdy-bg-light-gray);
270
+ overflow-x: auto;
271
+
272
+ pre {
273
+ margin: 0;
274
+ padding: 0;
275
+ background-color: transparent;
276
+ }
277
+
278
+ code {
279
+ padding: 0;
280
+ background-color: transparent;
281
+ font-size: inherit;
282
+ }
283
+ }
284
+
285
+ // Blockquote
286
+ blockquote {
287
+ margin: 0;
288
+ padding: 16px 0 16px 20px;
289
+ border-left: 3px solid var(--howdy-accent-green);
290
+ max-width: 65ch;
291
+
292
+ p {
293
+ font-size: 17px;
294
+ font-style: italic;
295
+ line-height: 1.6;
296
+ color: var(--howdy-text-primary);
297
+ max-width: none;
298
+
299
+ + p {
300
+ margin-top: 12px;
301
+ }
302
+ }
303
+
304
+ cite {
305
+ display: block;
306
+ margin-top: 12px;
307
+ font-size: 14px;
308
+ font-style: normal;
309
+ font-weight: 500;
310
+ color: var(--howdy-text-muted);
311
+ }
312
+ }
313
+
314
+ // Horizontal rule
315
+ hr {
316
+ border: none;
317
+ height: 1px;
318
+ background-color: var(--howdy-border);
319
+ margin: 32px 0;
320
+ }
321
+
322
+ // Strong and emphasis
323
+ strong, b {
324
+ font-weight: 600;
325
+ color: var(--howdy-text-primary);
326
+ }
327
+
328
+ em, i {
329
+ font-style: italic;
330
+ }
331
+
332
+ // Tables
333
+ table {
334
+ width: 100%;
335
+ border-collapse: collapse;
336
+ margin: 16px 0;
337
+ font-size: 15px;
338
+
339
+ th, td {
340
+ padding: 10px 14px;
341
+ text-align: left;
342
+ border-bottom: 1px solid var(--howdy-border);
343
+ }
344
+
345
+ th {
346
+ font-weight: 600;
347
+ color: var(--howdy-text-primary);
348
+ font-size: 14px;
349
+ letter-spacing: 0.01em;
350
+ }
351
+
352
+ td {
353
+ color: var(--howdy-text-secondary);
354
+ }
355
+
356
+ thead th {
357
+ border-bottom: 2px solid var(--howdy-bg-light-gray);
358
+ }
359
+
360
+ tbody tr:last-child td {
361
+ border-bottom: none;
362
+ }
363
+ }
364
+
365
+ // Definition list
366
+ dl {
367
+ margin: 16px 0;
368
+ max-width: 65ch;
369
+
370
+ dt {
371
+ font-weight: 600;
372
+ font-size: 16px;
373
+ color: var(--howdy-text-primary);
374
+ margin-bottom: 4px;
375
+ }
376
+
377
+ dd {
378
+ margin: 0 0 16px;
379
+ font-size: 15px;
380
+ color: var(--howdy-text-secondary);
381
+ line-height: 1.6;
382
+ }
383
+ }
384
+
385
+ // Images in content
386
+ .content-area img,
387
+ .detail-content img {
388
+ max-width: 100%;
389
+ height: auto;
390
+ border-radius: var(--howdy-radius-md);
391
+ margin: 16px 0;
392
+ }
393
+
394
+
@@ -0,0 +1 @@
1
+ // Auto-generated from site.colors in _config.yml — do not edit
@@ -0,0 +1,165 @@
1
+ // Howdy Jekyll Theme - CSS Variables
2
+
3
+ // Sass breakpoint variables (for use in @media queries)
4
+ $howdy-xxl: 1440px; // Large desktop
5
+ $howdy-xl: 1280px; // Widescreen / Nest Hub Max / small laptops
6
+ $howdy-lg: 1024px; // Tablet landscape
7
+ $howdy-md: 768px; // Tablet portrait
8
+ $howdy-sm: 480px; // Large phones
9
+ $howdy-xs: 360px; // Small phones
10
+
11
+ :root {
12
+ // Primary colors (Light mode)
13
+ --howdy-text-primary: #1e1e28;
14
+ --howdy-bg-light-gray: #f0f0f0;
15
+ --howdy-accent-green: #008a1e;
16
+ --howdy-bg-green-tint: #f5fbf7;
17
+ --howdy-bg-white: #fff;
18
+ --howdy-border: #e3e3e3;
19
+ --howdy-text-red: #c74242;
20
+ --howdy-text-secondary: #47474f;
21
+ --howdy-text-muted: #797d85;
22
+ --howdy-bg-red-tint: #fff5f5;
23
+ --howdy-bg-semi-white: #ffffffb3;
24
+ --howdy-bg-cream: #f8f2eb;
25
+ --howdy-accent-orange: #ca7f2d;
26
+ --howdy-bg-orange-tint: #fdf6ee;
27
+ --howdy-accent-blue: #2a7ca8;
28
+ --howdy-bg-blue-tint: #f2f8fb;
29
+ --howdy-accent-purple: #914dad;
30
+ --howdy-bg-purple-tint: #f8f4fa;
31
+ --howdy-bg-dark-gray: #2d2d2d;
32
+
33
+ // Font families
34
+ --howdy-font-primary: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
35
+ --howdy-font-mono: 'Fragment Mono', 'Courier New', monospace;
36
+ --howdy-font-script: 'Chaumont Script', 'Style Script', cursive;
37
+
38
+ // Spacing
39
+ --howdy-spacing-xs: 4px;
40
+ --howdy-spacing-sm: 8px;
41
+ --howdy-spacing-md: 16px;
42
+ --howdy-spacing-lg: 32px;
43
+ --howdy-spacing-xl: 64px;
44
+ --howdy-spacing-12: 12px;
45
+ --howdy-spacing-24: 24px;
46
+ --howdy-spacing-48: 48px;
47
+
48
+ // Container margins (for .main-container)
49
+ --howdy-container-margin: 0;
50
+ --howdy-container-margin-xl: 24px;
51
+ --howdy-container-margin-lg: 20px;
52
+ --howdy-container-margin-md: 16px;
53
+ --howdy-container-margin-sm: 12px;
54
+ --howdy-container-margin-xs: 8px;
55
+
56
+ // Content area gaps (space between elements in .content-area)
57
+ --howdy-content-gap-xxl: var(--howdy-spacing-lg);
58
+ --howdy-content-gap-xl: var(--howdy-content-gap-xxl);
59
+ --howdy-content-gap-lg: var(--howdy-spacing-md);
60
+ --howdy-content-gap-md: var(--howdy-content-gap-lg);
61
+ --howdy-content-gap-sm: var(--howdy-spacing-md);
62
+ --howdy-content-gap-xs: var(--howdy-content-gap-sm);
63
+
64
+ // Content area padding (side padding shared with hero section)
65
+ --howdy-content-area-padding-y: 64px;
66
+ --howdy-content-area-padding-xl: 32px;
67
+ --howdy-content-area-padding-xl-bottom: 56px;
68
+ --howdy-content-area-padding-lg: 24px;
69
+ --howdy-content-area-padding-lg-bottom: 48px;
70
+ --howdy-content-area-padding-md: 20px;
71
+ --howdy-content-area-padding-md-bottom: 40px;
72
+ --howdy-content-area-padding-sm: 16px;
73
+ --howdy-content-area-padding-sm-bottom: 32px;
74
+ --howdy-content-area-padding-xs: 12px;
75
+ --howdy-content-area-padding-xs-bottom: 24px;
76
+
77
+ // Hero section (padding matches content-area side padding at each breakpoint)
78
+ --howdy-hero-padding-xl: 32px;
79
+ --howdy-hero-padding-lg: 24px;
80
+ --howdy-hero-padding-md: 20px;
81
+ --howdy-hero-padding-sm: 16px;
82
+ --howdy-hero-padding-xs: 12px;
83
+ --howdy-hero-height-xl: 480px;
84
+ --howdy-hero-height-lg: 360px;
85
+ --howdy-hero-height-md: 280px;
86
+ --howdy-hero-height-sm: 200px;
87
+ --howdy-hero-height-xs: 160px;
88
+
89
+ // Header spacing
90
+ --howdy-header-gap-xxl: 0;
91
+ --howdy-header-gap-xl: var(--howdy-header-gap-xxl);
92
+ --howdy-header-gap-lg: 16px;
93
+ --howdy-header-gap-md: var(--howdy-header-gap-lg);
94
+ --howdy-header-gap-sm: 12px;
95
+ --howdy-header-gap-xs: var(--howdy-header-gap-sm);
96
+ --howdy-header-padding-xxl: 0 0 0 24px;
97
+ --howdy-header-padding-lg: 0;
98
+
99
+ // Content wrapper padding (bottom)
100
+ --howdy-content-wrapper-padding-xl: 48px;
101
+ --howdy-content-wrapper-padding-lg: 44px;
102
+ --howdy-content-wrapper-padding-md: 36px;
103
+ --howdy-content-wrapper-padding-sm: 28px;
104
+ --howdy-content-wrapper-padding-xs: 20px;
105
+
106
+ // Two-column layout gaps
107
+ --howdy-two-col-gap-xxl: var(--howdy-spacing-xl);
108
+ --howdy-two-col-gap-xl: var(--howdy-two-col-gap-xxl);
109
+ --howdy-two-col-gap-lg: var(--howdy-spacing-lg);
110
+ --howdy-two-col-gap-md: var(--howdy-two-col-gap-lg);
111
+ --howdy-two-col-gap-sm: var(--howdy-spacing-md);
112
+ --howdy-two-col-gap-xs: 12px;
113
+
114
+ // Detail nav gaps
115
+ --howdy-detail-nav-gap-xxl: 16%;
116
+ --howdy-detail-nav-gap-xl: var(--howdy-detail-nav-gap-xxl);
117
+ --howdy-detail-nav-gap-lg: var(--howdy-spacing-md);
118
+ --howdy-detail-nav-gap-md: var(--howdy-detail-nav-gap-lg);
119
+ --howdy-detail-nav-gap-sm: var(--howdy-spacing-sm);
120
+ --howdy-detail-nav-gap-xs: var(--howdy-detail-nav-gap-sm);
121
+
122
+ // Nav panel
123
+ --howdy-nav-gap: var(--howdy-spacing-md);
124
+ --howdy-nav-padding-xxl: var(--howdy-spacing-lg);
125
+ --howdy-nav-padding-sm: 24px;
126
+
127
+ // Border radius
128
+ --howdy-radius-sm: 4px;
129
+ --howdy-radius-md: 8px;
130
+ --howdy-radius-lg: 16px;
131
+ --howdy-radius-full: 9999px;
132
+
133
+ // Transitions
134
+ --howdy-ease-out: cubic-bezier(0, 0, 0.2, 1);
135
+ --howdy-ease-in: cubic-bezier(0.4, 0, 1, 1);
136
+ --howdy-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
137
+ --howdy-transition: background-color 0.2s var(--howdy-ease-out), color 0.2s var(--howdy-ease-out), border-color 0.2s var(--howdy-ease-out), box-shadow 0.2s var(--howdy-ease-out), transform 0.2s var(--howdy-ease-out);
138
+ }
139
+
140
+ // Dark mode colors via system preference (only when no manual override is set)
141
+ @media (prefers-color-scheme: dark) {
142
+ :root:not(.light-mode) {
143
+ --howdy-text-primary: #fafafa;
144
+ --howdy-bg-light-gray: #1e1e1e;
145
+ --howdy-accent-green: #7eea9b;
146
+ --howdy-bg-green-tint: #1c2b22;
147
+ --howdy-bg-white: #141414;
148
+ --howdy-border: #2d2d2d;
149
+ --howdy-text-red: #e88787;
150
+ --howdy-text-secondary: #a0a0a0;
151
+ --howdy-text-muted: #999999;
152
+ --howdy-bg-red-tint: #2a1c1c;
153
+ --howdy-bg-semi-white: #2f241bb3;
154
+ --howdy-bg-cream: #2f241b;
155
+ --howdy-accent-orange: #f2b76c;
156
+ --howdy-bg-orange-tint: #2a2016;
157
+ --howdy-accent-blue: #7ec4e3;
158
+ --howdy-bg-blue-tint: #1b2630;
159
+ --howdy-accent-purple: #c58af2;
160
+ --howdy-bg-purple-tint: #241b2d;
161
+ --howdy-bg-dark-gray: #2d2d2d;
162
+ }
163
+ }
164
+
165
+
data/about.md ADDED
@@ -0,0 +1,62 @@
1
+ ---
2
+ layout: home
3
+ ---
4
+
5
+ <section class="two-column">
6
+ <div class="left-section">
7
+ <div class="left-container">
8
+ <div class="image-wrapper">
9
+ <div class="hero-content">
10
+ <img src="{{ site.about_hero_image | default: '/assets/illustrations/designer.svg' | relative_url }}" alt="About hero" class="hero-image">
11
+ <div class="logo-overlay">{% include logo.html %}</div>
12
+ </div>
13
+ </div>
14
+ </div>
15
+ </div>
16
+
17
+ <div class="right-section">
18
+ <div class="content-wrapper">
19
+ {% include navigation.html %}
20
+
21
+ <div class="content-area">
22
+ {% if site.about_headline %}
23
+ <h1>{{ site.about_headline }}</h1>
24
+ {% endif %}
25
+
26
+ <p class="body-large about-intro">
27
+ {{ site.about_bio }}
28
+ </p>
29
+
30
+ {% if site.about_paragraph_2 %}
31
+ <p class="about-body">
32
+ {{ site.about_paragraph_2 }}
33
+ </p>
34
+ {% endif %}
35
+
36
+ {% if site.about_paragraph_3 %}
37
+ <p class="about-body-muted">
38
+ {{ site.about_paragraph_3 }}
39
+ </p>
40
+ {% endif %}
41
+
42
+ {% if site.about_resume.enabled != false %}
43
+ <div class="about-resume-wrapper">
44
+ <a href="{{ site.about_resume.url | default: '/assets/resume.pdf' | relative_url }}" class="btn btn-secondary" target="_blank" rel="noopener noreferrer">{{ site.about_resume.text | default: "Download Resume" }}</a>
45
+ </div>
46
+ {% endif %}
47
+
48
+ {% if site.testimonials %}
49
+ <div class="about-testimonials">
50
+ <h2 class="about-testimonials-heading">What people say</h2>
51
+ {% for t in site.testimonials %}
52
+ <blockquote class="about-testimonial">
53
+ <p class="about-testimonial-quote">&ldquo;{{ t.quote }}&rdquo;</p>
54
+ <footer class="about-testimonial-attribution">&mdash; {{ t.name }}, <cite>{{ t.role }}</cite></footer>
55
+ </blockquote>
56
+ {% endfor %}
57
+ </div>
58
+ {% endif %}
59
+ </div>
60
+ </div>
61
+ </div>
62
+ </section>
@@ -0,0 +1,10 @@
1
+ ---
2
+ ---
3
+
4
+ @use "variables";
5
+ @use "base";
6
+ @use "typography";
7
+ @use "layout";
8
+ @use "components";
9
+ @use "dark-mode";
10
+ @use "user-colors";
@@ -0,0 +1,13 @@
1
+ /**
2
+ * Swiper 11.2.10
3
+ * Most modern mobile touch slider and framework with hardware accelerated transitions
4
+ * https://swiperjs.com
5
+ *
6
+ * Copyright 2014-2025 Vladimir Kharlampidi
7
+ *
8
+ * Released under the MIT License
9
+ *
10
+ * Released on: June 28, 2025
11
+ */
12
+
13
+ @font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, 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');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-border-radius,10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
Binary file