docs: make the sidebar sticky

Instead of floating the sidebar, we want it to be stick so that the
footer doesn't cover the bottom of the sidebar.

Signed-off-by: Andrew Rynhard <andrew@andrewrynhard.com>
This commit is contained in:
Andrew Rynhard 2019-10-20 03:36:46 +00:00
parent 06aa63fbb3
commit 68d0798930
4 changed files with 6 additions and 12 deletions

View File

@ -50,10 +50,6 @@ pre[class*='language-'] {
@apply font-mono;
}
.article-content {
@apply max-w-3xl pt-1 pb-4 pl-6 pr-6 mx-auto;
}
h1,
h2,
h3,

View File

@ -1,5 +1,5 @@
<template>
<article class="article-content c-rich-text">
<article class="max-w-3xl pt-1 pb-4 pl-6 pr-6 mx-auto c-rich-text">
<h1 class="page-heading">{{ doc.title }}</h1>
<div class="my-0">
<a

View File

@ -1,5 +1,5 @@
<template>
<div class="sidenav pt-4 pb-4">
<div class="sidenav sticky pt-4 pb-4">
<ul class="mt-8">
<li
v-for="entry in $store.state.sidebar.menu"
@ -61,9 +61,7 @@ export default {
<style>
.sidenav {
height: 100%;
position: fixed;
z-index: 1;
top: 7%;
overflow-x: hidden;
}

View File

@ -7,11 +7,11 @@
</div>
<DocumentationDropdown></DocumentationDropdown>
</div>
<div class="md:flex flex-wrap">
<div class="md:w-1/4 mt-1">
<div class="flex md:flex-wrap">
<div class="w-1/4 mt-1">
<Sidebar></Sidebar>
</div>
<div class="md:w-3/4 mt-1">
<div class="w-3/4 mt-1">
<Content></Content>
</div>
</div>