Skip to content

Commit

Permalink
Merge branch 'main' into fix/image-noexternal
Browse files Browse the repository at this point in the history
  • Loading branch information
Tony Sullivan authored Jul 8, 2022
2 parents 6150616 + 59e8c71 commit 4e674f5
Show file tree
Hide file tree
Showing 84 changed files with 978 additions and 706 deletions.
11 changes: 11 additions & 0 deletions .changeset/breezy-ravens-sort.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
---
'@astrojs/deno': patch
'@astrojs/image': patch
'@astrojs/netlify': patch
'@astrojs/node': patch
'@astrojs/prefetch': patch
'@astrojs/sitemap': patch
'@astrojs/vercel': patch
---

Small README fixes
42 changes: 21 additions & 21 deletions examples/basics/src/components/Card.astro
Original file line number Diff line number Diff line change
@@ -1,26 +1,26 @@
---
export interface Props {
title: string,
body: string,
href: string,
title: string;
body: string;
href: string;
}
const {href, title, body} = Astro.props;
const { href, title, body } = Astro.props;
---

<li class="link-card">
<a href={href}>
<h2>
{title}
<span>&rarr;</span>
</h2>
<p>
{body}
</p>
</a>
<a href={href}>
<h2>
{title}
<span>&rarr;</span>
</h2>
<p>
{body}
</p>
</a>
</li>
<style>

:root {
--link-gradient: linear-gradient(45deg, #4F39FA, #DA62C4 30%, var(--color-border) 60%);
--link-gradient: linear-gradient(45deg, #4f39fa, #da62c4 30%, var(--color-border) 60%);
}

.link-card {
Expand Down Expand Up @@ -49,11 +49,11 @@ const {href, title, body} = Astro.props;
margin: 0;
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
p {
margin-top: 0.75rem;
margin-bottom: 0;
}

p {
margin-top: 0.75rem;
margin-bottom: 0;
}

h2 span {
display: inline-block;
Expand All @@ -65,7 +65,7 @@ const {href, title, body} = Astro.props;
}

.link-card:is(:hover, :focus-within) h2 {
color: #4F39FA;
color: #4f39fa;
}

.link-card:is(:hover, :focus-within) h2 span {
Expand Down
69 changes: 34 additions & 35 deletions examples/basics/src/layouts/Layout.astro
Original file line number Diff line number Diff line change
Expand Up @@ -8,49 +8,48 @@ const { title } = Astro.props as Props;

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<title>{title}</title>
</head>
<body>
<slot />
</body>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<title>{title}</title>
</head>
<body>
<slot />
</body>
</html>

<style>
:root {
--font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
--font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem);
--font-size-xl: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem);
:root {
--font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
--font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem);
--font-size-xl: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem);

--color-text: hsl(12, 5%, 4%);
--color-bg: hsl(10, 21%, 95%);
--color-text: hsl(12, 5%, 4%);
--color-bg: hsl(10, 21%, 95%);
--color-border: hsl(17, 24%, 90%);
}
}

html {
font-family: system-ui, sans-serif;
font-size: var(--font-size-base);
color: var(--color-text);
background-color: var(--color-bg);
}
html {
font-family: system-ui, sans-serif;
font-size: var(--font-size-base);
color: var(--color-text);
background-color: var(--color-bg);
}

body {
margin: 0;
}
body {
margin: 0;
}

:global(h1) {
font-size: var(--font-size-xl);
}
:global(h1) {
font-size: var(--font-size-xl);
}

:global(h2) {
font-size: var(--font-size-lg);
}
:global(h2) {
font-size: var(--font-size-lg);
}

:global(code) {
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
:global(code) {
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
Bitstream Vera Sans Mono, Courier New, monospace;
}
}
</style>
48 changes: 35 additions & 13 deletions examples/basics/src/pages/index.astro
Original file line number Diff line number Diff line change
@@ -1,26 +1,43 @@
---
import Layout from '../layouts/Layout.astro';
import Card from '../components/Card.astro';
import Layout from "../layouts/Layout.astro";
import Card from "../components/Card.astro";
---

<Layout title="Welcome to Astro.">
<main>
<h1>Welcome to <span class="text-gradient">Astro</span></h1>
<p class="instructions">
Check out the <code>src/pages</code> directory to get started.<br/>
Check out the <code>src/pages</code> directory to get started.<br />
<strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message above.
</p>
<ul role="list" class="link-card-grid">
<Card href="https://docs.astro.build/" title="Documentation" body="Learn how Astro works and explore the official API docs." />
<Card href="https://astro.build/integrations/" title="Integrations" body="Supercharge your project with new frameworks and libraries." />
<Card href="https://astro.build/themes/" title="Themes" body="Explore a galaxy of community-built starter themes." />
<Card href="https://astro.build/chat/" title="Chat" body="Come say hi to our amazing Discord community. ❤️" />
<Card
href="https://docs.astro.build/"
title="Documentation"
body="Learn how Astro works and explore the official API docs."
/>
<Card
href="https://astro.build/integrations/"
title="Integrations"
body="Supercharge your project with new frameworks and libraries."
/>
<Card
href="https://astro.build/themes/"
title="Themes"
body="Explore a galaxy of community-built starter themes."
/>
<Card
href="https://astro.build/chat/"
title="Chat"
body="Come say hi to our amazing Discord community. ❤️"
/>
</ul>
</main>
</Layout>

<style>
:root {
--astro-gradient: linear-gradient(0deg,#4F39FA, #DA62C4);
--astro-gradient: linear-gradient(0deg, #4f39fa, #da62c4);
}

h1 {
Expand All @@ -29,7 +46,7 @@ import Card from '../components/Card.astro';

main {
margin: auto;
padding: 1em;
padding: 1em;
max-width: 60ch;
}

Expand All @@ -45,15 +62,20 @@ import Card from '../components/Card.astro';
}

@keyframes pulse {
0%, 100% { background-position-y: 0%; }
50% { background-position-y: 80%; }
0%,
100% {
background-position-y: 0%;
}
50% {
background-position-y: 80%;
}
}

.instructions {
line-height: 1.6;
margin: 1rem 0;
background: #4F39FA;
padding: 1.0rem;
background: #4f39fa;
padding: 1rem;
border-radius: 0.4rem;
color: var(--color-bg);
}
Expand Down
17 changes: 10 additions & 7 deletions examples/blog-multiple-authors/src/components/MainHead.astro
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
import '../styles/global.css';
import "../styles/global.css";
export interface Props {
title: string;
Expand All @@ -19,7 +19,10 @@ const { title, description, image, type, next, prev, canonicalURL } = Astro.prop
<title>{title}</title>
<meta name="description" content={description} />
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet" />
<link
href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,400;0,700;1,400;1,700&display=swap"
rel="stylesheet"
/>
<!-- Sitemap -->
<link rel="sitemap" href="/sitemap.xml" />
<!-- RSS -->
Expand All @@ -30,17 +33,17 @@ const { title, description, image, type, next, prev, canonicalURL } = Astro.prop

<!-- SEO -->
<link rel="canonical" href={canonicalURL} />
{next && <link rel="next" aria-label="Previous Page" href={new URL(next, canonicalURL).href}>}
{prev && <link rel="prev" aria-label="Next Page" href={new URL(prev, canonicalURL).href}>}
{next && <link rel="next" aria-label="Previous Page" href={new URL(next, canonicalURL).href} />}
{prev && <link rel="prev" aria-label="Next Page" href={new URL(prev, canonicalURL).href} />}

<!-- OpenGraph -->
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
{image && (<meta property="og:image" content={new URL(image, canonicalURL)}>)}
{image && <meta property="og:image" content={new URL(image, canonicalURL)} />}

<!-- Twitter -->
<meta name="twitter:card" content={image ? 'summary_large_image' : 'summary'} />
<meta name="twitter:card" content={image ? "summary_large_image" : "summary"} />
<meta name="twitter:site" content="@astro" />
<meta name="twitter:title" content={title} />
<meta name="twitter:description" content={description} />
{image && (<meta name="twitter:image" content={image}>)}
{image && <meta name="twitter:image" content={image} />}
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ const { prevUrl, nextUrl } = Astro.props;

<div class="wrapper">
<nav class="nav">
<a class="prev" href={prevUrl || '#'} aria-label="Previous Page">Prev</a>
<a class="next" href={nextUrl || '#'} aria-label="Next Page">Next</a>
<a class="prev" href={prevUrl || "#"} aria-label="Previous Page">Prev</a>
<a class="next" href={nextUrl || "#"} aria-label="Next Page">Next</a>
</nav>
</div>

Expand All @@ -29,7 +29,7 @@ const { prevUrl, nextUrl } = Astro.props;
text-transform: uppercase;
font-size: 0.8em;

&[href='#'] {
&[href="#"] {
display: none;
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const { post, author } = Astro.props;
const { frontmatter } = post;
function formatDate(date) {
return new Date(date).toUTCString().replace(/(\d\d\d\d) .*/, '$1'); // remove everything after YYYY
return new Date(date).toUTCString().replace(/(\d\d\d\d) .*/, "$1"); // remove everything after YYYY
}
---

Expand Down
15 changes: 10 additions & 5 deletions examples/blog-multiple-authors/src/layouts/post.astro
Original file line number Diff line number Diff line change
@@ -1,16 +1,21 @@
---
import MainHead from '../components/MainHead.astro';
import Nav from '../components/Nav.astro';
import authorData from '../data/authors.json';
import MainHead from "../components/MainHead.astro";
import Nav from "../components/Nav.astro";
import authorData from "../data/authors.json";
const { content } = Astro.props;
let canonicalURL = Astro.canonicalURL;
---

<html lang={content.lang || 'en'}>
<html lang={content.lang || "en"}>
<head>
<title>{content.title}</title>
<MainHead title={content.title} description={content.description} image={content.image} {canonicalURL} />
<MainHead
title={content.title}
description={content.description}
image={content.image}
{canonicalURL}
/>
<style lang="scss">
.title {
margin-top: 4rem;
Expand Down
26 changes: 15 additions & 11 deletions examples/blog-multiple-authors/src/pages/about.astro
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
---
import MainHead from '../components/MainHead.astro';
import Nav from '../components/Nav.astro';
import MainHead from "../components/MainHead.astro";
import Nav from "../components/Nav.astro";
let title = 'About';
let description = 'About page of an example blog on Astro';
let title = "About";
let description = "About page of an example blog on Astro";
let canonicalURL = Astro.canonicalURL;
---

Expand Down Expand Up @@ -54,15 +54,19 @@ let canonicalURL = Astro.canonicalURL;
</div>
<div class="text">
<p>
The book cover and spine above and the images which follow were not part of the original Ormsby translation—they are taken from the 1880 edition of J. W. Clark,
illustrated by Gustave Doré. Clark in his edition states that, “The English text of ‘Don Quixote’ adopted in this edition is that of Jarvis, with occasional corrections
from Motteaux.”
The book cover and spine above and the images which follow were not part of the original
Ormsby translation—they are taken from the 1880 edition of J. W. Clark, illustrated by
Gustave Doré. Clark in his edition states that, “The English text of ‘Don Quixote’ adopted
in this edition is that of Jarvis, with occasional corrections from Motteaux.”
</p>
<p>
See in the introduction below John Ormsby’s critique of both the Jarvis and Motteaux translations. It has been elected in the present Project Gutenberg edition to attach
the famous engravings of Gustave Doré to the Ormsby translation instead of the Jarvis/Motteaux. The detail of many of the Doré engravings can be fully appreciated only by
utilizing the “Full Size” button to expand them to their original dimensions. Ormsby in his Preface has criticized the fanciful nature of Doré’s illustrations; others
feel these woodcuts and steel engravings well match Quixote’s dreams.
See in the introduction below John Ormsby’s critique of both the Jarvis and Motteaux
translations. It has been elected in the present Project Gutenberg edition to attach the
famous engravings of Gustave Doré to the Ormsby translation instead of the
Jarvis/Motteaux. The detail of many of the Doré engravings can be fully appreciated only
by utilizing the “Full Size” button to expand them to their original dimensions. Ormsby in
his Preface has criticized the fanciful nature of Doré’s illustrations; others feel these
woodcuts and steel engravings well match Quixote’s dreams.
</p>
</div>
</main>
Expand Down
Loading

0 comments on commit 4e674f5

Please sign in to comment.