cdransf/coryd.dev-eleventy
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: same styles for site + feeds; clean up unused param; send reviews not description in dedicated movies/books feeds

Browse source
This commit is contained in:
Cory Dransfeldt 2024-09-06 15:39:33 -07:00
parent 06bdb5be66
commit ab14e9f2fe
No known key found for this signature in database
16 changed files with 70 additions and 371 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
config/filters/feeds.js
View file

@ -39,7 +39,7 @@ export default {
entryData.forEach((entry) => {
const md = mdGenerator()
const dateKey = Object.keys(entry).find(key => key.includes('date'))
let { artist, authors, backdrop, content, description, image, link, rating, slug, title, url, tags, type } = entry
let { artist, authors, backdrop, content, description, image, link, rating, review, slug, title, url, tags, type } = entry
const feedNote = '<hr/><p>This is a full text feed, but not all content can be rendered perfectly within the feed. If something looks off, feel free to <a href="https://coryd.dev">visit my site</a> for the original post.</p>'
const processedEntry = { title: title.trim(), date: new Date(entry[dateKey]), content: description }
@ -54,10 +54,15 @@ export default {
url: authors['url'],
mastodon: authors?.['mastodon'] || '',
rss: authors?.['rss_feed'] || ''
}
},
processedEntry['excerpt'] = sanitizeHtml(`${md.render(description)}`)
}
if (description) processedEntry['excerpt'] = description
if (['book', 'movie', 'link'].includes(type)) processedEntry['excerpt'] = sanitizeHtml(`${md.render(description)}`)
if (['book', 'movie'].includes(type) && review) {
processedEntry['excerpt'] = sanitizeHtml(`${md.render(review)}`)
} else if (['book', 'movie'].includes(type)) {
processedEntry['excerpt'] = sanitizeHtml(`${md.render(description)}`)
}
if (slug && content) processedEntry['excerpt'] = sanitizeHtml(`${md.render(content)}${feedNote}`, {
disallowedTagsMode: 'completelyDiscard'
})

10
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "coryd.dev",
"version": "24.7.3",
"version": "24.7.4",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "coryd.dev",
"version": "24.7.3",
"version": "24.7.4",
"license": "MIT",
"dependencies": {
"@cdransf/api-text": "^1.5.0",
@ -1743,9 +1743,9 @@
"license": "MIT"
},
"node_modules/electron-to-chromium": {
"version": "1.5.17",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.17.tgz",
"integrity": "sha512-Q6Q+04tjC2KJ8qsSOSgovvhWcv5t+SmpH6/YfAWmhpE5/r+zw6KQy1/yWVFFNyEBvy68twTTXr2d5eLfCq7QIw==",
"version": "1.5.18",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.18.tgz",
"integrity": "sha512-1OfuVACu+zKlmjsNdcJuVQuVE61sZOLbNM4JAQ1Rvh6EOj0/EUKhMJjRH73InPlXSh8HIJk1cVZ8pyOV/FMdUQ==",
"dev": true,
"license": "ISC"
},

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "coryd.dev",
"version": "24.7.3",
"version": "24.7.4",
"description": "The source for my personal site. Built using 11ty (and other tools).",
"type": "module",
"scripts": {

2
src/assets/styles/base/index.css
View file

@ -470,7 +470,6 @@ article {
display: block;
color: var(--gray-dark);
font-size: var(--font-size-sm);
margin-right: var(--spacing-xs);
}
}
@ -489,6 +488,7 @@ ul, ol {
/* images */
.image-banner {
border: var(--border-default);
border-radius: var(--border-radius-slight);
height: auto;
width: 100%;
display: block;

351
src/assets/styles/feed.xsl
View file

@ -7,356 +7,9 @@
<title><xsl:value-of select="/rss/channel/title"/></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<style type="text/css">
:root {
--sizing-xs: .25rem;
--sizing-sm: .5rem;
--sizing-md: .75rem;
--sizing-lg: 1rem;
--sizing-base: 1.5rem;
--sizing-xl: 1.75rem;
--sizing-2xl: 2rem;
--sizing-3xl: 2.25rem;
--spacing-xs: var(--sizing-xs);
--spacing-sm: var(--sizing-sm);
--spacing-md: var(--sizing-md);
--spacing-lg: var(--sizing-lg);
--spacing-base: var(--sizing-base);
--spacing-xl: var(--sizing-xl);
--spacing-2xl: var(--sizing-2xl);
--spacing-3xl: var(--sizing-3xl);
--margin-vertical-base-horizontal-zero: var(--sizing-base) 0;
--border-radius-slight: var(--sizing-xs);
--border-radius-full: 9999px;
--font-mono: Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, ui-monospace, monospace;
--blue-100: #e2ecff;
--blue-200: #c5d8ff;
--blue-300: #a8c4ff;
--blue-400: #7aa6ff;
--blue-500: #4b88ff;
--blue-600: #3168e9;
--blue-700: #2458d4;
--blue-800: #1d4bac;
--blue-900: #1c3e91;
--gray-50: #f6f7f8;
--gray-100: #eceef1;
--gray-200: #dfe3e8;
--gray-300: #c5ccd5;
--gray-400: #adb4c0;
--gray-500: #959eae;
--gray-600: #7f899b;
--gray-700: #707b8e;
--gray-800: #626d7f;
--gray-900: #545e71;
--gray-950: #4a5365;
--gray-1000: #1a1d22;
--white: #fff;
--black: #000;
--gray-light: var(--gray-200);
--gray-lighter: var(--gray-100);
--gray-dark: var(--gray-950);
--accent-color: var(--blue-600);
--accent-color-hover: var(--blue-800);
--color-lightest: var(--gray-50);
--color-darkest: var(--gray-1000);
--text-color: var(--color-darkest);
--background-color: var(--color-lightest);
--border-color: var(--gray-200);
--code-bg-color: #1a1d22;
--code-text-color: #f6f7f8;
--font-size-xs: .7rem;
--font-size-sm: .85rem;
--font-size-base: 1rem;
--font-size-lg: 1.15rem;
--font-size-xl: 1.3rem;
--font-size-2xl: 1.45rem;
--font-size-3xl: 1.6rem;
--font-weight-base: 400;
--font-weight-bold: 600;
--font-weight-extrabold: 800;
--line-height-md: 1.5;
--line-height-base: 2;
/* outline */
--outline-default: var(--outline-default);
/* borders */
--border-default: 1px solid var(--accent-color);
--border-gray: 1px solid var(--gray-light);
}
@media (prefers-color-scheme: dark) {
:root {
--gray-light: var(--gray-800);
--gray-lighter: var(--gray-900);
--gray-dark: var(--gray-200);
--text-color: var(--color-lightest);
--background-color: var(--color-darkest);
--accent-color: var(--blue-400);
--accent-color-hover: var(--blue-200);
--border-color: var(--gray-800);
}
}
::-moz-selection {
color: var(--color-lightest);
background: var(--accent-color);
}
::selection {
color: var(--color-lightest);
background: var(--accent-color);
}
::-webkit-scrollbar-track {
background-color: var(--gray-light);
}
::-webkit-scrollbar-thumb {
background: var(--accent-color);
border-radius: var(--border-radius-full);
}
::-webkit-scrollbar-button {
background-color: var(--accent-color);
}
::-webkit-scrollbar,
body::-webkit-scrollbar {
width: var(--sizing-md);
height: var(--sizing-md);
}
body {
font-family: var(--font-mono);
font-size: var(--font-size-base);
font-weight: var(--font-weight-base);
line-height: var(--line-height-base);
letter-spacing: -.05rem;
word-spacing: -.125rem;
color: var(--text-color);
background-color: var(--background-color);
margin: 0;
}
html {
font-size: 100%;
-webkit-text-size-adjust: none;
}
.main-wrapper {
min-height: 100vh;
display: flex;
flex-direction: column;
}
main {
flex: 1 1 0%;
width: 80%;
margin-left: auto;
margin-right: auto;
}
main footer {
margin-bottom: var(--spacing-base);
}
main footer hr {
margin-top: 0;
}
.default-wrapper {
padding-top: var(--spacing-2xl);
}
.default-wrapper > p:first-of-type {
margin-top: 0;
}
.main-title {
padding-top: var(--spacing-3xl);
}
.main-title h1 {
font-weight: var(--font-weight-extrabold);
margin: 0;
padding: 0;
}
.main-title h1 a {
text-decoration: none;
}
h1 { font-size: var(--font-size-2xl); }
h2 { font-size: var(--font-size-xl); }
h3 { font-size: var(--font-size-lg); }
h1, h2, h3 {
font-weight: var(--font-weight-bold);
line-height: var(--line-height-md);
margin-bottom: var(--spacing-base);
}
a {
color: var(--accent-color);
text-decoration: none;
}
a:focus,
a:focus-within, {
outline: var(--outline-default);
border-radius: var(--border-radius-slight);
text-decoration: none;
}
a:hover,
a:focus,
a:active {
color: var(--accent-color-hover);
transition-property: color;
transition-timing-function: var(--transition-ease-in-out);
transition-duration: var(--transition-duration-default);
}
.date {
margin: 0;
color: var(--gray-dark);
font-size: var(--font-size-sm);
}
.item {
padding: var(--spacing-base) 0;
border-bottom: 1px solid var(--border-color);
}
.item h3 {
margin-top: 0;
margin-bottom: var(--spacing-base);
}
.item p:first-of-type {
margin-top: 0;
}
.item:first-of-type {
padding-top: 0;
}
.item:last-of-type {
border-bottom: 0;
}
.item img {
border: var(--border-default);
border-radius: var(--border-radius-slight);
width: 100%;
height: auto;
display: block;
margin-top: var(--spacing-base);
}
p {
margin-bottom: var(--spacing-base)
}
p a {
text-decoration: underline;
text-decoration-style: dashed;
text-underline-offset: var(--spacing-xs);
}
p:last-of-type {
margin-bottom: 0;
}
strong,
blockquote {
font-weight: var(--font-weight-bold);
}
blockquote {
font-size: var(--font-size-lg);
word-break: break-word;
color: var(--gray-dark);
padding-left: var(--spacing-lg);
border-left: var(--sizing-xs) solid var(--gray-dark);
margin: var(--margin-vertical-base-horizontal-zero);
}
hr {
height: 1px;
background-color: var(--border-color);
border: 0;
margin: var(--margin-vertical-base-horizontal-zero);
}
.highlight-text {
color: var(--color-lightest);
background-color: var(--accent-color);
padding: var(--spacing-xs);
}
pre {
padding: var(--spacing-base);
overflow: auto;
margin: var(--margin-vertical-base-horizontal-zero);
font-size: var(--body-font-size);
}
code {
padding: 2px 4px;
}
.highlight-text,
pre,
code {
border-radius: var(--border-radius-slight);
}
pre, code {
font-family: var(--font-mono);
background-color: var(--code-bg-color);
color: var(--code-text-color);
border: var(--border-gray);
border-radius: var(--border-radius-slight);
}
pre code {
padding: 0;
background: none;
border: none;
}
pre.small {
padding: var(--spacing-md);
}
@media screen and (min-width: 768px) {
h1 { font-size: var(--font-size-3xl); }
h2 { font-size: var(--font-size-2xl); }
h3 { font-size: var(--font-size-xl); }
main {
max-width: 768px;
}
}
</style>
<link rel="stylesheet" href="/assets/styles/index.css" type="text/css" />
</head>
<body>
<body class="feed">
<div class="main-wrapper">
<main>
<section class="main-title">

1
src/assets/styles/index.css
View file

@ -18,6 +18,7 @@
@import url('./pages/books.css') layer(page);
@import url('./pages/blogroll.css') layer(page);
@import url('./pages/contact.css') layer(page);
@import url('./pages/feeds.css') layer(page);
@import url('./pages/links.css') layer(page);
@import url('./pages/music.css') layer(page);
@import url('./pages/post.css') layer(page);

47
src/assets/styles/pages/feeds.css Normal file
View file

@ -0,0 +1,47 @@
.feed {
& .item {
&:not(:last-of-type) {
border-bottom: var(--border-gray);
margin-bottom: var(--spacing-base);
padding-bottom: var(--spacing-base);
}
& .date {
display: block;
color: var(--gray-dark);
font-size: var(--font-size-sm);
margin-bottom: 0;
}
& h3 {
margin-top: 0;
}
& img {
border: var(--border-default);
border-radius: var(--border-radius-slight);
height: auto;
width: 100%;
display: block;
margin-top: var(--sizing-base);
}
}
& p {
&:first-of-type {
margin-top: 0;
}
&:last-of-type {
margin-bottom: 0;
}
}
& ol > li p {
display: inline;
}
& footer {
padding-bottom: var(--spacing-3xl);
}
}

1
src/assets/styles/pages/post.css
View file

@ -13,7 +13,6 @@ youtube-video + .associated-media {
.footnotes {
& .footnotes-list {
margin-bottom: 0;
padding-left: 0;
& li:last-child {
margin-bottom: 0;

8
src/assets/styles/plugins/prism.css
View file

@ -1,5 +1,5 @@
code[class*="language-"],
pre[class*="language-"] {
code,
pre {
color: var(--blue-200);
background: none;
border-radius: var(--border-radius-slight);
@ -15,7 +15,7 @@ pre[class*="language-"] {
hyphens: none;
}
pre[class*="language-"] {
pre {
padding: var(--spacing-lg);
margin: var(--sizing-xl) 0;
overflow: auto;
@ -23,7 +23,7 @@ pre[class*="language-"] {
border: 1px solid var(--gray-200);
}
:not(pre) > code[class*="language-"] {
:not(pre) > code {
padding: var(--spacing-xs);
white-space: normal;
background: var(--gray-1000);

2
src/includes/partials/feeds/rss.liquid
View file

@ -11,7 +11,7 @@
<image>
<title><![CDATA[{{ title }}]]></title>
<link>{{ permalink | absoluteUrl }}</link>
<url>{{ "https://cdn.coryd.dev/" | append: globals.feed_image | append: "?class=w200&amp;v=" | append: appVersion }}</url>
<url>{{ "https://cdn.coryd.dev/" | append: globals.feed_image | append: "?class=w200" }}</url>
<width>144</width>
<height>144</height>
</image>

1
src/pages/feeds/rss/album-releases.liquid
View file

@ -10,5 +10,4 @@ permalink: "/feeds/album-releases"
globals:globals
data:releases
updated:releases[0].release_date
appVersion:appVersion
%}

1
src/pages/feeds/rss/all.liquid
View file

@ -9,5 +9,4 @@ permalink: "/feeds/all"
globals:globals
data:collections.allContent
updated:collections.allContent[0].date
appVersion:appVersion
%}

1
src/pages/feeds/rss/books.liquid
View file

@ -11,5 +11,4 @@ permalink: "/feeds/books"
data:bookData
updated:bookData[0].date
utm_campaign:"books_feed"
appVersion:appVersion
%}

1
src/pages/feeds/rss/links.liquid
View file

@ -9,5 +9,4 @@ permalink: "/feeds/links"
globals:globals
data:links
updated:links[0].date
appVersion:appVersion
%}

1
src/pages/feeds/rss/movies.liquid
View file

@ -10,5 +10,4 @@ permalink: "/feeds/movies"
data:movies.recentlyWatched
updated:movies.recentlyWatched[0].lastWatched
utm_campaign:"movies_feed"
appVersion:appVersion
%}

1
src/pages/feeds/rss/posts.liquid
View file

@ -10,5 +10,4 @@ permalink: "/feeds/posts"
data:posts
updated:posts[0].date
utm_campaign:"posts_feed"
appVersion:appVersion
%}