Repository navigation
Expand file tree
/
Copy pathwork.astro
More file actions
118 lines (117 loc) · 4.36 KB
/
Copy pathwork.astro
File metadata and controls
118 lines (117 loc) · 4.36 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
---
import Base from '../layouts/Base.astro';
import Icon from '../components/Icon.astro';
import { site } from '../config/site';
import '../styles/destinations.css';
---
<Base
title="Selected work"
description="Explore my design, illustration and motion work on my public Telegram channel. I share my creative practice, experiments and works in progress."
>
<section class="destination-page destination-work wrap">
<header class="destination-heading">
<p class="eyebrow">WORK / DESIGN, ILLUSTRATION & MOTION</p>
<h1>
A little strange.
<br />
<em>A lot of character.</em>
</h1>
<p>
Expressive characters. Playful visuals. Unexpected loops. Explore the
work I share on Telegram.
</p>
</header>
<section
class="destination-stage destination-portfolio"
aria-labelledby="portfolio-heading"
>
<div class="destination-copy">
<span class="destination-index">THE PORTFOLIO</span>
<h2 id="portfolio-heading">
A window into
<br />
the making.
</h2>
<p>
My channel is the place to explore my visual work, from design and
illustration to motion. Open the public feed, or join me there.
</p>
<div class="destination-actions">
<a class="button" href={site.links.channelPreview}>
View my work <Icon name="northeast" size={19} />
</a>
<a class="text-link" href={site.links.channel}>
<Icon name="telegram" size={19} /> Join the channel
</a>
</div>
<p class="destination-address">Opens the public Telegram feed.</p>
</div>
<div class="destination-art portfolio-drawing" aria-hidden="true">
<svg viewBox="0 0 460 400" fill="none" focusable="false">
<path class="drawing-shadow" d="m111 79 261 21-20 265-261-21z" />
<path
class="drawing-paper drawing-stroke"
d="m95 64 261 21-20 265-261-21z"
/>
<path
class="drawing-peach drawing-stroke"
d="m126 43 246 51-50 252-246-51z"
/>
<path class="drawing-paper drawing-stroke" d="M101 73h252v266H101z" />
<path class="drawing-stroke" d="M101 117h252M120 95h50m143 0h20" />
<circle
class="drawing-mint drawing-stroke"
cx="226"
cy="219"
r="76"
/>
<g stroke-linecap="round" stroke-linejoin="round">
<path
d="M226 219c-19-20-30-33-45-30-18 3-22 18-15 34 8 18 24 22 39 9l42-34c17-14 32-10 39 4 9 17-1 37-18 37-15 0-28-7-42-20Z"
stroke="var(--ink)"
stroke-width="18"
/>
<path
d="M226 219c-19-20-30-33-45-30-18 3-22 18-15 34 8 18 24 22 39 9l42-34c17-14 32-10 39 4 9 17-1 37-18 37-15 0-28-7-42-20Z"
stroke="var(--accent)"
stroke-width="14"
/>
<path d="m211 227 30-24" stroke="var(--mint)" stroke-width="24" />
<path d="m205 232 42-34" stroke="var(--ink)" stroke-width="18" />
<path d="m205 232 42-34" stroke="var(--accent)" stroke-width="14" />
<path
d="M173 198c9-7 17-1 24 5m70 29c10 0 16-8 15-17m-68 8 23-19"
stroke="#f9f6ff"
stroke-width="2.5"
/>
</g>
<path
class="drawing-accent drawing-stroke"
d="m226 153 4 11 11 4-11 4-4 11-4-11-11-4 11-4z"
/>
<path
class="drawing-yellow drawing-stroke"
d="m319 28 11 23 25-5-13 22 17 19-26-1-7 25-8-25-26 1 17-19-13-22 25 5z"
/>
<path
class="drawing-stroke"
d="m47 242 15-11m-7 29 17-5m-12 26 17-1m299-112 17-11m-11 30 18-4"
/>
<path
class="drawing-accent-stroke"
d="M130 369c56 17 114 18 176 3m-147 9c40 5 80 4 119 0"
/>
<circle class="drawing-ink" cx="62" cy="118" r="4" />
<circle class="drawing-ink" cx="388" cy="285" r="4" />
</svg>
<span class="destination-handnote">Made with curiosity.</span>
</div>
</section>
<div class="destination-after">
<p>Something here sparks an idea?</p>
<a class="text-link" href="/feedback/">
Let's talk <Icon name="arrow" size={19} />
</a>
</div>
</section>
</Base>