diff options
| author |  Jonathan Neal <jonathantneal@hotmail.com>
| 2021-12-22 16:11:05 -0500 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2021-12-22 16:11:05 -0500 |
| commit | 6ddd7678ffb6598ae6e263706813cb5e94535f02 (patch) | |
| tree | d4b45f7590b59c3574bd6593b17d8066f71007c6 /examples/docs/src/components/PageContent | |
| parent | 305ce4182fbe89abcfb88008ddce178bd8863b6a (diff) | |
| download | astro-6ddd7678ffb6598ae6e263706813cb5e94535f02.tar.gz astro-6ddd7678ffb6598ae6e263706813cb5e94535f02.tar.zst astro-6ddd7678ffb6598ae6e263706813cb5e94535f02.zip | |
Use accessible indentation (#2253)
Diffstat (limited to 'examples/docs/src/components/PageContent')
| -rw-r--r-- | examples/docs/src/components/PageContent/PageContent.astro | 66 |
1 files changed, 34 insertions, 32 deletions
diff --git a/examples/docs/src/components/PageContent/PageContent.astro b/examples/docs/src/components/PageContent/PageContent.astro index 4d904852a..32db5cd58 100644 --- a/examples/docs/src/components/PageContent/PageContent.astro +++ b/examples/docs/src/components/PageContent/PageContent.astro @@ -2,41 +2,43 @@ import MoreMenu from '../RightSidebar/MoreMenu.astro'; import TableOfContents from '../RightSidebar/TableOfContents.tsx'; -const {content, githubEditUrl} = Astro.props; +const { content, githubEditUrl } = Astro.props; const title = content.title; const headers = content.astro.headers; --- + +<article id="article" class="content"> + <section class="main-section"> + <h1 class="content-title" id="overview">{title}</h1> + <nav class="block sm:hidden"> + <TableOfContents client:media="(max-width: 50em)" {headers} /> + </nav> + <slot /> + </section> + <nav class="block sm:hidden"> + <MoreMenu editHref={githubEditUrl} /> + </nav> +</article> + <style> - .content { - padding: 0; - max-width: 75ch; - width: 100%; - height: 100%; - display: flex; - flex-direction: column; - } - .content > section { - margin-bottom: 4rem; - } - .block { - display: block; - } + .content { + padding: 0; + max-width: 75ch; + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + } + .content > section { + margin-bottom: 4rem; + } + .block { + display: block; + } - @media (min-width: 50em) { - .sm\:hidden { - display: none; - } - } + @media (min-width: 50em) { + .sm\:hidden { + display: none; + } + } </style> -<article id="article" class="content"> - <section class="main-section"> - <h1 class="content-title" id="overview">{title}</h1> - <nav class="block sm:hidden"> - <TableOfContents client:media="(max-width: 50em)" headers={headers} /> - </nav> - <slot /> - </section> - <nav class="block sm:hidden"> - <MoreMenu editHref={githubEditUrl}/> - </nav> -</article>
\ No newline at end of file |