From 06b88f27b877aee030a830f499064a924271d2e0 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Thu, 11 Jan 2024 15:35:20 +0100 Subject: [PATCH 1/7] Create `` component --- src/components/ReadMore.astro | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 src/components/ReadMore.astro diff --git a/src/components/ReadMore.astro b/src/components/ReadMore.astro new file mode 100644 index 0000000000000..bc8ac40174822 --- /dev/null +++ b/src/components/ReadMore.astro @@ -0,0 +1,24 @@ +--- +import { Icon } from '@astrojs/starlight/components'; +--- + +
+ + +
+ + From dbf0f240044275ad3e8485cf945fc48151da4c06 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Thu, 11 Jan 2024 15:35:37 +0100 Subject: [PATCH 2/7] Add `` to some content --- src/content/docs/en/core-concepts/astro-components.mdx | 4 +++- src/content/docs/en/core-concepts/astro-pages.mdx | 7 ++++--- src/content/docs/en/core-concepts/layouts.mdx | 3 ++- src/content/docs/en/editor-setup.mdx | 4 +++- src/content/docs/en/guides/content.mdx | 5 +++-- 5 files changed, 15 insertions(+), 8 deletions(-) diff --git a/src/content/docs/en/core-concepts/astro-components.mdx b/src/content/docs/en/core-concepts/astro-components.mdx index 6ea948662dfb7..36afd92b5cb09 100644 --- a/src/content/docs/en/core-concepts/astro-components.mdx +++ b/src/content/docs/en/core-concepts/astro-components.mdx @@ -383,4 +383,6 @@ A [`` element](/en/core-concepts/astro-components/#slots) inside an HTML ## Next Steps -๐Ÿ“š Learn about using [UI framework components](/en/core-concepts/framework-components/) in your Astro project. +import ReadMore from '~/components/ReadMore.astro'; + +Read more about using [UI framework components](/en/core-concepts/framework-components/) in your Astro project. diff --git a/src/content/docs/en/core-concepts/astro-pages.mdx b/src/content/docs/en/core-concepts/astro-pages.mdx index 5b5d9a0c07eca..419aa2a47dbf0 100644 --- a/src/content/docs/en/core-concepts/astro-pages.mdx +++ b/src/content/docs/en/core-concepts/astro-pages.mdx @@ -4,6 +4,7 @@ description: An introduction to Astro pages i18nReady: true --- +import ReadMore from '~/components/ReadMore.astro'; import Since from '~/components/Since.astro' **Pages** are files that live in the `src/pages/` subdirectory of your Astro project. They are responsible for handling routing, data loading, and overall page layout for every page in your website. @@ -23,7 +24,7 @@ Astro leverages a routing strategy called **file-based routing**. Each file in y A single file can also generate multiple pages using [dynamic routing](/en/core-concepts/routing/#dynamic-routes). This allows you to create pages even if your content lives outside of the special `/pages/` directory, such as in a [content collection](/en/guides/content-collections/) or a [CMS](/en/guides/cms/). -๐Ÿ“š Read more about [Routing in Astro](/en/core-concepts/routing/). +Read more about [Routing in Astro](/en/core-concepts/routing/). ### Link between pages @@ -66,7 +67,7 @@ import MySiteLayout from '../layouts/MySiteLayout.astro'; ``` -๐Ÿ“š Read more about [layout components](/en/core-concepts/layouts/) in Astro. +Read more about [layout components](/en/core-concepts/layouts/) in Astro. ## Markdown/MDX Pages @@ -87,7 +88,7 @@ title: 'My Markdown page' This is my page, written in **Markdown.** ``` -๐Ÿ“š Read more about [Markdown](/en/guides/markdown-content/) in Astro. +Read more about [Markdown](/en/guides/markdown-content/) in Astro. ## HTML Pages diff --git a/src/content/docs/en/core-concepts/layouts.mdx b/src/content/docs/en/core-concepts/layouts.mdx index 998868d69fb0c..81453066339fa 100644 --- a/src/content/docs/en/core-concepts/layouts.mdx +++ b/src/content/docs/en/core-concepts/layouts.mdx @@ -53,8 +53,9 @@ import MySiteLayout from '../layouts/MySiteLayout.astro'; ``` +import ReadMore from '~/components/ReadMore.astro'; -๐Ÿ“š Learn more about [slots](/en/core-concepts/astro-components/#slots). +Learn more about [slots](/en/core-concepts/astro-components/#slots). ## Markdown/MDX Layouts diff --git a/src/content/docs/en/editor-setup.mdx b/src/content/docs/en/editor-setup.mdx index 6bf5ca1096b2a..df3ebb9b4fc6e 100644 --- a/src/content/docs/en/editor-setup.mdx +++ b/src/content/docs/en/editor-setup.mdx @@ -20,7 +20,9 @@ Astro works with any code editor. However, VS Code is our recommended editor for To get started, install the [Astro VS Code Extension](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode) today. -๐Ÿ“š See how to [set up TypeScript](/en/guides/typescript/) in your Astro project. +import ReadMore from '~/components/ReadMore.astro'; + +See how to [set up TypeScript](/en/guides/typescript/) in your Astro project. ## JetBrains IDEs diff --git a/src/content/docs/en/guides/content.mdx b/src/content/docs/en/guides/content.mdx index 98d0113c3db63..873668db445d9 100644 --- a/src/content/docs/en/guides/content.mdx +++ b/src/content/docs/en/guides/content.mdx @@ -7,6 +7,7 @@ description: >- i18nReady: false --- import RecipeLinks from "~/components/RecipeLinks.astro" +import ReadMore from '~/components/ReadMore.astro'; Astro is a perfect choice for your content-focused site: blogs, marketing sites, portfolios, and more! @@ -25,14 +26,14 @@ Markdown is a convenient syntax for writing rich text with basic formatting and Create and write a new `.md` file in your code editor or bring in an existing file written in your favorite Markdown editor. Some online Markdown editors like [StackEdit](https://stackedit.io/) and [Dillinger](https://dillinger.io) will even allow you to edit and sync your work with your Astro repository stored on GitHub. -๐Ÿ“š Learn more about [writing Markdown content in Astro](/en/guides/markdown-content/). +Learn more about [writing Markdown content in Astro](/en/guides/markdown-content/). ### MDX Authoring If you add the MDX integration to your project, you can also write content using `.mdx` files, which let you include JavaScript expressions and custom components within your Markdown. This includes both static [Astro components](/en/core-concepts/astro-components/) and interactive [framework components](/en/core-concepts/framework-components/). Add UI elements such as a banner or an interactive carousel right in your text to turn your content into full-fledged web pages. Write and edit `.mdx` files directly in your code editor, alongside your project files. -๐Ÿ“š Learn more about [using MDX with Astro](/en/guides/integrations-guide/mdx/). +Learn more about [using MDX with Astro](/en/guides/integrations-guide/mdx/). ### Headless CMS Authoring From b844aa150d45e882d59d0611187046e9e3c705e8 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Thu, 11 Jan 2024 15:35:53 +0100 Subject: [PATCH 3/7] Update `` to match `` layout --- src/components/RecipeLinks.astro | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) diff --git a/src/components/RecipeLinks.astro b/src/components/RecipeLinks.astro index a8afaa1f823d4..f37498efff465 100644 --- a/src/components/RecipeLinks.astro +++ b/src/components/RecipeLinks.astro @@ -34,7 +34,7 @@ if (!firstRecipe) {
- + { !isList && ( @@ -64,19 +64,10 @@ if (!firstRecipe) { display: flex; align-items: center; flex-wrap: wrap; - gap: 0.25rem; - } - .flex > img { - margin-right: 0.25rem; + gap: 0.5rem; } ul { - margin-left: 0.5rem; - } - .root { - background-color: var(--theme-bg-offset); - border-radius: 8px; - padding: 24px; - width: max-content; - max-width: 100%; + margin-top: 0 !important; + margin-inline-start: 0.5rem; } From 430dd71d4cabb1cb41840aab092db55c37316a95 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Thu, 11 Jan 2024 15:22:13 +0000 Subject: [PATCH 4/7] Co-authored-by: Reuben Tier Co-authored-by: Atharva Co-authored-by: Elian Co-authored-by: Chris Swithinbank Co-authored-by: Paul Valladares Co-authored-by: Luiz Ferraz Co-authored-by: Dinesh Singh --- .../en/core-concepts/framework-components.mdx | 5 ++-- src/content/docs/en/core-concepts/layouts.mdx | 5 ++-- src/content/docs/en/core-concepts/routing.mdx | 4 +++- .../docs/en/guides/client-side-scripts.mdx | 7 ++++-- .../docs/en/guides/configuring-astro.mdx | 6 +++-- .../docs/en/guides/deploy/cloudflare.mdx | 3 ++- src/content/docs/en/guides/deploy/deno.mdx | 4 +++- src/content/docs/en/guides/deploy/netlify.mdx | 6 +++-- src/content/docs/en/guides/deploy/vercel.mdx | 5 ++-- src/content/docs/en/guides/imports.mdx | 4 +++- .../en/guides/integrations-guide/markdoc.mdx | 9 +++---- .../docs/en/guides/integrations-guide/mdx.mdx | 3 ++- .../en/guides/integrations-guide/vercel.mdx | 3 ++- .../docs/en/guides/markdown-content.mdx | 8 ++++--- src/content/docs/en/guides/styling.mdx | 11 +++++---- src/content/docs/en/guides/typescript.mdx | 6 +++-- src/content/docs/en/install/auto.mdx | 24 +++++++++++++++---- src/content/docs/en/install/manual.mdx | 6 ++--- src/content/docs/en/recipes/i18n.mdx | 6 +++-- .../docs/en/reference/api-reference.mdx | 6 ++--- .../docs/en/reference/cli-reference.mdx | 4 ++-- .../en/reference/directives-reference.mdx | 5 ++-- .../en/tutorials/add-view-transitions.mdx | 3 ++- 23 files changed, 93 insertions(+), 50 deletions(-) diff --git a/src/content/docs/en/core-concepts/framework-components.mdx b/src/content/docs/en/core-concepts/framework-components.mdx index b25b70d6f7eb1..ccc8001f26305 100644 --- a/src/content/docs/en/core-concepts/framework-components.mdx +++ b/src/content/docs/en/core-concepts/framework-components.mdx @@ -4,6 +4,7 @@ description: Learn how to use React, Svelte, etc. i18nReady: true --- import IntegrationsNav from '~/components/IntegrationsNav.astro' +import ReadMore from '~/components/ReadMore.astro' Build your Astro website without sacrificing your favorite component framework. Create Astro [islands](/en/concepts/islands/) with the UI frameworks of your choice. @@ -79,7 +80,7 @@ Most framework-specific accessibility patterns should work the same when these c There are several hydration directives available for UI framework components: `client:load`, `client:idle`, `client:visible`, `client:media={QUERY}` and `client:only={FRAMEWORK}`. -๐Ÿ“š See our [directives reference](/en/reference/directives-reference/#client-directives) page for a full description of these hydration directives, and their usage. +See our [directives reference](/en/reference/directives-reference/#client-directives) page for a full description of these hydration directives, and their usage. ## Mixing Frameworks @@ -233,7 +234,7 @@ If you try to hydrate an Astro component with a `client:` modifier, you will get [Astro components](/en/core-concepts/astro-components/) are HTML-only templating components with no client-side runtime. But, you can use a ` ``` -๐Ÿ“š See how [client-side scripts](/en/guides/client-side-scripts/) work in Astro components. +See how [client-side scripts](/en/guides/client-side-scripts/) work in Astro components. ### `define:vars` diff --git a/src/content/docs/en/tutorials/add-view-transitions.mdx b/src/content/docs/en/tutorials/add-view-transitions.mdx index 88e0ca14b7bc4..1fc67d6253b2c 100644 --- a/src/content/docs/en/tutorials/add-view-transitions.mdx +++ b/src/content/docs/en/tutorials/add-view-transitions.mdx @@ -10,6 +10,7 @@ import MultipleChoice from '~/components/tutorial/MultipleChoice.astro'; import Option from '~/components/tutorial/Option.astro'; import Spoiler from '~/components/Spoiler.astro'; import PreCheck from '~/components/tutorial/PreCheck.astro'; +import ReadMore from '~/components/ReadMore.astro' **View transitions** are a way to control what happens when visitors navigate between pages on your site. Astro's View Transitions API allows you to add optional navigation features including smooth page transitions and animations, controlling the browser's history stack of visited pages, and preventing full-page refreshes in order to persist some page elements and state while updating the content displayed. @@ -378,7 +379,7 @@ With view transitions, some scripts may no longer re-run after page navigation l ``` Navigate to any blog post in your browser preview, and you will see the description fade in slower than the rest of the text. - ๐Ÿ“š Read more about the different [transition directives](/en/guides/view-transitions/#transition-directives) and [customizing animations](/en/guides/view-transitions/#customizing-animations). + Read more about the different [transition directives](/en/guides/view-transitions/#transition-directives) and [customizing animations](/en/guides/view-transitions/#customizing-animations). ### Force a full browser reload for some links From 9050fd3bb98f68d7ffa27edf5711356e5da6b05c Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Thu, 11 Jan 2024 21:30:07 +0100 Subject: [PATCH 5/7] Improve wording Co-authored-by: Sarah Rainsberger --- src/content/docs/en/guides/integrations-guide/vercel.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/en/guides/integrations-guide/vercel.mdx b/src/content/docs/en/guides/integrations-guide/vercel.mdx index e239d93d57bc6..9ad0aa11941f7 100644 --- a/src/content/docs/en/guides/integrations-guide/vercel.mdx +++ b/src/content/docs/en/guides/integrations-guide/vercel.mdx @@ -95,7 +95,7 @@ import vercel from '@astrojs/vercel/static'; ## Usage -**[Read the full deployment guide here.](/en/guides/deploy/vercel/)** +Find out more about [deploying your project to Vercel](/en/guides/deploy/vercel/). You can deploy by CLI (`vercel deploy`) or by connecting your new repo in the [Vercel Dashboard](https://vercel.com/). Alternatively, you can create a production build locally: From 3c7f8301cff08c2a819e4ca66dbd437bc38e66ad Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Thu, 11 Jan 2024 21:31:29 +0100 Subject: [PATCH 6/7] =?UTF-8?q?JOURNEY=20=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Sarah Rainsberger --- src/content/docs/en/install/auto.mdx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/content/docs/en/install/auto.mdx b/src/content/docs/en/install/auto.mdx index ba2e37a259db0..0902766ddaa6f 100644 --- a/src/content/docs/en/install/auto.mdx +++ b/src/content/docs/en/install/auto.mdx @@ -136,6 +136,11 @@ Here are a few topics that we recommend exploring next. You can read them in any import { CardGrid, LinkCard } from '@astrojs/starlight/components'; + - From 3ff5c9322817651fd3e92022ad6b281895740675 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Thu, 11 Jan 2024 21:41:50 +0100 Subject: [PATCH 7/7] Rework Markdoc nodes text --- src/content/docs/en/guides/integrations-guide/markdoc.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/en/guides/integrations-guide/markdoc.mdx b/src/content/docs/en/guides/integrations-guide/markdoc.mdx index 52092c002eb19..7ec770d5c0867 100644 --- a/src/content/docs/en/guides/integrations-guide/markdoc.mdx +++ b/src/content/docs/en/guides/integrations-guide/markdoc.mdx @@ -291,7 +291,7 @@ export default defineMarkdocConfig({ }); ``` -[Find all of Markdoc's built-in nodes and node attributes on their documentation.](https://markdoc.dev/docs/nodes#built-in-nodes) +See the [Markdoc nodes documentation](https://markdoc.dev/docs/nodes#built-in-nodes) to learn about all the built-in nodes and attributes. ### Use client-side UI components