diff options
Diffstat (limited to 'examples/with-markdown/src/pages/index.astro')
-rw-r--r-- | examples/with-markdown/src/pages/index.astro | 65 |
1 files changed, 0 insertions, 65 deletions
diff --git a/examples/with-markdown/src/pages/index.astro b/examples/with-markdown/src/pages/index.astro deleted file mode 100644 index 1cc85c16c..000000000 --- a/examples/with-markdown/src/pages/index.astro +++ /dev/null @@ -1,65 +0,0 @@ ---- -// Component Imports -import { Markdown } from "astro/components"; -import Layout from "../layouts/main.astro"; -import ReactCounter from "../components/ReactCounter.jsx"; -import PreactCounter from "../components/PreactCounter.tsx"; -import VueCounter from "../components/VueCounter.vue"; -import SvelteCounter from "../components/SvelteCounter.svelte"; - -// Component Script: -// You can write any JavaScript/TypeScript that you'd like here. -// It will run during the build, but never in the browser. -// All variables are available to use in the HTML template below. -const title = "Astro Markdown"; -const variable = "content"; -const items = ["A", "B", "C"]; - -// Full Astro Component Syntax: -// https://docs.astro.build/core-concepts/astro-components/ ---- - -<Layout content={{ title }}> - <Markdown> - # Introducing {title} - - **Astro Markdown** brings native Markdown support to HTML! - - > It's inspired by [`MDX`](https://mdxjs.com/) and powered by [`remark`](https://github.com/remarkjs/remark). - - The best part? It comes with all the Astro features you expect. - - [Other example](./other) - - ## Embed framework components - - <ReactCounter client:visible /> - <PreactCounter client:visible /> - <VueCounter client:visible /> - <SvelteCounter client:visible /> - - ## Use Expressions - - You can use any {variable} in scope and use JavaScript for templating ({items.join(', ')}) - - ## Oh yeah... - - <ReactCounter client:visible> - - 🤯 It's also _recursive_! - - ### Markdown can be embedded in any child component - - </ReactCounter> - - ## Code - - Should work! - - ```js - import Something from "./another"; - - const thing = new Something(); - ``` - </Markdown> -</Layout> |