diff --git a/.contents/card-links.json b/.contents/card-links.json index b2a96b5..5a83236 100644 --- a/.contents/card-links.json +++ b/.contents/card-links.json @@ -18,5 +18,40 @@ "title": "Rick Astley - Never Gonna Give You Up (Official Music Video)", "description": "The official video for “Never Gonna Give You Up” by Rick Astley. The new album 'Are We There Yet?' is out now: Download here: https://RickAstley.lnk.to/AreWe...", "image": "https://i.ytimg.com/vi/dQw4w9WgXcQ/maxresdefault.jpg" + }, + "https://pagefind.app/": { + "title": "Pagefind | Pagefind — Static low-bandwidth search at scale", + "description": "Pagefind is a fully static search library that aims to perform well on large sites, while using as little of your users’ bandwidth as possible, and without hosting any infrastructure.", + "image": "https://pagefind.app/og.png" + }, + "https://flutter.dev/": { + "title": "Flutter - Build apps for any screen", + "description": "Flutter transforms the entire app development process. Build, test, and deploy beautiful mobile, web, desktop, and embedded apps from a single codebase.", + "image": "https://storage.googleapis.com/cms-storage-bucket/70760bf1e88b184bb1bc.png" + }, + "https://github.com/oriverk/learn_flutter": { + "title": "GitHub - oriverk/learn_flutter", + "description": "Contribute to oriverk/learn_flutter development by creating an account on GitHub.", + "image": "https://opengraph.githubassets.com/e9ddd51f9d7164eede64b11a742f9ff341c851ef4671c9550c948fad520d4927/oriverk/learn_flutter" + }, + "https://www.publickey1.jp/blog/22/amazon_prime_videowebassemblywasm_vm.html": { + "title": "Amazon Prime Videoが動画再生にWebAssemblyを採用。再生デバイス上にWasm VMをデプロイ、高フレームレートなど実現", + "description": "Amazon.comは動画サービスのAmazon Prime Videoにおいて、テレビやFire TV、スマートフォンなどの再生デバイス上にWebAssemblyのランタイムをデプロイし、アプリケーションの一部にWebAssemblyを採...", + "image": "https://www.publickey1.jp/2022/primevideowasm01.gif" + }, + "https://zenn.dev/oriverk/articles/432f7c2f17b928": { + "title": "Rustで作物列画像を二値化処理をする", + "description": "", + "image": "https://res.cloudinary.com/zenn/image/upload/s--bUnUkMNc--/c_fit%2Cg_north_west%2Cl_text:notosansjp-medium.otf_55:Rust%25E3%2581%25A7%25E4%25BD%259C%25E7%2589%25A9%25E5%2588%2597%25E7%2594%25BB%25E5%2583%258F%25E3%2582%2592%25E4%25BA%258C%25E5%2580%25A4%25E5%258C%2596%25E5%2587%25A6%25E7%2590%2586%25E3%2582%2592%25E3%2581%2599%25E3%2582%258B%2Cw_1010%2Cx_90%2Cy_100/g_south_west%2Cl_text:notosansjp-medium.otf_37:oriverk%2Cx_203%2Cy_121/g_south_west%2Ch_90%2Cl_fetch:aHR0cHM6Ly9saDMuZ29vZ2xldXNlcmNvbnRlbnQuY29tL2EtL0FPaDE0R2pWb1Vhc3I2TG1WZ2ZycnEtRlhNUVhya3VSdm85OWFMWkNtS2xEPXMyNTAtYw==%2Cr_max%2Cw_90%2Cx_87%2Cy_95/v1627283836/default/og-base-w1200-v2.png" + }, + "https://github.blog/changelog/2023-12-14-new-markdown-extension-alerts-provide-distinctive-styling-for-significant-content/": { + "title": "New Markdown extension: Alerts provide distinctive styling for significant content · GitHub Changelog", + "description": "New Markdown extension: Alerts provide distinctive styling for significant content", + "image": "https://github.blog/wp-content/uploads/2023/12/290547405-0505deff-ff73-44f4-9f47-1d39b2f1d8cd.png?w=1024" + }, + "https://biomejs.dev/": { + "title": "Biome", + "description": "Format, lint, and more in a fraction of a second.", + "image": "https://biomejs.dev/img/og.png?v=2" } -} +} \ No newline at end of file diff --git a/src/assets/images/og/1e953b3ac3d5151eea0da61b07dd03fa765dba8efd7a29be2a0bc6b23df770e1.webp b/src/assets/images/og/1e953b3ac3d5151eea0da61b07dd03fa765dba8efd7a29be2a0bc6b23df770e1.webp new file mode 100644 index 0000000..7d7eb60 Binary files /dev/null and b/src/assets/images/og/1e953b3ac3d5151eea0da61b07dd03fa765dba8efd7a29be2a0bc6b23df770e1.webp differ diff --git a/src/assets/images/og/afde66ebf8ce260f06657b2e399b015c7ca2c4ae17ce8925fbf3bfdb004aafff.webp b/src/assets/images/og/afde66ebf8ce260f06657b2e399b015c7ca2c4ae17ce8925fbf3bfdb004aafff.webp deleted file mode 100644 index f52b4c9..0000000 Binary files a/src/assets/images/og/afde66ebf8ce260f06657b2e399b015c7ca2c4ae17ce8925fbf3bfdb004aafff.webp and /dev/null differ diff --git a/src/components/markdown/AstroEmbed.astro b/src/components/markdown/AstroEmbed.astro deleted file mode 100644 index 6d39aee..0000000 --- a/src/components/markdown/AstroEmbed.astro +++ /dev/null @@ -1,24 +0,0 @@ ---- -import EmbedTwitter from "./EmbedTwitter.astro"; -import LinkCard from "./LinkCard.astro"; - -type Props = { - href: string; - target: string; - rel: string; - class: string; - "data-embed": string; -}; - -const { href, ...restProps } = Astro.props; -const url = (href || "").toString(); -const embedType = restProps["data-embed"]; ---- - -{embedType === "ogp" ? ( - -) : embedType === "twitter" ? ( - -) : ( -

hoge

-)} diff --git a/src/components/markdown/AstroLink.astro b/src/components/markdown/AstroLink.astro index 803074a..b2837e3 100644 --- a/src/components/markdown/AstroLink.astro +++ b/src/components/markdown/AstroLink.astro @@ -1,23 +1,27 @@ --- -import AstroEmbed from "@/components/markdown/AstroEmbed.astro"; +import EmbedTwitter from "./EmbedTwitter.astro"; +import LinkCard from "./LinkCard.astro"; type Props = { href: string; target: string; rel: string; class: string; - "data-embed": string; + "data-embed"?: "ogp" | "twitter"; }; const props = Astro.props; +const embedType = !props["data-embed"] ? "link" : props["data-embed"] --- -{ - Object.hasOwn(props, "data-embed") ? ( - - ) : ( - - - - ) -} +{embedType === "link" ? ( + + + +) : embedType === "ogp" ? ( + +) : embedType === "twitter" ? ( + +) : ( +

hoge

+)} diff --git a/src/components/markdown/EmbedTwitter.astro b/src/components/markdown/EmbedTwitter.astro index 2624c70..9a4b9df 100644 --- a/src/components/markdown/EmbedTwitter.astro +++ b/src/components/markdown/EmbedTwitter.astro @@ -8,7 +8,7 @@ type Props = { target: string; rel: string; class: string; - "data-embed": string; + "data-embed"?: "ogp" | "twitter"; }; type ResponseType = { diff --git a/src/components/markdown/LinkCard.astro b/src/components/markdown/LinkCard.astro index 82224e5..ddcb1a0 100644 --- a/src/components/markdown/LinkCard.astro +++ b/src/components/markdown/LinkCard.astro @@ -9,7 +9,7 @@ type Props = { target: string; rel: string; class: string; - "data-embed": string; + "data-embed"?: "ogp" | "twitter"; }; const { href, class: className, ...restProps } = Astro.props; diff --git a/src/content/blog/20221205-next13-app.md b/src/content/blog/20221205-next13-app.md index 8a7f457..30c6e71 100644 --- a/src/content/blog/20221205-next13-app.md +++ b/src/content/blog/20221205-next13-app.md @@ -159,8 +159,7 @@ export default async function Page() { #### 投稿詳細ページ -v12 までの投稿詳細ページでは [dynamic routes の Catch all routes -](https://nextjs.org/docs/routing/dynamic-routes#catch-all-routes) を利用し、`/pages/entry/[...slug].tsx` となっていた。v13 からの `app/` 下では `/pages/entry/[...slug]/page.tsx` となる。 +v12 までの投稿詳細ページでは [dynamic routes の Catch all routes](https://nextjs.org/docs/routing/dynamic-routes#catch-all-routes) を利用し、`/pages/entry/[...slug].tsx` となっていた。v13 からの `app/` 下では `/pages/entry/[...slug]/page.tsx` となる。 ```js title=/app/posts/[...slug]/page.jsx export default function Page({ params, searchParams }) { diff --git a/src/content/blog/2024-04-17-embed-contnets.mdx b/src/content/blog/2024-04-17-embed-contnets.mdx deleted file mode 100644 index 2992ecb..0000000 --- a/src/content/blog/2024-04-17-embed-contnets.mdx +++ /dev/null @@ -1,31 +0,0 @@ ---- -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/blog/20240300-gfm-alerts.md b/src/content/blog/20240300-gfm-alerts.mdx similarity index 84% rename from src/content/blog/20240300-gfm-alerts.md rename to src/content/blog/20240300-gfm-alerts.mdx index 22c245a..5c3188e 100644 --- a/src/content/blog/20240300-gfm-alerts.md +++ b/src/content/blog/20240300-gfm-alerts.mdx @@ -11,7 +11,7 @@ GitHub で `> [!NOTE]` といったアラート記法を使えるようになっ ## アラートについて -[New Markdown extension: Alerts provide distinctive styling for significant content - The GitHub Blog](https://github.blog/changelog/2023-12-14-new-markdown-extension-alerts-provide-distinctive-styling-for-significant-content/) +https://github.blog/changelog/2023-12-14-new-markdown-extension-alerts-provide-distinctive-styling-for-significant-content/ > [!NOTE] > Useful information that users should know, even when skimming content. @@ -109,6 +109,4 @@ GitHub で `> [!NOTE]` といったアラート記法を使えるようになっ ## remark plugin -markdown を処理する際の remark plugin として、`remark-github-alerts` を利用した。 - -[hyoban/remark-github-alerts: Support GitHub-style alerts for remark](https://github.com/hyoban/remark-github-alerts) +markdown を処理する際の remark plugin として、[hyoban/remark-github-alerts](https://github.com/hyoban/remark-github-alerts) を利用した。 diff --git a/src/content/blog/20240300-use-biome.md b/src/content/blog/20240300-use-biome.mdx similarity index 96% rename from src/content/blog/20240300-use-biome.md rename to src/content/blog/20240300-use-biome.mdx index 8c14329..a79c682 100644 --- a/src/content/blog/20240300-use-biome.md +++ b/src/content/blog/20240300-use-biome.mdx @@ -9,6 +9,8 @@ published: true Astro と Svelte 製のサイトで、コードリンター＆フォーマッターを Eslint・Prettier から Biome に変更しました。 +https://biomejs.dev/ + ## サイトについて - built with @@ -28,7 +30,8 @@ Astro と Svelte 製のサイトで、コードリンター＆フォーマッタ - prettier-plugin-astro - prettier-plugin-svelte -
.eslintrc.yml +
+.eslintrc.yml ```yml extends: @@ -74,7 +77,8 @@ rules: {
-
.pretterrc.yml +
+.pretterrc.yml ```yml trailingComma: es5 diff --git a/src/content/blog/20240609-learn-rust.md b/src/content/blog/20240609-learn-rust.mdx similarity index 100% rename from src/content/blog/20240609-learn-rust.md rename to src/content/blog/20240609-learn-rust.mdx diff --git a/src/content/blog/20240812-flutter.md b/src/content/blog/20240812-flutter.mdx similarity index 99% rename from src/content/blog/20240812-flutter.md rename to src/content/blog/20240812-flutter.mdx index 1709cad..ca21614 100644 --- a/src/content/blog/20240812-flutter.md +++ b/src/content/blog/20240812-flutter.mdx @@ -12,6 +12,8 @@ published: true [![Image from Gyazo](https://i.gyazo.com/be4cd4904180fda733f325b17e8f0fc5.png)](https://gyazo.com/be4cd4904180fda733f325b17e8f0fc5) +https://flutter.dev/ + ## 感想・まとめ - RAM 16GB では足りない @@ -31,7 +33,7 @@ published: true [Flutter Learn](https://flutter.dev/learn) を手を動かしながら読み終えましたが、Widget に何があるか、Flutter/Dart 特有の書き方といったものを更に理解するため、Zenn や Google Codelab 等のチュートリアルをやりました。 -[oriverk/learn_flutter](https://github.com/oriverk/learn_flutter) +https://github.com/oriverk/learn_flutter - [いちから始めるFlutterモバイルアプリ開発](https://zenn.dev/heyhey1028/books/flutter-basics) - http, webview_flutter diff --git a/src/content/blog/20240922-pagefind.md b/src/content/blog/20240922-pagefind.mdx similarity index 92% rename from src/content/blog/20240922-pagefind.md rename to src/content/blog/20240922-pagefind.mdx index b2b57c9..300cf96 100644 --- a/src/content/blog/20240922-pagefind.md +++ b/src/content/blog/20240922-pagefind.mdx @@ -9,11 +9,9 @@ noindex: true ## はじめに -今までサイト内検索では Algolia を使用していたのですが、検索 API の実行アクセス回数が少ないために無効にされてしまったので、サイト内検索機能を全文検索ライブラリの Pagefind で置換しました。 +今までサイト内検索では [Algolia](https://www.algolia.com/) を使用していたのですが、検索 API の実行アクセス回数が少ないために無効にされてしまったので、サイト内検索機能を全文検索ライブラリの [Pagefind](https://pagefind.app/) で置換しました。 -- [Pagefind | Pagefind — Static low-bandwidth search at scale](https://pagefind.app/) - - [CloudCannon/pagefind: Static low-bandwidth search at scale](https://github.com/cloudcannon/pagefind) -- [AI search that understands | Algolia](https://www.algolia.com/) +https://pagefind.app/ ## Pagefind とは @@ -103,9 +101,9 @@ Pagefind はデフォルトで `` 内にあるすべての要素をイン Pagefind は各ページ中の各要素からメタデータを自動的に取得します。 -- title: <= h1 -- image: <= h1以降、最初の画像の src -- image_alt: <= h1以降、最初の画像の alt +- title: h1 +- image: h1以降、最初の画像の src +- image_alt: h1以降、最初の画像の alt ```html title=example.html

Hello World

diff --git a/src/styles/markdown.css b/src/styles/markdown.css index 3793397..44a2b13 100644 --- a/src/styles/markdown.css +++ b/src/styles/markdown.css @@ -87,7 +87,7 @@ color: gray; } - & *:has(> img) { + & *:has(> img):not(.info, .ogimage) { display: inline-block; padding: 1rem 1.3rem; border: 2px solid rgba(var(--color-hover));