feat: design + perf + tags etc.
This commit is contained in:
Cory Dransfeldt
parent
93f3506f83
commit
6c63611198
44 changed files with 279 additions and 299 deletions
|
|
@ -5,5 +5,5 @@ layout: base
|
|||
<main>
|
||||
{{ content }}
|
||||
</main>
|
||||
{% render "partials/footer.liquid", page: page, nav: nav %}
|
||||
{% render "partials/footer.liquid", page:page, nav:nav %}
|
||||
</div>
|
||||
|
|
@ -8,7 +8,7 @@ layout: default
|
|||
{% endcapture %}
|
||||
<style>{{ css }}</style>
|
||||
{{ content }}
|
||||
{% render "partials/now/media-grid.liquid", data:artists, icon: "microphone-2", title: "Artists", shape: "square", count: 8, loading: 'eager' %}
|
||||
{% render "partials/now/media-grid.liquid", data:artists, icon: "microphone-2", title: "Artists", shape: "square", count: 8, loading: "eager" %}
|
||||
{% render "partials/now/media-grid.liquid", data:albums, icon: "vinyl", title: "Albums", shape: "square", count: 8 %}
|
||||
{% render "partials/now/albumReleases.liquid", albumReleases:albumReleases %}
|
||||
{% render "partials/now/media-grid.liquid", data:books, icon: "books", title: "Books", shape: "vertical", count: 6 %}
|
||||
|
|
|
|||
7
src/_includes/partials/banners/npm.liquid
Normal file
7
src/_includes/partials/banners/npm.liquid
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{% capture css %}
|
||||
{% render "../../../assets/styles/components/banners.css" %}
|
||||
{% endcapture %}
|
||||
<style>{{ css }}</style>
|
||||
<div class="banner npm">
|
||||
<p>{% tablericon "brand-npm" "NPM package" %} <a class="no-underline" href="{{ url }}">You can take a look at this package on NPM</a> or install it by running <code>{{ command }}</code>.</p>
|
||||
</div>
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
{% assign isOldPost = date | oldPost %}
|
||||
{% if isOldPost %}
|
||||
{% capture css %}
|
||||
{% render "../../assets/styles/components/banner-old-post.css" %}
|
||||
{% render "../../../assets/styles/components/banners.css" %}
|
||||
{% endcapture %}
|
||||
<style>{{ css }}</style>
|
||||
<div class="banner__old-post">
|
||||
<div class="banner old-post">
|
||||
<p>{% tablericon "clock-x" "Old post" %} This post is over 3 years old. I've probably changed my mind since it was written and it <em>could</em> be out of date.</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
|
@ -1,12 +1,12 @@
|
|||
<footer>
|
||||
<nav aria-label="Social icons" class="flex--centered text--centered">
|
||||
<nav aria-label="Social icons" class="flex--centered justify--centered text--centered">
|
||||
{% for link in nav.social %}
|
||||
{% render "partials/nav/linked-icon.liquid", name: link.name, link: link.url, icon: link.icon %}
|
||||
{% render "partials/nav/linked-icon.liquid", name:link.name, link:link.url, icon:link.icon %}
|
||||
{% endfor %}
|
||||
</nav>
|
||||
<nav aria-label="Secondary site navigation" class="flex--centered text--centered">
|
||||
<nav aria-label="Secondary site navigation" class="flex--centered justify--centered text--centered">
|
||||
{% for link in nav.footer %}
|
||||
{% render "partials/nav/link.liquid", page: page, link: link.name, icon: link.icon %}
|
||||
{% render "partials/nav/link.liquid", page:page, link:link.name, icon:link.icon %}
|
||||
{% if not forloop.last %}<span>•</span>{% endif %}
|
||||
{% endfor %}
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -6,5 +6,5 @@
|
|||
{{ meta.siteName }}
|
||||
{% endif %}
|
||||
</h1>
|
||||
{% render "partials/nav/menu.liquid", page: page, nav: nav %}
|
||||
{% render "partials/nav/menu.liquid", page:page, nav:nav %}
|
||||
</div>
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<ul class="flex--centered flex--wrap">
|
||||
{% for link in nav.menu %}
|
||||
<li>
|
||||
{% render "partials/nav/link.liquid", page: page, link: link.name, icon: link.icon, class: link.class %}
|
||||
{% render "partials/nav/link.liquid", page:page, link:link.name, icon:link.icon %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% render "partials/nav/theme-toggle.liquid" %}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<style>{{ css }}</style>
|
||||
{% endif %}
|
||||
{% assign media = data | normalizeMedia %}
|
||||
<h2 class="now__section--header flex--centered">
|
||||
<h2 id="{{ title | downcase }}" class="now__section--header flex--centered">
|
||||
{% tablericon icon title %}
|
||||
{{ title }}
|
||||
</h2>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,8 @@
|
|||
{%- assign artist = artists | first -%}
|
||||
{%- assign book = books | first -%}
|
||||
{%- assign show = tv | first -%}
|
||||
<div class="now__topper">
|
||||
<h2>
|
||||
<a class="no-underline" href="/now">Now</a>
|
||||
</h2>
|
||||
<div class="dark:text-white text-gray-800">
|
||||
<p>I'm a software developer in Camarillo, California. I enjoy hanging out with my beautiful family and 4 rescue dogs, technology, automation, <a href="https://last.fm/user/coryd_" rel="noopener noreferrer">music</a>, writing, <a href="https://app.thestorygraph.com/profile/coryd" rel="noopener noreferrer">reading</a>, <a href="https://trakt.tv/users/cdransf" rel="noopener noreferrer">tv</a> and <a href="https://trakt.tv/users/cdransf" rel="noopener noreferrer">movies</a>.</p>
|
||||
{% render "partials/now/status.liquid", status:status %}
|
||||
{% render "partials/now-playing.liquid" %}
|
||||
</div>
|
||||
<p><strong class="highlight-text">I'm a software developer in Camarillo, California.</strong> I enjoy hanging out with my beautiful family and 4 rescue dogs, technology, automation, <a href="https://coryd.dev/now#artists">music</a>, writing, <a href="https://coryd.dev/now#books">reading</a>, <a href="https://coryd.dev/now#tv">tv</a> and <a href="https://coryd.dev/now#movies">movies</a>. Lately I've been{% if artist %} listening to a lot of <strong class="highlight-text">{{ artist.title }}</strong>,{% endif %} reading <strong class="highlight-text">{{ book.title }}</strong> and watching <strong class="highlight-text">{{ show.name }}</strong>.</p>
|
||||
{% render "partials/now/status.liquid", status:status %}
|
||||
{% render "partials/now-playing.liquid" %}
|
||||
</div>
|
||||
|
|
@ -4,34 +4,30 @@
|
|||
<style>{{ css }}</style>
|
||||
<nav aria-label="Blog pagination" class="pagination flex--centered">
|
||||
{% if pagination.href.previous %}
|
||||
<a href="{{ pagination.href.previous }}">
|
||||
<button aria-label="Previous page [&>svg]:h-5 [&>svg]:w-5">
|
||||
{% tablericon "arrow-left" "Previous" %}
|
||||
</button>
|
||||
<a href="{{ pagination.href.previous }}" aria-label="Previous page">
|
||||
{% tablericon "arrow-left" "Previous" %}
|
||||
</a>
|
||||
{% else %}
|
||||
<button
|
||||
<span
|
||||
class="disabled"
|
||||
aria-label="Previous page (disabled)"
|
||||
disabled>
|
||||
{% tablericon "arrow-left" "Prevous" %}
|
||||
</button>
|
||||
</span>
|
||||
{% endif %}
|
||||
<div class="text--centered">
|
||||
<span aria-current="page">{{ pagination.pageNumber | plus: 1 }}</span> of {{ pagination.links.size }}
|
||||
</div>
|
||||
{% if pagination.href.next %}
|
||||
<a href="{{ pagination.href.next }}">
|
||||
<button aria-label="Next page">
|
||||
{% tablericon "arrow-right" "Next" %}
|
||||
</button>
|
||||
<a href="{{ pagination.href.next }}" aria-label="Next page">
|
||||
{% tablericon "arrow-right" "Next" %}
|
||||
</a>
|
||||
{% else %}
|
||||
<button
|
||||
<span
|
||||
class="disabled"
|
||||
aria-label="Next page (disabled)"
|
||||
disabled>
|
||||
{% tablericon "arrow-right" "Next" %}
|
||||
</button>
|
||||
</span>
|
||||
{% endif %}
|
||||
</nav>
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
{% for tag in tags %}
|
||||
{% if tag != "posts" %}
|
||||
<a href="/tags/{{ tag }}">
|
||||
<div
|
||||
class="pill--button pill--button__small"
|
||||
data-pagefind-filter="tags">{{ tag }}</div>
|
||||
</a>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
|
@ -4,5 +4,5 @@
|
|||
<style>{{ css }}</style>
|
||||
<script type="module" src="/assets/scripts/components/webcare-webshare.js"></script>
|
||||
<webcare-webshare share-text="{{ title }} {{ url | tagLookup: tagMap }}" share-url="{{ url }}" copy-text="{{ title }} {{ url | tagLookup: tagMap }} {{ url }}">
|
||||
<button class="icon--small icon--center__vertical" disabled>{% tablericon "share" "Share" %}</button>
|
||||
<button class="share icon--small icon--center__vertical" disabled>{% tablericon "share" "Share" %}</button>
|
||||
</webcare-webshare>
|
||||
3
src/_includes/partials/tags.liquid
Normal file
3
src/_includes/partials/tags.liquid
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
{% for tag in tags limit: 10 %}
|
||||
<a class="tag no-underline" href="/tags/{{ tag | downcase }}" data-pagefind-filter="tags">{{ tag | formatTag }}</a>
|
||||
{% endfor %}
|
||||
|
|
@ -11,22 +11,22 @@ schema: blog
|
|||
<style>{{ css }}</style>
|
||||
<div class="default__wrapper">
|
||||
<article class="h-entry" data-pagefind-body>
|
||||
<h2 class="p-name" data-pagefind-meta="title">{{ title }}</h2>
|
||||
<span class="p-author h-card hidden">{{ meta.author }}</span>
|
||||
<div class="flex--centered">
|
||||
<time class="dt-published" datetime="{{ date }}">
|
||||
{{ date | readableDate }}
|
||||
{{ date | date: "%B %d, %Y" }}
|
||||
<span class="client-side"> • </span>
|
||||
</time>
|
||||
{% render "partials/share-button.liquid", url: postUrl, title: title, tagMap: collections.tagMap %}
|
||||
{% render "partials/share-button.liquid", url:postUrl, title:title, tagMap:collections.tagMap %}
|
||||
</div>
|
||||
<h2 class="p-name" data-pagefind-meta="title">{{ title }}</h2>
|
||||
<span class="p-author h-card hidden">{{ meta.author }}</span>
|
||||
<div class="p-summary hidden">{{ post_excerpt }}</div>
|
||||
<div class="e-content">
|
||||
{% render "partials/banner-old-post.liquid", date: date %}
|
||||
{% render "partials/banners/old-post.liquid", date:date %}
|
||||
{{ content }}
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
{% render "partials/mastodon-post.liquid", postUrl: postUrl, linkPosts: linkPosts %}
|
||||
{% render "partials/post-tags.liquid", tags: tags %}
|
||||
{% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
|
||||
{% render "partials/mastodon-post.liquid", postUrl:postUrl, linkPosts:linkPosts %}
|
||||
{% render "partials/tags.liquid", tags:tags %}
|
||||
{% render "partials/popular-posts.liquid", posts:collections.posts, analytics:analytics %}
|
||||
|
|
@ -6,9 +6,8 @@
|
|||
<a href="https://webri.ng/webring/cssjoy/previous?via=https://coryd.dev/webrings">
|
||||
{% tablericon "arrow-left" "Previous site" %}
|
||||
</a>
|
||||
<a class="pill--button" href="https://webri.ng/webring/cssjoy/random?via=https://coryd.dev/webrings">
|
||||
<a href="https://webri.ng/webring/cssjoy/random?via=https://coryd.dev/webrings">
|
||||
{% tablericon "dice-3" "Random site" %}
|
||||
Random
|
||||
</a>
|
||||
<a href="https://webri.ng/webring/cssjoy/next?via=https://coryd.dev/webrings">
|
||||
{% tablericon "arrow-right" "Next site" %}
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
</div>
|
||||
<h3 class="text--centered">The Claw Webring</h3>
|
||||
<div class="webring__centered flex--centered">
|
||||
<a href="https://github.com/whitep4nth3r/the-claw-webring" class="pill--button">
|
||||
{% tablericon "user-plus" "Join!" %} Join!
|
||||
</a>
|
||||
<strong>
|
||||
<a class="no-underline" href="https://github.com/whitep4nth3r/the-claw-webring">Join!</a>
|
||||
</strong>
|
||||
</div>
|
||||
</div>
|
||||
Reference in a new issue