mirror of
https://github.com/reonokiy/blog.nokiy.net.git
synced 2025-06-15 11:12:54 +02:00
refactor: update and theme configuration
This commit is contained in:
radishzzz
parent
7659bbd1e2
commit
63aa495d8b
19 changed files with 299 additions and 310 deletions
|
|
@ -23,11 +23,11 @@ import remarkSectionize from 'remark-sectionize'
|
|||
// Markdown Extensions
|
||||
import UnoCSS from 'unocss/astro'
|
||||
import { themeConfig } from './src/config'
|
||||
import { AdmonitionComponent } from './src/plugins/rehype-component-admonition.ts'
|
||||
import { GithubCardComponent } from './src/plugins/rehype-component-github-card.ts'
|
||||
import { parseDirectiveNode } from './src/plugins/remark-directive-rehype.ts'
|
||||
import { remarkExcerpt } from './src/plugins/remark-excerpt.ts'
|
||||
import { remarkReadingTime } from './src/plugins/remark-reading-time.ts'
|
||||
import { AdmonitionComponent } from './src/plugins/rehype-component-admonition.mjs'
|
||||
import { GithubCardComponent } from './src/plugins/rehype-component-github-card.mjs'
|
||||
import { parseDirectiveNode } from './src/plugins/remark-directive-rehype.js'
|
||||
import { remarkExcerpt } from './src/plugins/remark-excerpt.js'
|
||||
import { remarkReadingTime } from './src/plugins/remark-reading-time.mjs'
|
||||
|
||||
const { url }: { url: ThemeConfig['site']['url'] } = themeConfig.site
|
||||
|
||||
|
|
@ -69,9 +69,9 @@ export default defineConfig({
|
|||
remarkMath,
|
||||
remarkReadingTime,
|
||||
remarkExcerpt,
|
||||
remarkSectionize,
|
||||
remarkGithubAdmonitionsToDirectives,
|
||||
remarkDirective,
|
||||
remarkSectionize,
|
||||
parseDirectiveNode,
|
||||
],
|
||||
rehypePlugins: [
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@
|
|||
"astro": "^5.1.6",
|
||||
"astro-compress": "^2.3.6",
|
||||
"astro-robots-txt": "^1.0.0",
|
||||
"hastscript": "^9.0.0",
|
||||
"markdown-it": "^14.1.0",
|
||||
"overlayscrollbars": "^2.10.1",
|
||||
"photoswipe": "^5.4.4",
|
||||
|
|
@ -46,23 +47,18 @@
|
|||
},
|
||||
"devDependencies": {
|
||||
"@antfu/eslint-config": "^3.14.0",
|
||||
"@types/hast": "^3.0.4",
|
||||
"@types/markdown-it": "^14.1.2",
|
||||
"@types/mdast": "^4.0.4",
|
||||
"@types/node": "^22.10.6",
|
||||
"@types/sanitize-html": "^2.13.0",
|
||||
"@types/unist": "^3.0.3",
|
||||
"@unocss/eslint-plugin": "^65.4.0",
|
||||
"astro-eslint-parser": "^1.1.0",
|
||||
"eslint": "^9.18.0",
|
||||
"eslint-plugin-astro": "^1.3.1",
|
||||
"hastscript": "^9.0.0",
|
||||
"lint-staged": "^15.3.0",
|
||||
"mdast-util-to-string": "^4.0.0",
|
||||
"reading-time": "^1.5.0",
|
||||
"unocss": "^65.4.0",
|
||||
"unocss-preset-theme": "^0.14.1",
|
||||
"vfile": "^6.0.3"
|
||||
"unocss-preset-theme": "^0.14.1"
|
||||
},
|
||||
"lint-staged": {
|
||||
"*.{js,ts,jsx,tsx,astro}": "eslint --fix"
|
||||
|
|
|
|||
18
pnpm-lock.yaml
generated
18
pnpm-lock.yaml
generated
|
|
@ -41,6 +41,9 @@ importers:
|
|||
astro-robots-txt:
|
||||
specifier: ^1.0.0
|
||||
version: 1.0.0
|
||||
hastscript:
|
||||
specifier: ^9.0.0
|
||||
version: 9.0.0
|
||||
markdown-it:
|
||||
specifier: ^14.1.0
|
||||
version: 14.1.0
|
||||
|
|
@ -99,24 +102,15 @@ importers:
|
|||
'@antfu/eslint-config':
|
||||
specifier: ^3.14.0
|
||||
version: 3.14.0(@typescript-eslint/utils@8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.7.3))(@unocss/eslint-plugin@65.4.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.7.3))(@vue/compiler-sfc@3.5.13)(astro-eslint-parser@1.1.0(typescript@5.7.3))(eslint-plugin-astro@1.3.1(eslint@9.18.0(jiti@2.4.2))(typescript@5.7.3))(eslint@9.18.0(jiti@2.4.2))(typescript@5.7.3)
|
||||
'@types/hast':
|
||||
specifier: ^3.0.4
|
||||
version: 3.0.4
|
||||
'@types/markdown-it':
|
||||
specifier: ^14.1.2
|
||||
version: 14.1.2
|
||||
'@types/mdast':
|
||||
specifier: ^4.0.4
|
||||
version: 4.0.4
|
||||
'@types/node':
|
||||
specifier: ^22.10.6
|
||||
version: 22.10.6
|
||||
'@types/sanitize-html':
|
||||
specifier: ^2.13.0
|
||||
version: 2.13.0
|
||||
'@types/unist':
|
||||
specifier: ^3.0.3
|
||||
version: 3.0.3
|
||||
'@unocss/eslint-plugin':
|
||||
specifier: ^65.4.0
|
||||
version: 65.4.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.7.3)
|
||||
|
|
@ -129,9 +123,6 @@ importers:
|
|||
eslint-plugin-astro:
|
||||
specifier: ^1.3.1
|
||||
version: 1.3.1(eslint@9.18.0(jiti@2.4.2))(typescript@5.7.3)
|
||||
hastscript:
|
||||
specifier: ^9.0.0
|
||||
version: 9.0.0
|
||||
lint-staged:
|
||||
specifier: ^15.3.0
|
||||
version: 15.3.0
|
||||
|
|
@ -147,9 +138,6 @@ importers:
|
|||
unocss-preset-theme:
|
||||
specifier: ^0.14.1
|
||||
version: 0.14.1(@unocss/core@65.4.0)
|
||||
vfile:
|
||||
specifier: ^6.0.3
|
||||
version: 6.0.3
|
||||
|
||||
packages:
|
||||
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@ interface Props {
|
|||
|
||||
const { postTitle, postDescription, postImage } = Astro.props
|
||||
const { title, subtitle, description, author, url, favicon } = themeConfig.site
|
||||
const { language } = themeConfig.global
|
||||
const { light: { backgroundStart: lightMode }, dark: { backgroundStart: darkMode } } = themeConfig.color
|
||||
const { language } = themeConfig.global
|
||||
const { verification = {}, twitterID = '', facebookID = '', facebookLink = '', googleAnalyticsID = '', umamiAnalyticsID = '', siteScreenshot = '' } = themeConfig.seo ?? {}
|
||||
const { google = '', bing = '', yandex = '', baidu = '' } = verification
|
||||
const { cdn, commentURL = '', imageHostURL = '', customGoogleAnalyticsURL = '', customUmamiAnalyticsURL = '', customUmamiAnalyticsJS = '' } = themeConfig.preload
|
||||
|
|
@ -35,11 +35,12 @@ const { cdn, commentURL = '', imageHostURL = '', customGoogleAnalyticsURL = '',
|
|||
|
||||
<!-- Preload -->
|
||||
<link rel="preconnect" href={cdn} />
|
||||
<link rel="preload" href={`${cdn}gh/radishzzz/astro-theme-retypeset@master/src/style/font.css`} as="style" />
|
||||
<link rel="preload" href={`${cdn}/gh/radishzzz/astro-theme-retypeset@master/src/style/font.css`} as="style" />
|
||||
{commentURL && <link rel="dns-prefetch" href={commentURL} />}
|
||||
{imageHostURL && <link rel="dns-prefetch" href={imageHostURL} />}
|
||||
{customGoogleAnalyticsURL && <link rel="dns-prefetch" href={customGoogleAnalyticsURL} />}
|
||||
{customUmamiAnalyticsURL && <link rel="dns-prefetch" href={customUmamiAnalyticsURL} />}
|
||||
<link rel="stylesheet" href={`${cdn}/gh/radishzzz/astro-theme-retypeset@master/src/style/font.css`} />
|
||||
|
||||
<!-- Link -->
|
||||
<link rel="author" href={url} />
|
||||
|
|
@ -89,15 +90,11 @@ const { cdn, commentURL = '', imageHostURL = '', customGoogleAnalyticsURL = '',
|
|||
<>
|
||||
<script
|
||||
type="text/partytown"
|
||||
async
|
||||
defer
|
||||
crossorigin="anonymous"
|
||||
src={`${customGoogleAnalyticsURL || 'https://www.googletagmanager.com'}/gtag/js?id=${googleAnalyticsID}`}
|
||||
/>
|
||||
<script
|
||||
type="text/partytown"
|
||||
async
|
||||
defer
|
||||
define:vars={{ googleAnalyticsID, customGoogleAnalyticsURL }}
|
||||
>
|
||||
window.dataLayer = window.dataLayer || []
|
||||
|
|
@ -107,7 +104,7 @@ const { cdn, commentURL = '', imageHostURL = '', customGoogleAnalyticsURL = '',
|
|||
gtag('js', new Date())
|
||||
if (customGoogleAnalyticsURL) {
|
||||
gtag('config', googleAnalyticsID, {
|
||||
transport_url: customGoogleAnalyticsURL.replace(/\/$/, ''),
|
||||
transport_url: customGoogleAnalyticsURL,
|
||||
})
|
||||
}
|
||||
else {
|
||||
|
|
@ -123,8 +120,6 @@ const { cdn, commentURL = '', imageHostURL = '', customGoogleAnalyticsURL = '',
|
|||
umamiAnalyticsID && (
|
||||
<script
|
||||
type="text/partytown"
|
||||
async
|
||||
defer
|
||||
crossorigin="anonymous"
|
||||
data-website-id={umamiAnalyticsID}
|
||||
src={customUmamiAnalyticsJS || 'https://analytics.umami.is/script.js'}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ export const themeConfig: ThemeConfig = {
|
|||
description: '一个优美的博客主题',
|
||||
author: 'radishzz',
|
||||
url: 'https://retypeset.netlify.app',
|
||||
favicon: '#', // only support webp, svg, png
|
||||
favicon: '', // support only webp, svg, png
|
||||
},
|
||||
// SITE INFORMATION >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> END
|
||||
|
||||
|
|
@ -40,10 +40,10 @@ export const themeConfig: ThemeConfig = {
|
|||
// COMMENT SETTINGS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> START
|
||||
comment: {
|
||||
waline: {
|
||||
serverURL: '#',
|
||||
serverURL: '',
|
||||
emoji: [
|
||||
'#',
|
||||
'#',
|
||||
'',
|
||||
'',
|
||||
],
|
||||
search: true,
|
||||
imageUploader: true,
|
||||
|
|
@ -53,25 +53,25 @@ export const themeConfig: ThemeConfig = {
|
|||
|
||||
// SEO SETTINGS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> START
|
||||
seo: {
|
||||
twitterID: '#', // @twitter ID
|
||||
facebookID: '#', // @facebook ID
|
||||
facebookLink: '#', // facebook profile link
|
||||
twitterID: '', // @twitter ID
|
||||
facebookID: '', // @facebook ID
|
||||
facebookLink: '', // facebook profile link
|
||||
// site verification
|
||||
verification: {
|
||||
google: '#',
|
||||
bing: '#',
|
||||
yandex: '#',
|
||||
baidu: '#',
|
||||
google: '',
|
||||
bing: '',
|
||||
yandex: '',
|
||||
baidu: '',
|
||||
},
|
||||
// site analytics
|
||||
googleAnalyticsID: '#',
|
||||
umamiAnalyticsID: '#',
|
||||
googleAnalyticsID: '',
|
||||
umamiAnalyticsID: '',
|
||||
// follow verification
|
||||
follow: {
|
||||
feedID: '#',
|
||||
userID: '#',
|
||||
feedID: '',
|
||||
userID: '',
|
||||
},
|
||||
siteScreenshot: '#', // Take a screenshot of website homepage to show on twitter card
|
||||
siteScreenshot: '', // Take a screenshot of website homepage to show on twitter card
|
||||
},
|
||||
// SEO SETTINGS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> END
|
||||
|
||||
|
|
@ -94,13 +94,14 @@ export const themeConfig: ThemeConfig = {
|
|||
|
||||
// PRELOAD SETTINGS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> START
|
||||
preload: {
|
||||
cdn: 'https://cdn.jsdelivr.net/', // Recommended to keep default, unless you can proxy https://cdn.jsdelivr.net/gh/radishzzz/astro-theme-retypeset@master/src/style/font.css
|
||||
cdn: 'https://cdn.jsdelivr.net', // Recommended to keep default, unless you can proxy https://cdn.jsdelivr.net/gh/radishzzz/astro-theme-retypeset@master/src/style/font.css
|
||||
commentURL: '', // https://comment.example.com/
|
||||
imageHostURL: '', // https://image.example.com/
|
||||
// If you proxy analytics requests to the custom domain, you can fill in below
|
||||
customGoogleAnalyticsURL: '', // https://whatever.example.com/
|
||||
customUmamiAnalyticsURL: '', // https://whatever.example.com/
|
||||
customUmamiAnalyticsJS: '', // https://whatever.example.com/whatever.js
|
||||
lazyload: false,
|
||||
},
|
||||
// PRELOAD SETTINGS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> END
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,12 +5,16 @@ const postsCollection = defineCollection({
|
|||
title: z.string(),
|
||||
published: z.date(),
|
||||
updated: z.date().optional(),
|
||||
draft: z.boolean().optional().default(false),
|
||||
description: z.string().optional().default(''),
|
||||
tags: z.array(z.string()).optional().default([]),
|
||||
// For Open Graph
|
||||
description: z.string().optional().default(''),
|
||||
image: z.string().optional().default(''),
|
||||
// Custom Settings
|
||||
lang: z.string().optional().default(''),
|
||||
slug: z.string().optional().default(''),
|
||||
toc: z.boolean().optional().default(false),
|
||||
pin: z.boolean().optional().default(false),
|
||||
draft: z.boolean().optional().default(false),
|
||||
}),
|
||||
})
|
||||
export const collections = {
|
||||
|
|
|
|||
33
src/plugins/rehype-component-admonition.mjs
Normal file
33
src/plugins/rehype-component-admonition.mjs
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
/// <reference types="mdast" />
|
||||
import { h } from 'hastscript'
|
||||
|
||||
/**
|
||||
* Creates an admonition component.
|
||||
*
|
||||
* param {object} properties - The properties of the component.
|
||||
* param {string} [properties.title] - An optional title.
|
||||
* param {('tip'|'note'|'important'|'caution'|'warning')} type - The admonition type.
|
||||
* param {import('mdast').RootContent[]} children - The children elements of the component.
|
||||
* returns {import('mdast').Parent} The created admonition component.
|
||||
*/
|
||||
export function AdmonitionComponent(properties, children, type) {
|
||||
if (!Array.isArray(children) || children.length === 0) {
|
||||
return h(
|
||||
'div',
|
||||
{ class: 'hidden' },
|
||||
'Invalid admonition directive. (Admonition directives must be of block type ":::note{name="name"} <content> :::")',
|
||||
)
|
||||
}
|
||||
|
||||
let label = null
|
||||
if (properties && properties['has-directive-label']) {
|
||||
label = children[0] // The first child is the label
|
||||
children = children.slice(1)
|
||||
label.tagName = 'div' // Change the tag <p> to <div>
|
||||
}
|
||||
|
||||
return h(`blockquote`, { class: `admonition bdm-${type}` }, [
|
||||
h('span', { class: `bdm-title` }, label || type.toUpperCase()),
|
||||
...children,
|
||||
])
|
||||
}
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
import type { Element, Properties as HastProperties, Node } from 'hast'
|
||||
import { h } from 'hastscript'
|
||||
|
||||
interface AdmonitionProperties extends HastProperties {
|
||||
'title'?: string
|
||||
'has-directive-label'?: boolean
|
||||
}
|
||||
|
||||
type AdmonitionType = 'tip' | 'note' | 'important' | 'caution' | 'warning'
|
||||
|
||||
const ADMONITION_CLASS_PREFIX = 'bdm-'
|
||||
const DEFAULT_ERROR_MESSAGE = 'Invalid admonition directive. (Admonition directives must be of block type ":::note{name="name"} <content> :::")'
|
||||
|
||||
export function AdmonitionComponent(
|
||||
properties: AdmonitionProperties,
|
||||
type: AdmonitionType,
|
||||
children: Node[],
|
||||
): Element {
|
||||
if (!Array.isArray(children) || children.length === 0) {
|
||||
console.warn('Invalid admonition directive: empty or invalid children')
|
||||
return h('div', { class: 'hidden' }, DEFAULT_ERROR_MESSAGE)
|
||||
}
|
||||
|
||||
let label: Element | string | null = null
|
||||
|
||||
if (properties && properties['has-directive-label']) {
|
||||
const [firstChild, ...restChildren] = children
|
||||
children = restChildren
|
||||
|
||||
if (firstChild && firstChild.type === 'element') {
|
||||
label = firstChild as Element
|
||||
label.tagName = 'div'
|
||||
}
|
||||
else {
|
||||
label = ''
|
||||
}
|
||||
}
|
||||
|
||||
return h('blockquote', { class: `${ADMONITION_CLASS_PREFIX}${type}` }, [
|
||||
h('span', { class: 'bdm-title' }, label || type.toUpperCase()),
|
||||
...(children as Element[]),
|
||||
] as Element[])
|
||||
}
|
||||
105
src/plugins/rehype-component-github-card.mjs
Normal file
105
src/plugins/rehype-component-github-card.mjs
Normal file
|
|
@ -0,0 +1,105 @@
|
|||
/// <reference types="mdast" />
|
||||
import { h } from 'hastscript'
|
||||
|
||||
/**
|
||||
* Creates a GitHub Card component.
|
||||
*
|
||||
* param {object} properties - The properties of the component.
|
||||
* param {string} properties.repo - The GitHub repository in the format "owner/repo".
|
||||
* param {import('mdast').RootContent[]} children - The children elements of the component.
|
||||
* returns {import('mdast').Parent} The created GitHub Card component.
|
||||
*/
|
||||
export function GithubCardComponent(properties, children) {
|
||||
if (Array.isArray(children) && children.length !== 0) {
|
||||
return h('div', { class: 'hidden' }, [
|
||||
'Invalid directive. ("github" directive must be leaf type "::github{repo="owner/repo"}")',
|
||||
])
|
||||
}
|
||||
|
||||
if (!properties.repo || !properties.repo.includes('/')) {
|
||||
return h(
|
||||
'div',
|
||||
{ class: 'hidden' },
|
||||
'Invalid repository. ("repo" attribute must be in the format "owner/repo")',
|
||||
)
|
||||
}
|
||||
|
||||
const repo = properties.repo
|
||||
const cardUuid = `GC${Math.random().toString(36).slice(-6)}` // Collisions are not important
|
||||
|
||||
const nAvatar = h(`div#${cardUuid}-avatar`, { class: 'gc-avatar' })
|
||||
const nLanguage = h(
|
||||
`span#${cardUuid}-language`,
|
||||
{ class: 'gc-language' },
|
||||
'Waiting...',
|
||||
)
|
||||
|
||||
const nTitle = h(`div`, { class: 'gc-titlebar' }, [
|
||||
h('div', { class: 'gc-titlebar-left' }, [
|
||||
h('div', { class: 'gc-owner' }, [
|
||||
nAvatar,
|
||||
h('div', { class: 'gc-user' }, repo.split('/')[0]),
|
||||
]),
|
||||
h('div', { class: 'gc-divider' }, '/'),
|
||||
h('div', { class: 'gc-repo' }, repo.split('/')[1]),
|
||||
]),
|
||||
h('div', { class: 'github-logo' }),
|
||||
])
|
||||
|
||||
const nDescription = h(
|
||||
`div#${cardUuid}-description`,
|
||||
{ class: 'gc-description' },
|
||||
'Waiting for api.github.com...',
|
||||
)
|
||||
|
||||
const nStars = h(`div#${cardUuid}-stars`, { class: 'gc-stars' }, '00K')
|
||||
const nForks = h(`div#${cardUuid}-forks`, { class: 'gc-forks' }, '0K')
|
||||
const nLicense = h(`div#${cardUuid}-license`, { class: 'gc-license' }, '0K')
|
||||
|
||||
const nScript = h(
|
||||
`script#${cardUuid}-script`,
|
||||
{ type: 'text/javascript', defer: true },
|
||||
`
|
||||
fetch('https://api.github.com/repos/${repo}', { referrerPolicy: "no-referrer" }).then(response => response.json()).then(data => {
|
||||
if (data.description) {
|
||||
document.getElementById('${cardUuid}-description').innerText = data.description.replace(/:[a-zA-Z0-9_]+:/g, '');
|
||||
} else {
|
||||
document.getElementById('${cardUuid}-description').innerText = "Description not set"
|
||||
}
|
||||
document.getElementById('${cardUuid}-language').innerText = data.language;
|
||||
document.getElementById('${cardUuid}-forks').innerText = Intl.NumberFormat('en-us', { notation: "compact", maximumFractionDigits: 1 }).format(data.forks).replaceAll("\u202F", '');
|
||||
document.getElementById('${cardUuid}-stars').innerText = Intl.NumberFormat('en-us', { notation: "compact", maximumFractionDigits: 1 }).format(data.stargazers_count).replaceAll("\u202F", '');
|
||||
const avatarEl = document.getElementById('${cardUuid}-avatar');
|
||||
avatarEl.style.backgroundImage = 'url(' + data.owner.avatar_url + ')';
|
||||
avatarEl.style.backgroundColor = 'transparent';
|
||||
if (data.license?.spdx_id) {
|
||||
document.getElementById('${cardUuid}-license').innerText = data.license?.spdx_id
|
||||
} else {
|
||||
document.getElementById('${cardUuid}-license').innerText = "no-license"
|
||||
};
|
||||
document.getElementById('${cardUuid}-card').classList.remove("fetch-waiting");
|
||||
console.log("[GITHUB-CARD] Loaded card for ${repo} | ${cardUuid}.")
|
||||
}).catch(err => {
|
||||
const c = document.getElementById('${cardUuid}-card');
|
||||
c.classList.add("fetch-error");
|
||||
console.warn("[GITHUB-CARD] (Error) Loading card for ${repo} | ${cardUuid}.")
|
||||
})
|
||||
`,
|
||||
)
|
||||
|
||||
return h(
|
||||
`a#${cardUuid}-card`,
|
||||
{
|
||||
class: 'card-github fetch-waiting no-styling',
|
||||
href: `https://github.com/${repo}`,
|
||||
target: '_blank',
|
||||
repo,
|
||||
},
|
||||
[
|
||||
nTitle,
|
||||
nDescription,
|
||||
h('div', { class: 'gc-infobar' }, [nStars, nForks, nLicense, nLanguage]),
|
||||
nScript,
|
||||
],
|
||||
)
|
||||
}
|
||||
|
|
@ -1,106 +0,0 @@
|
|||
/// <reference types="mdast" />
|
||||
import type { RootContent } from 'mdast'
|
||||
import { h } from 'hastscript'
|
||||
|
||||
export function GithubCardComponent(
|
||||
properties: { repo: string },
|
||||
children: RootContent[],
|
||||
): import('mdast').Parent {
|
||||
if (Array.isArray(children) && children.length !== 0) {
|
||||
return h('div', { class: 'hidden' }, [
|
||||
'Invalid directive. ("github" directive must be leaf type "::github{repo="owner/repo"}")',
|
||||
]) as unknown as import('mdast').Parent
|
||||
}
|
||||
|
||||
if (!properties.repo || !properties.repo.includes('/')) {
|
||||
return h(
|
||||
'div',
|
||||
{ class: 'hidden' },
|
||||
'Invalid repository. ("repo" attributte must be in the format "owner/repo")',
|
||||
) as unknown as import('mdast').Parent
|
||||
}
|
||||
|
||||
const repo = properties.repo
|
||||
const cardUuid = `GC${Math.random().toString(36).slice(-6)}`
|
||||
|
||||
const nAvatar = h(`div#${cardUuid}-avatar`, { class: 'gc-avatar' })
|
||||
const nLanguage = h(
|
||||
`span#${cardUuid}-language`,
|
||||
{ class: 'gc-language' },
|
||||
'Waiting...',
|
||||
)
|
||||
|
||||
const nTitle = h(`div`, { class: 'gc-titlebar' }, [
|
||||
h('div', { class: 'gc-titlebar-left' }, [
|
||||
h('div', { class: 'gc-owner' }, [
|
||||
nAvatar,
|
||||
h('div', { class: 'gc-user' }, repo.split('/')[0]),
|
||||
]),
|
||||
h('div', { class: 'gc-divider' }, '/'),
|
||||
h('div', { class: 'gc-repo' }, repo.split('/')[1]),
|
||||
]),
|
||||
h('div', { class: 'github-logo' }),
|
||||
])
|
||||
|
||||
const nDescription = h(
|
||||
`div#${cardUuid}-description`,
|
||||
{ class: 'gc-description' },
|
||||
'Waiting for api.github.com...',
|
||||
)
|
||||
|
||||
const nStars = h(`div#${cardUuid}-stars`, { class: 'gc-stars' }, '00K')
|
||||
const nForks = h(`div#${cardUuid}-forks`, { class: 'gc-forks' }, '0K')
|
||||
const nLicense = h(`div#${cardUuid}-license`, { class: 'gc-license' }, '0K')
|
||||
|
||||
const nScript = h(
|
||||
`script#${cardUuid}-script`,
|
||||
{ type: 'text/javascript', defer: true },
|
||||
`
|
||||
fetch('https://api.github.com/repos/${repo}', {
|
||||
referrerPolicy: "no-referrer",
|
||||
headers: {
|
||||
'Accept': 'application/vnd.github.v3+json',
|
||||
},
|
||||
signal: AbortSignal.timeout(5000)
|
||||
}).then(response => {
|
||||
if (!response.ok)
|
||||
throw new Error(\`HTTP error! status: \${response.status}\`)
|
||||
return response.json()
|
||||
}).then(data => {
|
||||
const elements = {
|
||||
description: document.getElementById('${cardUuid}-description'),
|
||||
language: document.getElementById('${cardUuid}-language'),
|
||||
stars: document.getElementById('${cardUuid}-stars'),
|
||||
}
|
||||
|
||||
elements.description.innerText = data.description?.replace(/:[a-zA-Z0-9_]+:/g, '') ?? 'Description not set'
|
||||
elements.language.innerText = data.language
|
||||
elements.stars.innerText = Intl.NumberFormat('en-us', { notation: "compact", maximumFractionDigits: 1 }).format(data.stargazers_count).replaceAll("\\u202F", '')
|
||||
|
||||
const avatarEl = document.getElementById('${cardUuid}-avatar')
|
||||
avatarEl.style.backgroundImage = 'url(' + data.owner.avatar_url + ')'
|
||||
avatarEl.style.backgroundColor = 'transparent'
|
||||
|
||||
document.getElementById('${cardUuid}-license').innerText = data.license?.spdx_id ?? 'no-license'
|
||||
document.getElementById('${cardUuid}-card').classList.remove("fetch-waiting")
|
||||
console.log("[GITHUB-CARD] Loaded card for ${repo} | ${cardUuid}.")
|
||||
}).catch(err => {
|
||||
const c = document.getElementById('${cardUuid}-card')
|
||||
c.classList.add("fetch-error")
|
||||
document.getElementById('${cardUuid}-description').innerText = "Failed to load repository data"
|
||||
console.warn("[GITHUB-CARD] (Error) Loading card for ${repo} | ${cardUuid}:", err.message)
|
||||
})
|
||||
`,
|
||||
)
|
||||
|
||||
return h(
|
||||
`a#${cardUuid}-card`,
|
||||
{
|
||||
class: 'card-github fetch-waiting no-styling',
|
||||
href: `https://github.com/${repo}`,
|
||||
target: '_blank',
|
||||
repo,
|
||||
},
|
||||
[nTitle, nDescription, h('div', { class: 'gc-infobar' }, [nStars, nForks, nLicense, nLanguage]), nScript],
|
||||
) as unknown as import('mdast').Parent
|
||||
}
|
||||
30
src/plugins/remark-directive-rehype.js
Normal file
30
src/plugins/remark-directive-rehype.js
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
// biome-ignore lint/suspicious/noShadowRestrictedNames: <explanation>
|
||||
import { h } from 'hastscript'
|
||||
import { visit } from 'unist-util-visit'
|
||||
|
||||
export function parseDirectiveNode() {
|
||||
return (tree, _data) => {
|
||||
visit(tree, (node) => {
|
||||
if (
|
||||
node.type === 'containerDirective'
|
||||
|| node.type === 'leafDirective'
|
||||
|| node.type === 'textDirective'
|
||||
) {
|
||||
const data = node.data || (node.data = {})
|
||||
node.attributes = node.attributes || {}
|
||||
if (
|
||||
node.children.length > 0
|
||||
&& node.children[0].data
|
||||
&& node.children[0].data.directiveLabel
|
||||
) {
|
||||
// Add a flag to the node to indicate that it has a directive label
|
||||
node.attributes['has-directive-label'] = true
|
||||
}
|
||||
const hast = h(node.name, node.attributes)
|
||||
|
||||
data.hName = hast.tagName
|
||||
data.hProperties = hast.properties
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
import type { Node } from 'unist'
|
||||
import { h } from 'hastscript'
|
||||
import { visit } from 'unist-util-visit'
|
||||
|
||||
interface DirectiveNode extends Node {
|
||||
type: 'containerDirective' | 'leafDirective' | 'textDirective'
|
||||
name: string
|
||||
attributes?: Record<string, any>
|
||||
children: Array<{
|
||||
data?: {
|
||||
directiveLabel?: boolean
|
||||
}
|
||||
}>
|
||||
data?: {
|
||||
hName?: string
|
||||
hProperties?: Record<string, any>
|
||||
}
|
||||
}
|
||||
|
||||
export function parseDirectiveNode() {
|
||||
return (tree: Node) => {
|
||||
visit(tree, (node: unknown) => {
|
||||
const directiveNode = node as DirectiveNode
|
||||
if (
|
||||
directiveNode.type === 'containerDirective'
|
||||
|| directiveNode.type === 'leafDirective'
|
||||
|| directiveNode.type === 'textDirective'
|
||||
) {
|
||||
const data = directiveNode.data || (directiveNode.data = {})
|
||||
directiveNode.attributes = directiveNode.attributes || {}
|
||||
|
||||
if (directiveNode.children[0]?.data?.directiveLabel)
|
||||
directiveNode.attributes['has-directive-label'] = true
|
||||
|
||||
const hast = h(directiveNode.name, directiveNode.attributes)
|
||||
data.hName = hast.tagName
|
||||
data.hProperties = hast.properties
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
16
src/plugins/remark-excerpt.js
Normal file
16
src/plugins/remark-excerpt.js
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
import { toString } from 'mdast-util-to-string'
|
||||
|
||||
/* Use the post's first paragraph as the excerpt */
|
||||
export function remarkExcerpt() {
|
||||
return (tree, { data }) => {
|
||||
let excerpt = ''
|
||||
for (const node of tree.children) {
|
||||
if (node.type !== 'paragraph') {
|
||||
continue
|
||||
}
|
||||
excerpt = toString(node)
|
||||
break
|
||||
}
|
||||
data.astro.frontmatter.excerpt = excerpt
|
||||
}
|
||||
}
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import type { Root } from 'mdast'
|
||||
import type { VFile } from 'vfile'
|
||||
import { toString } from 'mdast-util-to-string'
|
||||
|
||||
export function remarkExcerpt() {
|
||||
return function (tree: Root, file: VFile) {
|
||||
const firstParagraph = tree.children.find(node => node.type === 'paragraph')
|
||||
const excerpt = firstParagraph ? toString(firstParagraph) : ''
|
||||
const frontmatter = (file.data.astro ??= {}).frontmatter ??= {}
|
||||
frontmatter.excerpt = excerpt
|
||||
}
|
||||
}
|
||||
15
src/plugins/remark-reading-time.mjs
Normal file
15
src/plugins/remark-reading-time.mjs
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
// biome-ignore lint/suspicious/noShadowRestrictedNames: <explanation>
|
||||
import { toString } from 'mdast-util-to-string'
|
||||
import getReadingTime from 'reading-time'
|
||||
|
||||
export function remarkReadingTime() {
|
||||
return (tree, { data }) => {
|
||||
const textOnPage = toString(tree)
|
||||
const readingTime = getReadingTime(textOnPage)
|
||||
data.astro.frontmatter.minutes = Math.max(
|
||||
1,
|
||||
Math.round(readingTime.minutes),
|
||||
)
|
||||
data.astro.frontmatter.words = readingTime.words
|
||||
}
|
||||
}
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
import type { Root } from 'mdast'
|
||||
import type { VFile } from 'vfile'
|
||||
import { toString } from 'mdast-util-to-string'
|
||||
import getReadingTime from 'reading-time'
|
||||
|
||||
export function remarkReadingTime() {
|
||||
return function (tree: Root, file: VFile) {
|
||||
const textOnPage = toString(tree)
|
||||
const readingTime = getReadingTime(textOnPage)
|
||||
const frontmatter = (file.data.astro ??= {}).frontmatter ??= {}
|
||||
frontmatter.minutes = Math.max(1, Math.round(readingTime.minutes))
|
||||
frontmatter.words = readingTime.words
|
||||
}
|
||||
}
|
||||
0
src/styles/font.css
Normal file
0
src/styles/font.css
Normal file
1
src/types/index.d.ts
vendored
1
src/types/index.d.ts
vendored
|
|
@ -80,6 +80,7 @@ export interface ThemeConfig {
|
|||
customGoogleAnalyticsURL?: string
|
||||
customUmamiAnalyticsURL?: string
|
||||
customUmamiAnalyticsJS?: string
|
||||
lazyload: boolean
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,10 @@ export type PostsGroupByYear = Map<number, Post[]>
|
|||
export async function getPosts() {
|
||||
const posts = await getCollection(
|
||||
'posts',
|
||||
({ data }: Post) => import.meta.env.DEV || !data.draft,
|
||||
({ data }: Post) => {
|
||||
const shouldInclude = (import.meta.env.DEV || !data.draft) && !data.pin
|
||||
return shouldInclude
|
||||
},
|
||||
)
|
||||
|
||||
return posts.sort((a: Post, b: Post) =>
|
||||
|
|
@ -17,46 +20,19 @@ export async function getPosts() {
|
|||
)
|
||||
}
|
||||
|
||||
// Group posts by tags
|
||||
export async function sortPostsByTags() {
|
||||
const posts = await getPosts()
|
||||
const tagMap = new Map<string, Post[]>()
|
||||
|
||||
posts.forEach((post: Post) => {
|
||||
if (post.data.tags && post.data.tags.length > 0) {
|
||||
post.data.tags.forEach((tag: string) => {
|
||||
if (!tagMap.has(tag)) {
|
||||
tagMap.set(tag, [])
|
||||
}
|
||||
tagMap.get(tag)?.push(post)
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
return tagMap
|
||||
}
|
||||
|
||||
// Get posts by specific tag
|
||||
export async function getPostsByTag(tag: string) {
|
||||
const posts = await getPosts()
|
||||
|
||||
return posts.filter((post: Post) =>
|
||||
post.data.tags?.includes(tag),
|
||||
// Get pinned posts
|
||||
export async function getPinnedPosts() {
|
||||
const posts = await getCollection(
|
||||
'posts',
|
||||
({ data }: Post) => {
|
||||
const shouldInclude = (import.meta.env.DEV || !data.draft) && data.pin
|
||||
return shouldInclude
|
||||
},
|
||||
)
|
||||
}
|
||||
|
||||
// Get all tags list
|
||||
export async function getAllTags() {
|
||||
const posts = await getPosts()
|
||||
const tags = new Set<string>()
|
||||
|
||||
posts.forEach((post: Post) => {
|
||||
post.data.tags?.forEach((tag: string) =>
|
||||
tags.add(tag),
|
||||
)
|
||||
})
|
||||
|
||||
return Array.from(tags)
|
||||
return posts.sort((a: Post, b: Post) =>
|
||||
b.data.published.valueOf() - a.data.published.valueOf(),
|
||||
)
|
||||
}
|
||||
|
||||
// Group posts by year and sort
|
||||
|
|
@ -89,3 +65,48 @@ export async function getPostsByYear(): Promise<PostsGroupByYear> {
|
|||
|
||||
return new Map([...yearMap.entries()].sort((a, b) => b[0] - a[0]))
|
||||
}
|
||||
|
||||
// Group posts by tags
|
||||
export async function sortPostsByTags() {
|
||||
const posts = await getPosts()
|
||||
const tagMap = new Map<string, Post[]>()
|
||||
|
||||
posts.forEach((post: Post) => {
|
||||
if (post.data.tags && post.data.tags.length > 0) {
|
||||
post.data.tags.forEach((tag: string) => {
|
||||
if (!tagMap.has(tag)) {
|
||||
tagMap.set(tag, [])
|
||||
}
|
||||
tagMap.get(tag)?.push(post)
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
return tagMap
|
||||
}
|
||||
|
||||
// Get posts by specific tag
|
||||
export async function getPostsByTag(tag: string) {
|
||||
const posts = await getPosts()
|
||||
|
||||
return posts.filter((post: Post) =>
|
||||
post.data.tags?.includes(tag),
|
||||
)
|
||||
}
|
||||
|
||||
// Get all tags list
|
||||
export async function getAllTags() {
|
||||
const posts = await getCollection(
|
||||
'posts',
|
||||
({ data }: Post) => import.meta.env.DEV || !data.draft,
|
||||
)
|
||||
const tags = new Set<string>()
|
||||
|
||||
posts.forEach((post: Post) => {
|
||||
post.data.tags?.forEach((tag: string) =>
|
||||
tags.add(tag),
|
||||
)
|
||||
})
|
||||
|
||||
return Array.from(tags)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue