diff --git a/.eleventy.js b/.eleventy.js index 2ef5bcb..fde2ccd 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -11,11 +11,12 @@ export default async function (config) { config.setTemplateFormats(['md', 'liquid', 'html']); config.addPassthroughCopy('src/styles.css'); config.addPassthroughCopy('src/styles/**/*.css'); + config.addPassthroughCopy('src/assets/**/*'); config.setServerOptions({ watch: ['src/styles/**/*.css'], }); config.addFilter('dump', dumpFilter); - config.addFilter('formatDate', dateObj => DateTime.fromJSDate(dateObj).toLocaleString(DateTime.DATE_MED)); + config.addFilter('formatDate', dateObj => DateTime.fromJSDate(dateObj).toUTC().toLocaleString(DateTime.DATE_MED)); } diff --git a/src/assets/hash.svg b/src/assets/hash.svg new file mode 100644 index 0000000..f2bdc30 --- /dev/null +++ b/src/assets/hash.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/index.liquid b/src/index.liquid index 2af2eb2..eb46d40 100644 --- a/src/index.liquid +++ b/src/index.liquid @@ -16,12 +16,18 @@
{%- for post in collections.all -%} - {%- if post.data.type == "post" -%} -
+ {%- if post.data.type == "thought" -%} +
- Posted on {{ post.date | formatDate }} + + An errant thought...
- {{ post.content }} +
+ {{ post.content }} +
+
{%- endif -%} {%- endfor -%} diff --git a/src/styles.css b/src/styles.css index fb750fc..4757b4d 100644 --- a/src/styles.css +++ b/src/styles.css @@ -26,29 +26,55 @@ body > header { } body > header > .header__title { + background-color: var(--color-bg); + color: var(--color-on-bg); padding: var(--size-md) var(--size-xl); } -body > header > .header__title { - background-color: var(--color-bg); - color: var(--color-on-bg); -} - body > header > .header__title > h1 { + font-size: var(--font-title); font-weight: 300; margin: 0; } main { + align-items: center; display: flex; flex-direction: column; + font-size: var(--font-body); grid-area: content; } -main > .post { - width: 66%; +main > .thought { + border: 2px solid var(--color-black); + width: 75%; } -main > .post > p { +main > .thought > header { + align-items: center; + display: flex; + font-size: var(--font-post-header); + padding: var(--size-md) var(--size-md) 0 var(--size-md); +} + +main > .thought > header > object { + height: 20px; + margin-right: var(--size-sm); + width: 20px; +} + +main > .thought > .content { + border-top: 2px solid var(--color-black); + margin-top: var(--size-md); + padding: var(--size-xl) var(--size-2x); +} + +main > .thought > .content > p:first-of-type { margin: 0; } + +main > .thought > footer { + background-color: var(--color-bg); + color: var(--color-on-bg); + padding: var(--size-md); +} diff --git a/src/styles/variables.css b/src/styles/variables.css index 5f40b65..31ad77b 100644 --- a/src/styles/variables.css +++ b/src/styles/variables.css @@ -10,6 +10,11 @@ --size-md: 16px; --size-lg: 20px; --size-xl: 24px; + --size-2x: calc(var(--size-md) * 2); + + --font-title: 2.4em; + --font-body: 1.6em; + --font-post-header: 0.8em; --gap-sm: 16px; --gap-md: 32px; diff --git a/src/posts/2025/04/a-test-post.md b/src/thoughts/2025/04/a-test-post.md similarity index 100% rename from src/posts/2025/04/a-test-post.md rename to src/thoughts/2025/04/a-test-post.md diff --git a/src/posts/posts.11tydata.js b/src/thoughts/thoughts.11tydata.js similarity index 71% rename from src/posts/posts.11tydata.js rename to src/thoughts/thoughts.11tydata.js index b6acc66..96b09c2 100644 --- a/src/posts/posts.11tydata.js +++ b/src/thoughts/thoughts.11tydata.js @@ -2,13 +2,13 @@ import { DateTime } from 'luxon'; export default { date: 'git Created', - type: 'post', + type: 'thought', permalink: function ({ page }) { // console.log(arguments); const { date, fileSlug, outputFileExtension } = page; const today = DateTime.fromJSDate(date).toUTC(); - return `/posts/${today.year}/${String(today.month).padStart(2, '0')}/${String(today.day).padStart( + return `/thought/${today.year}/${String(today.month).padStart(2, '0')}/${String(today.day).padStart( 2, '0' )}/${fileSlug}.${outputFileExtension}`;