From c2e712d61f524b86cccf8c9c732417006487ca55 Mon Sep 17 00:00:00 2001 From: oriverk Date: Thu, 26 Sep 2024 00:24:39 +0900 Subject: [PATCH] fix: change components from astro to svelte --- .env.example | 2 - astro.config.ts | 28 +- site.config.ts | 5 - .../{ActivityDay.astro => ActivityDay.svelte} | 10 +- ...ActivityWeek.astro => ActivityWeek.svelte} | 25 +- .../{ColorLegend.astro => ColorLegend.svelte} | 19 +- .../{MonthLegend.astro => MonthLegend.svelte} | 23 +- .../{index.astro => index.svelte} | 28 +- .../{FeedCard.astro => FeedCard.svelte} | 12 +- src/components/FeedList.astro | 38 --- src/components/Hero.astro | 106 -------- src/components/Hero.svelte | 124 +++++++++ src/components/IconGenerator.svelte | 2 +- .../{PostCard.astro => PostCard.svelte} | 25 +- ...Pagination.astro => PostPagination.svelte} | 53 ++-- .../{PostTag.astro => PostTag.svelte} | 20 +- ...sitoryCard.astro => RepositoryCard.svelte} | 49 ++-- src/components/RepositoryList.astro | 36 --- src/components/Search/Hit.svelte | 4 +- src/components/Search/SearchButton.svelte | 19 +- src/components/Search/SearchIcon.svelte | 66 ----- src/components/Search/SearchInput.svelte | 8 +- src/components/Search/index.svelte | 2 +- src/components/SearchButton.astro | 69 ----- src/components/markdown/AstroEmbed.astro | 8 +- src/components/markdown/AstroLink.astro | 4 +- src/components/markdown/EmbedTwitter.astro | 10 +- src/components/markdown/LinkCard.astro | 6 +- src/components/ui/{Card.astro => Card.svelte} | 17 +- ...entWrapper.astro => ContentWrapper.svelte} | 14 +- .../ui/{Details.astro => Details.svelte} | 21 +- src/components/ui/Dialog.svelte | 20 +- src/components/ui/{Icon.astro => Icon.svelte} | 31 ++- src/components/ui/Markdown.astro | 129 --------- src/components/ui/Markdown.svelte | 19 ++ src/components/ui/Toc/TocList.astro | 27 -- src/components/ui/Toc/TocList.svelte | 29 ++ src/components/ui/Toc/index.astro | 29 -- src/components/ui/Toc/index.svelte | 29 ++ src/content/blog/20240417-embed-contnets.mdx | 31 +++ src/content/config.ts | 6 +- src/layouts/Header.astro | 2 +- src/layouts/Layout.astro | 20 +- src/layouts/MarkdownLayout.astro | 4 +- src/pages/404.astro | 2 +- src/pages/[...slug].astro | 4 +- src/pages/api/og/[...path].ts | 6 +- src/pages/blog/[...page].astro | 6 +- src/pages/blog/[...slug].astro | 14 +- src/pages/blog/tags/[tag]/[...page].astro | 8 +- src/pages/icon.astro | 2 +- src/pages/index.astro | 116 ++++---- src/styles/markdown.css | 249 ++++++++++-------- src/types/oembed.ts | 12 +- src/utils/algolia.ts | 35 --- src/utils/getBlog.ts | 6 +- src/utils/getOgImage.ts | 4 +- src/utils/github/getUserContent.ts | 12 +- 58 files changed, 735 insertions(+), 970 deletions(-) rename src/components/ActivityCalendar/{ActivityDay.astro => ActivityDay.svelte} (75%) rename src/components/ActivityCalendar/{ActivityWeek.astro => ActivityWeek.svelte} (57%) rename src/components/ActivityCalendar/{ColorLegend.astro => ColorLegend.svelte} (71%) rename src/components/ActivityCalendar/{MonthLegend.astro => MonthLegend.svelte} (64%) rename src/components/ActivityCalendar/{index.astro => index.svelte} (85%) rename src/components/{FeedCard.astro => FeedCard.svelte} (78%) delete mode 100644 src/components/FeedList.astro delete mode 100644 src/components/Hero.astro create mode 100644 src/components/Hero.svelte rename src/components/{PostCard.astro => PostCard.svelte} (80%) rename src/components/{PostPagination.astro => PostPagination.svelte} (66%) rename src/components/{PostTag.astro => PostTag.svelte} (58%) rename src/components/{RepositoryCard.astro => RepositoryCard.svelte} (77%) delete mode 100644 src/components/RepositoryList.astro delete mode 100644 src/components/Search/SearchIcon.svelte delete mode 100644 src/components/SearchButton.astro rename src/components/ui/{Card.astro => Card.svelte} (59%) rename src/components/ui/{ContentWrapper.astro => ContentWrapper.svelte} (58%) rename src/components/ui/{Details.astro => Details.svelte} (65%) rename src/components/ui/{Icon.astro => Icon.svelte} (81%) delete mode 100644 src/components/ui/Markdown.astro create mode 100644 src/components/ui/Markdown.svelte delete mode 100644 src/components/ui/Toc/TocList.astro create mode 100644 src/components/ui/Toc/TocList.svelte delete mode 100644 src/components/ui/Toc/index.astro create mode 100644 src/components/ui/Toc/index.svelte create mode 100644 src/content/blog/20240417-embed-contnets.mdx delete mode 100644 src/utils/algolia.ts diff --git a/.env.example b/.env.example index 43783a6..057a525 100644 --- a/.env.example +++ b/.env.example @@ -1,3 +1 @@ -SECRET_ALGOLIA_ADMIN_KEY=\w+ - SECRET_GH_PAT=\w+ diff --git a/astro.config.ts b/astro.config.ts index 995d141..0ed01f6 100644 --- a/astro.config.ts +++ b/astro.config.ts @@ -20,6 +20,20 @@ export default defineConfig({ prefetch: { prefetchAll: true }, + markdown: { + remarkPlugins: [ + remarkComment, + // remarkMath, + remarkFencedCodeBlock, + remarkGithubAlerts, + ], + rehypePlugins: [ + rehypeAnchor, + rehypeFigure, + // rehypeKatex + ], + gfm: true, + }, integrations: [ svelte(), // NOTE: expressiveCode must be before mdx @@ -36,18 +50,4 @@ export default defineConfig({ }), mdx(), ], - markdown: { - remarkPlugins: [ - remarkComment, - // remarkMath, - remarkFencedCodeBlock, - remarkGithubAlerts, - ], - rehypePlugins: [ - rehypeAnchor, - rehypeFigure, - // rehypeKatex - ], - gfm: true, - }, }); diff --git a/site.config.ts b/site.config.ts index deeed05..0cc4b1c 100644 --- a/site.config.ts +++ b/site.config.ts @@ -7,9 +7,4 @@ export default { docsGitHubRepositoryExpression: "HEAD:cv/index.md", zenn: 'oriverk', x: 'not_you_die', - algolia: { - appId: "WOHC62BVSP", - apiKey: "bae638093bc0fe3156732e769d096c41", - index: "rod_oriverkdev" - } } diff --git a/src/components/ActivityCalendar/ActivityDay.astro b/src/components/ActivityCalendar/ActivityDay.svelte similarity index 75% rename from src/components/ActivityCalendar/ActivityDay.astro rename to src/components/ActivityCalendar/ActivityDay.svelte index 8b82c49..351477d 100644 --- a/src/components/ActivityCalendar/ActivityDay.astro +++ b/src/components/ActivityCalendar/ActivityDay.svelte @@ -1,16 +1,16 @@ ---- + +import type { Activity, ActivityCalendar } from "@/types/activityCalendar"; +import ActivityDay from "./ActivityDay.svelte"; -interface Props - extends Pick< - ActivityCalendar, - "colors" | "blockMargin" | "blockRadius" | "blockSize" - > { +type Props = Pick< + ActivityCalendar, + "colors" | "blockMargin" | "blockRadius" | "blockSize" +> & { week: Activity[]; textHeight: number; translateX: number; -} +}; const { colors = ["#161b22", "#0e4429", "#006d32", "#26a641", "#39d353"], @@ -20,11 +19,11 @@ const { blockRadius, blockSize, translateX, -} = Astro.props; ---- +}: Props = $props(); + - {week.map(({ date, level, count }, weekday) => ( + {#each week as {date, level, count}, weekday} - ))} + {/each} diff --git a/src/components/ActivityCalendar/ColorLegend.astro b/src/components/ActivityCalendar/ColorLegend.svelte similarity index 71% rename from src/components/ActivityCalendar/ColorLegend.astro rename to src/components/ActivityCalendar/ColorLegend.svelte index 217e8db..2a34fae 100644 --- a/src/components/ActivityCalendar/ColorLegend.astro +++ b/src/components/ActivityCalendar/ColorLegend.svelte @@ -1,19 +1,18 @@ ---- + - {colors.map((color, i) => ( + {#each colors as color, i} - ))} + {/each} diff --git a/src/components/Hero.astro b/src/components/Hero.astro deleted file mode 100644 index 9d841d5..0000000 --- a/src/components/Hero.astro +++ /dev/null @@ -1,106 +0,0 @@ ---- -import urlJoin from "url-join"; -import siteConfig from "../../site.config"; -import Icon from "./ui/Icon.astro"; - -const { github, zenn, x } = siteConfig; ---- - -
-

oriverk.dev

-

Agr. → ? / Bicycle

-
- - - Blog link - - - - GitHub link - - - - X link - - - - Zenn.dev link - - - - My Icon Generator link - -
-
- - diff --git a/src/components/Hero.svelte b/src/components/Hero.svelte new file mode 100644 index 0000000..f17044a --- /dev/null +++ b/src/components/Hero.svelte @@ -0,0 +1,124 @@ + + +{#snippet link({href, title, type, size}: Link)} + {@const isExternal = href.startsWith("https")} + + + {title} link + +{/snippet} + +
+

oriverk.dev

+

Agr. → ? / Bicycle

+
+ {#each links as args} + {@render link(args)} + {/each} +
+
+ + diff --git a/src/components/IconGenerator.svelte b/src/components/IconGenerator.svelte index a54a443..71f8f81 100644 --- a/src/components/IconGenerator.svelte +++ b/src/components/IconGenerator.svelte @@ -21,7 +21,7 @@ function handleOnChange(event: Event) { async function handleOnClick() { const target = document.getElementById("target"); - if(!target) return; + if (!target) return; const dest = document.getElementById("dest"); dest?.querySelector("img")?.remove(); diff --git a/src/components/PostCard.astro b/src/components/PostCard.svelte similarity index 80% rename from src/components/PostCard.astro rename to src/components/PostCard.svelte index 7511547..c5c2370 100644 --- a/src/components/PostCard.astro +++ b/src/components/PostCard.svelte @@ -1,16 +1,15 @@ ---- + -
+ diff --git a/src/components/PostPagination.astro b/src/components/PostPagination.svelte similarity index 66% rename from src/components/PostPagination.astro rename to src/components/PostPagination.svelte index ac3fb0c..6d5ae62 100644 --- a/src/components/PostPagination.astro +++ b/src/components/PostPagination.svelte @@ -1,45 +1,42 @@ ---- +
    - {!!prev && ( - <> -
  1. - << -
    2. -
  2. - < -
    3. - - )} - {size < total && ( + {#if !!prev} +
  3. + << +
    4. +
  4. + < +
    5. + {/if} + {#if size < total}
  5. 1
    6. - )} - {[...Array(maxPage - 1)].map((_, index) => ( + {/if} + {#each [...Array(maxPage - 1)] as _, index}
  6. {index+2}
    7. - ))} - {!!next && ( -
      -
    1. - > -
      2. -
    2. - >> -
      3. -
    - )} + {/each} + {#if !!next} +
  7. + > +
    8. +
  8. + >> +
    9. + {/if}
diff --git a/src/components/Search/Hit.svelte b/src/components/Search/Hit.svelte index 25324f4..aef6e89 100644 --- a/src/components/Search/Hit.svelte +++ b/src/components/Search/Hit.svelte @@ -1,11 +1,11 @@ - - - - diff --git a/src/components/Search/SearchInput.svelte b/src/components/Search/SearchInput.svelte index 44e4048..eea8201 100644 --- a/src/components/Search/SearchInput.svelte +++ b/src/components/Search/SearchInput.svelte @@ -1,11 +1,11 @@ diff --git a/src/components/markdown/AstroEmbed.astro b/src/components/markdown/AstroEmbed.astro index 29e1556..6d39aee 100644 --- a/src/components/markdown/AstroEmbed.astro +++ b/src/components/markdown/AstroEmbed.astro @@ -1,14 +1,14 @@ --- -import EmbedTwitter from "@/components/markdown/EmbedTwitter.astro"; -import LinkCard from "@/components/markdown/LinkCard.astro"; +import EmbedTwitter from "./EmbedTwitter.astro"; +import LinkCard from "./LinkCard.astro"; -interface Props { +type Props = { href: string; target: string; rel: string; class: string; "data-embed": string; -} +}; const { href, ...restProps } = Astro.props; const url = (href || "").toString(); diff --git a/src/components/markdown/AstroLink.astro b/src/components/markdown/AstroLink.astro index 9d63cf4..803074a 100644 --- a/src/components/markdown/AstroLink.astro +++ b/src/components/markdown/AstroLink.astro @@ -1,13 +1,13 @@ --- import AstroEmbed from "@/components/markdown/AstroEmbed.astro"; -interface Props { +type Props = { href: string; target: string; rel: string; class: string; "data-embed": string; -} +}; const props = Astro.props; --- diff --git a/src/components/markdown/EmbedTwitter.astro b/src/components/markdown/EmbedTwitter.astro index 2bdfa50..2624c70 100644 --- a/src/components/markdown/EmbedTwitter.astro +++ b/src/components/markdown/EmbedTwitter.astro @@ -1,17 +1,17 @@ --- -import Card from "@/components/ui/Card.astro"; +import Card from "@/components/ui/Card.svelte"; import { getFaviconSrcFromOrigin } from "@/utils/feed"; import { getTweet } from "@/utils/getTweet.ts"; -interface Props { +type Props = { href: string; target: string; rel: string; class: string; "data-embed": string; -} +}; -interface ResponseType { +type ResponseType = { url: string; author_name: string; author_url: string; @@ -23,7 +23,7 @@ interface ResponseType { provider_name: string; provider_url: string; version: string; -} +}; const { href, class: className, ...restProps } = Astro.props; diff --git a/src/components/markdown/LinkCard.astro b/src/components/markdown/LinkCard.astro index 536b397..82224e5 100644 --- a/src/components/markdown/LinkCard.astro +++ b/src/components/markdown/LinkCard.astro @@ -1,16 +1,16 @@ --- +import Card from "@/components/ui/Card.svelte"; import { getFaviconSrcFromOrigin } from "@/utils/feed"; import { getSiteMetadata } from "@/utils/getSiteMetadata"; import { clsx } from "clsx"; -import Card from "../ui/Card.astro"; -interface Props { +type Props = { href: string; target: string; rel: string; class: string; "data-embed": string; -} +}; const { href, class: className, ...restProps } = Astro.props; diff --git a/src/components/ui/Card.astro b/src/components/ui/Card.svelte similarity index 59% rename from src/components/ui/Card.astro rename to src/components/ui/Card.svelte index 594d9a7..88d7a80 100644 --- a/src/components/ui/Card.astro +++ b/src/components/ui/Card.svelte @@ -1,16 +1,17 @@ ---- -import { clsx } from "clsx"; + -
- +
+ {@render children()}
diff --git a/src/components/ui/Markdown.astro b/src/components/ui/Markdown.astro deleted file mode 100644 index ed07243..0000000 --- a/src/components/ui/Markdown.astro +++ /dev/null @@ -1,129 +0,0 @@ ---- -// import "katex/dist/katex.min.css"; -import "remark-github-alerts/styles/github-base.css"; -import "remark-github-alerts/styles/github-colors-dark-class.css"; -import "remark-github-alerts/styles/github-colors-light.css"; ---- - -
- -
- - diff --git a/src/components/ui/Markdown.svelte b/src/components/ui/Markdown.svelte new file mode 100644 index 0000000..e8d70bc --- /dev/null +++ b/src/components/ui/Markdown.svelte @@ -0,0 +1,19 @@ + + +
+ {@render children()} +
diff --git a/src/components/ui/Toc/TocList.astro b/src/components/ui/Toc/TocList.astro deleted file mode 100644 index 174b1eb..0000000 --- a/src/components/ui/Toc/TocList.astro +++ /dev/null @@ -1,27 +0,0 @@ ---- -import type { Hierarchy } from "@/utils/getBlog"; - -interface Props { - heading: Hierarchy; -} - -const { heading } = Astro.props; -const { slug, text, subHeadings } = heading; ---- - -
  • - {text} - {!!subHeadings.length && ( -
      - {subHeadings.map(heading => ( - - ))} -
    - )} -
    • - - diff --git a/src/components/ui/Toc/TocList.svelte b/src/components/ui/Toc/TocList.svelte new file mode 100644 index 0000000..4350a67 --- /dev/null +++ b/src/components/ui/Toc/TocList.svelte @@ -0,0 +1,29 @@ + + +
  • + {text} + {#if !!subHeadings} +
      + {#each subHeadings as heading} + + {/each} +
    + {/if} +
    • + + diff --git a/src/components/ui/Toc/index.astro b/src/components/ui/Toc/index.astro deleted file mode 100644 index ed01e00..0000000 --- a/src/components/ui/Toc/index.astro +++ /dev/null @@ -1,29 +0,0 @@ ---- -import type { Hierarchy } from "../../../utils/getBlog"; -import TocList from "./TocList.astro"; - -interface Props { - toc: Hierarchy[]; -} - -const { toc } = Astro.props; ---- - -{!!toc.length && ( - -)} - - diff --git a/src/components/ui/Toc/index.svelte b/src/components/ui/Toc/index.svelte new file mode 100644 index 0000000..05426d5 --- /dev/null +++ b/src/components/ui/Toc/index.svelte @@ -0,0 +1,29 @@ + + +{#if !!toc.length} + +{/if} + + diff --git a/src/content/blog/20240417-embed-contnets.mdx b/src/content/blog/20240417-embed-contnets.mdx new file mode 100644 index 0000000..2992ecb --- /dev/null +++ b/src/content/blog/20240417-embed-contnets.mdx @@ -0,0 +1,31 @@ +--- +create: '2024-04-17' +update: '2024-04-17' +title: 'embed contents' +tags: [] +published: true +--- + +## heading + +### link-card + +https://oriverk.dev/blog/20240300-gfm-alerts/ + +### YouTube + +ページ上で動画再生することはないので、上の link-card と同様で良い。 + +https://www.youtube.com/watch?v=dQw4w9WgXcQ + +https://www.youtube.com/watch?v=ZXsQAXx_ao0 + +### Twitter + +https://twitter.com/not_you_die/status/1702572631772569625 + +https://twitter.com/thecampaignbook/status/594531814770745344 + +### Github + +https://github.com/octocat/Hello-World/blob/master/README diff --git a/src/content/config.ts b/src/content/config.ts index 70f930c..5c8a614 100644 --- a/src/content/config.ts +++ b/src/content/config.ts @@ -1,8 +1,8 @@ import { defineCollection, z } from "astro:content"; -import { glob } from 'astro/loaders'; +import { glob } from "astro/loaders"; const staticCollection = defineCollection({ - loader: glob({ pattern: '**\/[^_]*.mdx?', base: "./src/content/static" }), + loader: glob({ pattern: "**/[^_]*.mdx?", base: "./src/content/static" }), schema: z.object({ title: z.string(), description: z.string().optional(), @@ -14,7 +14,7 @@ const staticCollection = defineCollection({ }); const blogCollection = defineCollection({ - loader: glob({ pattern: '**\/[^_]*.mdx?', base: "./src/content/blog" }), + loader: glob({ pattern: "**/[^_]*.mdx?", base: "./src/content/blog" }), schema: z.object({ title: z.string(), description: z.string().optional(), diff --git a/src/layouts/Header.astro b/src/layouts/Header.astro index ed09773..193bfd9 100644 --- a/src/layouts/Header.astro +++ b/src/layouts/Header.astro @@ -1,6 +1,6 @@ --- import HeaderSearch from "@/components/Search/SearchButton.svelte"; -import Icon from "@/components/ui/Icon.astro"; +import Icon from "@/components/ui/Icon.svelte"; const { pathname } = Astro.url; const subpath = pathname.match(/[^\/]+/g); const isActive = (href: string) => diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 0665686..2b6f780 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,18 +1,18 @@ --- -import { ClientRouter } from 'astro:transitions'; +import { ClientRouter } from "astro:transitions"; import defaultOgImage from "@/assets/images/og.png"; -import ContentWrapper from "@/components/ui/ContentWrapper.astro"; +import ContentWrapper from "@/components/ui/ContentWrapper.svelte"; import urlJoin from "url-join"; import Footer from "./Footer.astro"; import Header from "./Header.astro"; -export interface Props { +export type Props = { title?: string; description?: string; image?: string; noindex?: boolean; pagefind?: boolean; -} +}; const { href, hostname } = Astro.url; const { title, description, image, noindex, pagefind } = Astro.props; @@ -79,12 +79,12 @@ const rssHref = Astro.site diff --git a/src/styles/markdown.css b/src/styles/markdown.css index cc103bf..3793397 100644 --- a/src/styles/markdown.css +++ b/src/styles/markdown.css @@ -1,107 +1,144 @@ -h1 { - font-size: 2.5rem; - font-weight: 700; -} - -h2 { - font-size: 2rem; - font-weight: 700; -} - -h2::before { - content: "## "; - content: "## " / ""; -} - -h3 { - font-size: 1.5rem; - font-weight: 700; -} - -h3::before { - content: "### "; - content: "### " / ""; -} - -h4 { - font-size: 1.25rem; - font-weight: 700; -} - -h4::before { - content: "#### "; - content: "#### " / ""; -} - -h5 { - font-size: 1rem; - font-weight: 700; -} - -h6 { - font-size: 0.875rem; - font-weight: 700; - margin: 0; -} - -p { - margin-top: 1.25em; - margin-top: 1.25em; -} - -blockquote { - padding: 0.5rem 1rem; - background-color: rgba(var(--color-gray) / 0.1); - border-left: 0.25rem solid rgb(var(--color-lightgray)); -} - -code { - font-family: monospace; - font-size: 0.875rem; - padding: 0.25rem 0.5rem; - border-radius: 0.25rem; -} - -:not(pre) > code { - padding: 0; - margin: 0 0.1rem; -} - -:not(pre) > code::before, -:not(pre) > code::after { - content: "`"; - content: "`" / ""; -} - -pre { - margin: 0; - padding: 0.5rem 1rem; - border-radius: 0.25rem; -} - -pre code { - font-size: 1rem; - padding: 0; -} - -table { - margin: 0; - border-collapse: collapse; -} - -th { - padding: 0.25rem 0.5rem; - border: 1px solid #ccc; - text-align: center; -} - -td { - padding: 0.25rem 0.5rem; - border: 1px solid #ccc; -} - -caption { - color: rgb(var(--color-lightgray)); - font-size: 1rem; - padding: 0.5rem 0; +.markdown { + & > :where(* + *) { + margin-block-start: 2rem; + } + + & h2, + & h3 { + margin-block-start: 2rem; + } + + & h4 { + margin-block-start: 1rem; + } + + & h2, + & h3, + & h4 { + &[id] { + scroll-margin-top: 5rem; + } + + &::before { + margin-inline-end: 1rem; + color: rgb(var(--color-miku)); + } + } + + & h2::before { + content: "##"; + content: "##" / ""; + } + + & h3::before { + content: "###"; + content: "###" / ""; + } + + & h4::before { + content: "####"; + content: "####" / ""; + } + + & hr { + border: 1px solid gray; + } + + & details { + background-color: rgba(var(--color-hover)); + + & > summary { + padding: 1rem; + font-size: .9rem; + cursor: pointer; + user-select: none; + touch-action: manipulation; + + &:hover { + background-color: rgba(0 0 0 / 0.3); + } + } + } + + & details[open] { + & > summary { + background-color: rgba(0 0 0 / 0.3); + + &:hover { + background-color: rgba(var(--color-hover)); + } + } + } + + & table { + margin-inline: auto; + border-collapse: collapse; + + & th, + & td { + padding-inline: 1rem; + padding-block: .5rem; + border: 1px solid gray; + } + } + + & figcaption { + text-align: center; + color: gray; + } + + & *:has(> img) { + display: inline-block; + padding: 1rem 1.3rem; + border: 2px solid rgba(var(--color-hover)); + border-radius: 0.6rem; + transition: border-color 100ms ease-in; + } + + & img { + max-width: 100%; + } + + & :not(pre) > code::before, + & :not(pre) > code::after { + content: "`"; + content: "`" / ""; + } + + & blockquote { + padding-inline: 1rem; + border-left: none; + border: 1px solid gray; + border-radius: .5rem; + + & > p::before { + content: "> "; + content: "> " / ""; + } + & > blockquote { + border: none; + } + & > blockquote > p::before { + content: "> > "; + content: "> > " / ""; + } + } + + & strong::before, + & strong::after { + content: "**"; + content: "**" / ""; + } + + & del::before, + & del::after { + content: "~~"; + content: "~~" / ""; + } + + & em::before, + & em::after { + content: "_"; + content: "_" / ""; + } } diff --git a/src/types/oembed.ts b/src/types/oembed.ts index bcc9b85..e4b076d 100644 --- a/src/types/oembed.ts +++ b/src/types/oembed.ts @@ -1,11 +1,11 @@ -export interface CardLinkEmbedType { +export type CardLinkEmbedType = { title: string; description: string; image: string; -} +}; // ref: [oEmbed API | Docs | Twitter Developer Platform](https://developer.twitter.com/en/docs/twitter-for-websites/oembed-api#item1) -export interface TweetOptionType { +export type TweetOptionType = { // When set to true, links in a Tweet are not expanded to photo, video, or link previews. hide_media: boolean; // When set to true, a collapsed version of the previous Tweet in a conversation thread will not be displayed when the requested Tweet is in reply to another Tweet. @@ -21,9 +21,9 @@ export interface TweetOptionType { theme: "dark" | "light"; // When set to true, the Tweet and its embedded page on your site are not used for purposes that include personalized suggestions and personalized ads. dnt: boolean; -} +}; -export interface TweetResponseType { +export type TweetResponseType = { url: string; author_name: string; author_url: string; @@ -35,4 +35,4 @@ export interface TweetResponseType { provider_name: string; provider_url: string; version: string; -} +}; diff --git a/src/utils/algolia.ts b/src/utils/algolia.ts deleted file mode 100644 index 653736b..0000000 --- a/src/utils/algolia.ts +++ /dev/null @@ -1,35 +0,0 @@ -import type { AlgoliaBlog } from "@/types/algolia"; -import type { SearchClient, SearchResponse } from "node_modules/algoliasearch"; -import { algoliasearch } from "node_modules/algoliasearch"; -import siteConfig from "site.config"; - -const { appId, apiKey, index } = siteConfig.algolia; - -const client: SearchClient = algoliasearch(appId, apiKey); -const emptyResults: SearchResponse = { - hits: [], - nbHits: 0, - nbPages: 0, - page: 0, - processingTimeMS: 0, - hitsPerPage: 0, - exhaustiveNbHits: false, - query: "", - params: "", -}; - -export async function searchAlgolia( - query: string, - option?: object, -): Promise> { - if (!query) return emptyResults; - - const results: SearchResponse = await client.searchSingleIndex( - { - indexName: index, - searchParams: { query: query }, - }, - option, - ); - return results; -} diff --git a/src/utils/getBlog.ts b/src/utils/getBlog.ts index 8b236f6..d45483b 100644 --- a/src/utils/getBlog.ts +++ b/src/utils/getBlog.ts @@ -22,9 +22,9 @@ export async function getTags() { return [...new Set(tags)]; } -export interface Hierarchy extends MarkdownHeading { - subHeadings: MarkdownHeading[]; -} +export type Hierarchy = MarkdownHeading & { + subHeadings?: MarkdownHeading[]; +}; export function getTocHierarchy(headings: MarkdownHeading[]) { const result: Hierarchy[] = []; diff --git a/src/utils/getOgImage.ts b/src/utils/getOgImage.ts index 2bc5a94..cc2f2e6 100644 --- a/src/utils/getOgImage.ts +++ b/src/utils/getOgImage.ts @@ -3,11 +3,11 @@ import type { SatoriOptions } from "satori"; import satori from "satori"; import sharp from "sharp"; -interface Options { +type Options = { extension: "jpg" | "png" | "webp" | "avif"; quality: number; debug: boolean; -} +}; /** * @param title hogehoge diff --git a/src/utils/github/getUserContent.ts b/src/utils/github/getUserContent.ts index 2e16ab1..0732f6f 100644 --- a/src/utils/github/getUserContent.ts +++ b/src/utils/github/getUserContent.ts @@ -13,14 +13,18 @@ if (!fs.existsSync(repositoryJsonPath)) { fs.writeFileSync(repositoryJsonPath, "[]"); } +type ContributionCalendar = Pick< + ContributionsCollection, + "contributionCalendar" +>; + export function getUserContent(): UserContent { const repositoryJson: UserContent["repositoryItems"] = JSON.parse( fs.readFileSync(repositoryJsonPath, { encoding: "utf-8" }), ); - const contributionsJson: Pick< - ContributionsCollection, - "contributionCalendar" - > = JSON.parse(fs.readFileSync(contributionsJsonPath, { encoding: "utf-8" })); + const contributionsJson: ContributionCalendar = JSON.parse( + fs.readFileSync(contributionsJsonPath, { encoding: "utf-8" }), + ); const repositoryItems: UserContent["repositoryItems"] = repositoryJson.filter( (repo) => !repo.isFork,