Skip to content

Commit 560e8c7

Browse files
committed
Embed albums from Bandcamp
1 parent 8a8983a commit 560e8c7

File tree

21 files changed

+313
-100
lines changed

21 files changed

+313
-100
lines changed

_site/blog/test-post/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="generator" content="Eleventy v3.1.2"><title>Document</title><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist.min.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/dev.css@4"><link rel="stylesheet" href="/s_x_LGwa8o.css"></head><body><header><h1><a href="/">hello</a></h1><p>whats up</p></header><main><h1>Hello world</h1><p>This is a blog post!!</p></main><footer><p>Made with <a href="https://www.11ty.dev/">Eleventy</a> and <a href="https://devcss.devins.page/">dev.css</a>. View the source code on <a href="https://github.com/willburden/willburden.github.io">GitHub</a>.</p></footer></body></html>

_site/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="generator" content="Eleventy v3.1.2"><title>Document</title><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist.min.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@intergrav/dev.css@4"><link rel="stylesheet" href="/s_x_LGwa8o.css"></head><body><header><h1><a href="/">Home</a></h1><p>How are you?</p></header><main><h1>Blog</h1><ul><li><a href="/blog/test-post">Test post</a></li></ul></main><footer><p>Made with <a href="https://www.11ty.dev/">Eleventy</a> and <a href="https://devcss.devins.page/">dev.css</a>. View the source code on <a href="https://github.com/willburden/willburden.github.io">GitHub</a>.</p></footer></body></html>

_site/s_x_LGwa8o.css

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/components/Aside.astro

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<aside>
2+
<div>
3+
<slot />
4+
</div>
5+
</aside>
6+
7+
<style lang="scss">
8+
@use "../styles/tokens" as *;
9+
10+
aside {
11+
@media (min-width: calc(2 * $aside-width)) {
12+
float: right;
13+
}
14+
15+
@media (min-width: $full-width) {
16+
position: relative;
17+
}
18+
}
19+
20+
div {
21+
@media (min-width: $full-width) {
22+
position: absolute;
23+
width: $aside-width;
24+
right: calc(-1 * $space-md - $aside-width);
25+
}
26+
}
27+
</style>

src/components/Bandcamp.astro

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
---
2+
interface Props {
3+
album: number;
4+
tracks?: number;
5+
}
6+
7+
const { album, tracks = 5 } = Astro.props;
8+
---
9+
10+
<iframe
11+
style=`--num-tracks: ${tracks};`
12+
src={`https://bandcamp.com/EmbeddedPlayer/album=${album}/size=large/bgcol=ffffff/linkcol=000000/transparent=true/`}
13+
seamless
14+
></iframe>
15+
16+
<style lang="scss">
17+
@use '../styles/tokens' as *;
18+
19+
$constant-height: 115px;
20+
$height-per-track: 32px;
21+
22+
iframe {
23+
width: $aside-width;
24+
height: auto;
25+
aspect-ratio: 1;
26+
border: 0;
27+
28+
display: block;
29+
margin-block-start: $space-xs;
30+
31+
@media (min-width: calc(2 * $aside-width)) {
32+
margin-block-start: 0;
33+
}
34+
35+
@media (min-width: $full-width) {
36+
height: calc($aside-width + $constant-height + $height-per-track * var(--num-tracks));
37+
aspect-ratio: auto;
38+
}
39+
}
40+
</style>

src/components/BlogPost.astro

Lines changed: 0 additions & 62 deletions
This file was deleted.

src/components/Footer.astro

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<footer>
2+
<p>Made with <a href="https://astro.build/">Astro</a> and <a href="https://docs.github.com/en/pages">GitHub Pages</a></p>
3+
<p>View the source code on <a href="https://github.com/willburden/willburden.github.io">GitHub</a></p>
4+
</footer>
5+
6+
<style lang="scss">
7+
@use '../styles/_tokens' as *;
8+
9+
footer {
10+
margin-block-start: $space-lg;
11+
padding-block-end: $space-md;
12+
13+
@include font-technical;
14+
text-align: center;
15+
font-size: $size-sm;
16+
17+
> * {
18+
margin-block: 0;
19+
}
20+
}
21+
</style>

src/components/Header.astro

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,27 +13,36 @@ import BearIcon from "./icons/BearIcon.astro";
1313
</header>
1414

1515
<style lang="scss">
16-
@use '../styles/_theme' as *;
16+
@use '../styles/_tokens' as *;
1717

1818
header {
19-
padding: $space-lg $space-md;
20-
box-shadow: 0 $shadow-offset $shadow-blur $color-subtle;
19+
padding: $space-md 0;
20+
margin-block-end: calc($space-lg - $space-md);
2121

2222
a {
23-
display: inline-flex;
23+
display: flex;
24+
align-items: end;
25+
2426
text-decoration: none;
2527
font-size: $size-lg;
26-
align-items: end;
2728

2829
div {
30+
align-self: stretch;
2931
margin-left: $space-xs;
32+
3033
display: flex;
3134
flex-direction: column;
3235
justify-content: end;
3336

3437
line-height: $size-md;
38+
font-weight: bold;
39+
vertical-align: baseline;
3540
color: $color-primary;
3641

42+
span {
43+
display: block;
44+
}
45+
3746
:last-child {
3847
color: $color-primary-dark;
3948
}

src/components/icons/BearIcon.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
</svg>
77

88
<style lang="scss">
9-
@use '../../styles/_theme' as *;
9+
@use '../../styles/_tokens' as *;
1010

1111
svg {
1212
height: $size-2xl;

src/components/post/Post.astro

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
import { render, type CollectionEntry } from 'astro:content'
3+
import PostHeader from './PostHeader.astro';
4+
5+
interface Props {
6+
post: CollectionEntry<'blog'>;
7+
}
8+
9+
const { post } = Astro.props;
10+
const { Content } = await render(post);
11+
---
12+
13+
<article>
14+
<PostHeader data={post.data} />
15+
<div class="prose">
16+
<Content />
17+
</div>
18+
</article>

0 commit comments

Comments
 (0)