elias/strudel
1
0
Fork 0
mirror of https://github.com/eliasstepanik/strudel.git synced 2026-01-14 07:08:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

responsiveness

Browse Source
This commit is contained in:
Felix Roos 2022-12-22 23:07:14 +01:00
parent f18a2a11fa
commit 6a9e9ebc4c
3 changed files with 8 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
website/src/components/PageContent/PageContent.astro
View File

@ -16,9 +16,11 @@ const title = frontmatter.title;
<article id="article" class="content">
<section class="main-section">
<nav class="block sm:hidden">
<!-- TODO: add dropdown toc on mobile -->
<!-- <nav class="block sm:hidden mb-8">
<span>On this Page:</span>
<TableOfContents client:media="(max-width: 50em)" headings={headings} />
</nav>
</nav> -->
<div class="prose prose-invert max-w-full">
<slot />
</div>
@ -27,7 +29,6 @@ const title = frontmatter.title;
<MoreMenu editHref={githubEditUrl} />
</nav>
</article>
<style>
.content {
padding: 0;
@ -37,18 +38,4 @@ const title = frontmatter.title;
display: flex;
flex-direction: column;
}
.content > section {
margin-bottom: 4rem;
}
.block {
display: block;
}
@media (min-width: 50em) {
.sm\:hidden {
display: none;
}
}
</style>

6
website/src/layouts/MainLayout.astro
View File

@ -30,14 +30,14 @@ const githubEditUrl = `${CONFIG.GITHUB_EDIT_URL}/${currentFile}`;
</title>
</head>
<body class="h-screen text-gray-50 ">
<body class="h-screen text-gray-50">
<div class="w-full h-full space-y-4 flex flex-col">
<header class="max-w-full fixed top-0 w-full z-[100]">
<Header currentPage={currentPage} />
</header>
<main class="relative pt-16">
<div class="h-full top-0 overflow-auto px-2 min-w-[300px] flex xl:justify-center pl-[300px] xl:pl-0">
<aside title="Site Navigation" class="fixed w-[300px] px-6 left-0">
<div class="h-full top-0 overflow-auto min-w-[300px] flex xl:justify-center pr-4 pl-4 md:pl-[300px] xl:pl-0">
<aside title="Site Navigation" class="w-[300px] px-6 left-0 hidden md:block fixed">
<LeftSidebar currentPage={currentPage} />
</aside>
<PageContent frontmatter={frontmatter} headings={headings} githubEditUrl={githubEditUrl}>

2
website/src/repl/Footer.jsx
View File

@ -104,7 +104,7 @@ export function Footer({ context }) {
</p>
<p>
To learn more about what this all means, check out the{' '}
<a href="https://strudel.tidalcycles.org/tutorial" target="_blank">
<a href="./tutorial" target="_blank">
interactive tutorial
</a>
. Also feel free to join the{' '}