besaid.zone
+200
-2
index.html
+200
-2
index.html
···
3
3
<head>
4
4
<meta charset="UTF-8">
5
5
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
-
<title>Document</title>
6
+
<title>Dane's Website</title>
7
+
<meta name="description" content="Hey, I'm Dane. A frontend/fullstack developer from Toronto that enjoys building cool and accessible websites using the latest web technologies.">
8
+
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
9
+
<meta property="og:type" content="website">
10
+
<meta property="og:title" content="Dane's Website">
11
+
<meta property="og:description" content="Hey, I'm Dane. A frontend/fullstack developer from Toronto that enjoys building cool and accessible websites using the latest web technologies.">
12
+
<link rel="canonical" href="https://dane.computer/">
13
+
<meta property="og:url" content="https://dane.computer/">
14
+
<style>
15
+
@layer reset {
16
+
*,
17
+
*::before,
18
+
*::after {
19
+
box-sizing: border-box;
20
+
}
21
+
22
+
* {
23
+
margin: 0;
24
+
padding: 0;
25
+
}
26
+
27
+
html {
28
+
-webkit-text-size-adjust: none;
29
+
-webkit-font-smoothing: antialiased;
30
+
text-rendering: optimizespeed;
31
+
text-size-adjust: none;
32
+
color-scheme: dark light;
33
+
tab-size: 2;
34
+
scrollbar-gutter: stable;
35
+
interpolate-size: allow-keywords;
36
+
line-height: 1.5;
37
+
}
38
+
39
+
body {
40
+
margin: 0;
41
+
font-family: Menlo, Consolas, Monaco, Adwaita Mono, Liberation Mono, Lucida Console, monospace;
42
+
font-synthesis: none;
43
+
}
44
+
45
+
ul[role=list], ol[role=list] {
46
+
list-style: none;
47
+
padding: 0;
48
+
}
49
+
50
+
::marker {
51
+
line-height: 0;
52
+
}
53
+
54
+
:focus-visible {
55
+
outline-offset: 2px;
56
+
}
57
+
58
+
@media (prefers-reduced-motion: no-preference) {
59
+
html:focus-within {
60
+
scroll-behavior: smooth;
61
+
}
62
+
}
63
+
64
+
a {
65
+
color: inherit;
66
+
text-underline-offset: 0.2ex;
67
+
}
68
+
69
+
h1, h2,
70
+
h3, h4 {
71
+
text-wrap: balance;
72
+
}
73
+
74
+
a[href] {
75
+
-webkit-tap-highlight-color: transparent;
76
+
}
77
+
78
+
p, h1, h2, h3, h4, h5, h6 {
79
+
overflow-wrap: break-word;
80
+
}
81
+
82
+
p {
83
+
text-wrap: pretty;
84
+
}
85
+
86
+
}
87
+
88
+
.container {
89
+
max-width: 65ch;
90
+
margin: 0 auto;
91
+
padding: 5.5rem 0;
92
+
}
93
+
94
+
.intro {
95
+
margin-bottom: 2rem;
96
+
}
97
+
98
+
.name {
99
+
font-size: 2.5rem;
100
+
font-weight: bold;
101
+
text-transform: capitalize;
102
+
}
103
+
104
+
.title {
105
+
font-weight: bold;
106
+
margin-bottom: 1.5rem;
107
+
}
108
+
109
+
.bio {
110
+
margin-bottom: 2rem;
111
+
font-weight: 500;
112
+
}
113
+
114
+
.bio p:not(:last-of-type) {
115
+
margin-bottom: 1rem;
116
+
}
117
+
118
+
.links {
119
+
margin-bottom: 2rem;
120
+
}
121
+
122
+
.links p:first-of-type {
123
+
font-weight: bold;
124
+
}
125
+
126
+
.job {
127
+
display: flex;
128
+
justify-content: space-between;
129
+
}
130
+
131
+
.work-experience ul {
132
+
display: flex;
133
+
flex-direction: column;
134
+
row-gap: 1rem;
135
+
}
136
+
137
+
@media (width <= 640px) {
138
+
.container {
139
+
padding: 3.5rem 1rem;
140
+
}
141
+
}
142
+
143
+
@media (width <= 600px) {
144
+
.container {
145
+
text-align: center;
146
+
}
147
+
148
+
.work-experience .job {
149
+
display: flex;
150
+
flex-direction: column;
151
+
}
152
+
}
153
+
</style>
7
154
</head>
8
155
<body>
9
-
156
+
<main class="container">
157
+
<section class="intro">
158
+
<h1 class="name">dane miller</h1>
159
+
<p class="title">senior software developer</p>
160
+
<aside class="bio">
161
+
<p>Currently working as a frontend developer at the Bank of Montreal in Toronto.</p>
162
+
<p>In my spare time I enjoy (re)watching tv shows, listening to music and playing video games.</p>
163
+
<p>I guess I code from time to time as well. At the moment i'm into all things <a href="https://atproto.com" target="_blank" rel="noopener noreferrer">AT Protocol</a>.</p>
164
+
<p>Writing code in Typescript, Go, Rust and Gleam.</p>
165
+
</aside>
166
+
</section>
167
+
<section class="links">
168
+
<h2>where to find me on the world wide web</h2>
169
+
<ul role="list">
170
+
<li>
171
+
<a href="https://bsky.app/profile/did:plc:qttsv4e7pu2jl3ilanfgc3zn" target="_blank" aria-label="Go to Dane's bluesky profile, opens in a new tab" rel="noopener noreferrer">Bluesky</a>
172
+
</li>
173
+
<li>
174
+
<a href="https://tangled.org/did:plc:qttsv4e7pu2jl3ilanfgc3zn" target="_blank" aria-label="Go to Dane's Tangled profile, opens in a new tab" rel="noopener noreferrer">Tangled</a>
175
+
</li>
176
+
<li>
177
+
<a href="mailto:me@dane.computer">E-mail</a>
178
+
</li>
179
+
</ul>
180
+
</section>
181
+
<section class="work-experience">
182
+
<h2>work experience</h2>
183
+
<ul role="list">
184
+
<li class="job">
185
+
<div>
186
+
<p class="company">Bank of Montreal</p>
187
+
<small class="title">Senior Software Developer</small>
188
+
</div>
189
+
<p>2021 to present</p>
190
+
</li>
191
+
<li class="job">
192
+
<div>
193
+
<p class="company">Black Professionals In Tech Network</p>
194
+
<small class="title">Intermediate Software Developer</small>
195
+
</div>
196
+
<p>2021 to 2021</p>
197
+
</li>
198
+
<li class="job">
199
+
<div>
200
+
<p class="company">Wise Publishing</p>
201
+
<small class="title">Frontend Developer Intern</small>
202
+
</div>
203
+
<p>2020 to 2020</p>
204
+
</li>
205
+
</ul>
206
+
</section>
207
+
</main>
10
208
</body>
11
209
</html>