mirrors/talos
1
0
Fork 0
mirror of https://github.com/siderolabs/talos.git synced 2025-08-18 21:21:10 +02:00
Code Issues Packages Projects Releases Wiki Activity

docs: make the sidebar sticky

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/website/assets/css/main.css
View File

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

2
docs/website/components/Content.vue
View File

@ -1,5 +1,5 @@
<template> <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> <h1 class="page-heading">{{ doc.title }}</h1>
<div class="my-0"> <div class="my-0">
<a <a

6
docs/website/components/Sidebar.vue
View File

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

6
docs/website/pages/docs/_.vue
View File

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