<h1>Ben Larson</h1>
</header>
<main>
- <p>
+ <p class="dropcap">
I am a software developer in Nashville, Tennissee. For the past two
years I've been working on the Marketing Technology team at
<a href="https://www.ramseysolutions.com">Ramsey.</a> Before that I was
where I got a bachelor's degree in Computer Science, and minored in
Philosophy and German.
</p>
- <p>
+ <p class="dropcap">
For fun I enjoy hiking, reading, and listening to music. The tallest
mountain I have climbed is Mount Washington (6k ft) in New Hampshire. A
few of my favorite authors are Howard Pyle, G. K. Chesterton, C. S.
<a href="https://triodhoore.com">Trio Dhoore,</a> and
<a href="https://www.weirdal.com">"Weird Al" Yankovic.</a>
</p>
- <p>
+ <p class="dropcap">
Like a lot of other devs, I often spend my free time coding. Many of my
side projects are hosted on
<a href="http://git.benlarson.xyz">my git server.</a> One of these is
@media (prefers-color-scheme: dark) {
:root {
- --background-color-primary: #111;
+ --background-color-primary: #181818;
--background-color-header: #000;
--text-color-primary: #eee;
--text-color-links: #0af;
--text-shadow: 0 0 1px rgba(200, 200, 200, 0.6);
- --separator-color: #222;
+ --separator-color: #282828;
}
}
header {
background-color: var(--background-color-header);
padding: 6rem 3rem 3rem 3rem;
+ box-shadow: 0 -1px var(--separator-color) inset;
}
h1 {
}
main {
+ margin: 0 auto;
+ max-width: 50rem;
+ line-height: 1.6em;
padding: 3rem 3rem 5rem 3rem;
- box-shadow: 0 -1px var(--separator-color);
}
a {
}
p {
- position: relative;
- margin: 0 auto;
- max-width: 50rem;
- line-height: 1.6em;
padding-bottom: 2rem;
}
-p::first-letter {
+p.dropcap::first-letter {
font-size: 2em;
float: left;
margin: 0.3em 0.5em 0 0.5em;
line-height: 1em;
}
+.wishlist {
+ display: grid;
+ grid-row-gap: 1.5rem;
+ list-style-type: none;
+}
+
+.wishlist li {
+ display: block;
+ height: 6rem;
+}
+
+.wishlist .thumbnail {
+ height: 6rem;
+ float: left;
+ margin-right: 1.5rem;
+ border-radius: 1rem;
+}
+
+.wishlist .title {
+ font-size: 22pt;
+ line-height: 3rem;
+ padding-top: .2rem;
+}
+
+.wishlist .description {
+ display: block;
+ line-height: 2rem;
+}
+
@media (max-width: 45em) {
header {
padding: 3rem 2rem 3rem 1rem;
main {
padding: 2rem 1rem 5rem 1rem;
}
+
+ .wishlist .thumbnail {
+ display: none;
+ }
}
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta
+ name="viewport"
+ content="width=device-width, initial-scale=1, viewport-fit=cover"
+ />
+ <meta charset="UTF-8" />
+ <title>Ben's Wishlist</title>
+ <link rel="stylesheet" href="/styles/main.css" />
+ </head>
+ <body>
+ <header>
+ <h1>Ben's Wishlist</h1>
+ </header>
+ <main>
+ <p>Note: I'm the only one who can update this, so be careful.</p>
+ <ul class="wishlist">
+ <li>
+ <img class="thumbnail" src="https://img.discogs.com/Vs2ekQSPBKi2dRP1VkzLummmwHk=/fit-in/300x300/filters:strip_icc():format(jpeg):mode_rgb():quality(40)/discogs-images/R-3292334-1324287209.jpeg.jpg" />
+ <h3 class="title">Polarskibet Fram</h3>
+ <span class="description">
+ Vinyl record – <a
+ href="https://www.discogs.com/Various-Polarskibet-Fram/release/3292334"
+ target="_blank"
+ >View on Discogs</a
+ >
+</span>
+ </li>
+ </ul>
+ </main>
+ </body>
+</html>
projects / xyz.git / commitdiff