Dane's personal website
dane.computer
besaid.zone
1<!DOCTYPE html>
2<html lang="en">
3<head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
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>
154</head>
155<body>
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>
208</body>
209</html>