diff --git a/www/src/components/Author.astro b/www/src/components/Author.astro index 351b1bfc40..e11021ea95 100644 --- a/www/src/components/Author.astro +++ b/www/src/components/Author.astro @@ -4,7 +4,11 @@ import authorData from '../data/authors.json'; export let authorId: string; const author = authorData[authorId]; --- - +

by {author.name}{' '}@{author.twitter}

diff --git a/www/src/components/BlogHeader.astro b/www/src/components/BlogHeader.astro index 40d030a4cd..326a6fe029 100644 --- a/www/src/components/BlogHeader.astro +++ b/www/src/components/BlogHeader.astro @@ -28,11 +28,15 @@ Astro + + + Twitter + - View on GitHub → + View on GitHub @@ -50,6 +54,7 @@ article { } .header-subitem { display: flex; + flex-grow: 0; gap: 0.5em; align-items: center; justify-content: center; @@ -75,6 +80,8 @@ h1 { margin: 0; font-size: 1.5rem; max-width: 100%; + display: flex; + flex-grow: 1; } .logo { diff --git a/www/src/components/BlogPost.astro b/www/src/components/BlogPost.astro index 44154137eb..0884c65759 100644 --- a/www/src/components/BlogPost.astro +++ b/www/src/components/BlogPost.astro @@ -1,5 +1,6 @@ --- import Author from './Author.astro'; +import GithubStarButton from './GithubStarButton.astro'; export let title: string; export let author: string; @@ -15,6 +16,7 @@ export let heroImage: string;

{publishDate}

{title}

+
diff --git a/www/src/components/GithubStarButton.astro b/www/src/components/GithubStarButton.astro new file mode 100644 index 0000000000..e8152cb462 --- /dev/null +++ b/www/src/components/GithubStarButton.astro @@ -0,0 +1,7 @@ + +
+Star +
+ + \ No newline at end of file diff --git a/www/src/pages/blog/introducing-astro.astro b/www/src/pages/blog/introducing-astro.astro index 3704b46e71..327d4201f6 100644 --- a/www/src/pages/blog/introducing-astro.astro +++ b/www/src/pages/blog/introducing-astro.astro @@ -32,8 +32,8 @@ let permalink = 'https://astro.build/blog/introducing-astro'; Today I'm excited to publicly share Astro: a new kind of static site builder that delivers lightning-fast performance with a modern developer experience. To design Astro, we borrowed the best parts of our favorite tools and then added a few innovations of our own, including: - **Bring Your Own Framework (BYOF):** Build your site using React, Svelte, Vue, Preact, web components, or just plain ol' HTML + JavaScript. - - **100% Static HTML, No JS:** Astro strips out JavaScript from your final build and renders every page to HTML by default. - - **On-Demand Components:** Astro hydrates interactive components when they enter the visible page. If the user never sees it, they never load it. + - **100% Static HTML, No JS:** Astro renders your entire page to static HTML, removing all JavaScript from your final build by default. + - **On-Demand Components:** Need some JS? Astro can automatically hydrate interactive components when they become visible on the page. If the user never sees it, they never load it. - **Fully-Featured:** Astro supports TypeScript, Scoped CSS, CSS Modules, Sass, Tailwind, Markdown, MDX, and any of your favorite npm packages. - **SEO Enabled:** Automatic sitemaps, RSS feeds, pagination and collections take the pain out of SEO and syndication.