ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

add github icon

Browse Source
This commit is contained in:
Philipp Kühn
2020-04-18 22:35:29 +02:00
parent 53d20a454a
commit 10fd993f44
7 changed files with 179 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
docs/src/layouts/App/index.vue
View File

@@ -1,35 +1,32 @@
<template>
<div class="app">
<header class="app__header">
<div class="app__inner">
<g-link class="app__logo" to="/">
{{ $static.metadata.siteName }}
</g-link>
</div>
<g-link class="app__logo" to="/">
{{ $static.metadata.siteName }}
</g-link>
<g-link to="https://github.com/scrumpy/tiptap">
<icon name="github" />
</g-link>
</header>
<div class="app__content">
<div class="app__inner">
<div class="app__content-inner">
<nav class="app__sidebar">
<div class="app__link-group" v-for="(linkGroup, i) in linkGroups" :key="i">
<div class="app__link-group-title">
{{ linkGroup.title }}
</div>
<ul>
<li v-for="(item, j) in linkGroup.items" :key="j">
<g-link class="app__link" :to="item.link">
{{ item.title }}
</g-link>
</li>
</ul>
</div>
</nav>
<main class="app__main">
<slot/>
<page-navigation />
</main>
<nav class="app__sidebar">
<div class="app__link-group" v-for="(linkGroup, i) in linkGroups" :key="i">
<div class="app__link-group-title">
{{ linkGroup.title }}
</div>
<ul>
<li v-for="(item, j) in linkGroup.items" :key="j">
<g-link class="app__link" :to="item.link">
{{ item.title }}
</g-link>
</li>
</ul>
</div>
</div>
</nav>
<main class="app__main">
<slot/>
<page-navigation />
</main>
</div>
</div>
</template>
@@ -44,10 +41,12 @@ query {
<script>
import linkGroups from '@/data/links.yaml'
import Icon from '@/components/Icon'
import PageNavigation from '@/components/PageNavigation'
export default {
components: {
Icon,
PageNavigation,
},

19
docs/src/layouts/App/style.scss
View File

@@ -37,19 +37,28 @@
}
}
&__header,
&__content {
display: flex;
width: 100%;
max-width: 62rem;
margin: 0 auto;
padding-left: 2rem;
padding-right: 2rem;
}
&__header {
flex: 0 0 auto;
padding: 2rem 0;
align-items: center;
justify-content: space-between;
padding-top: 2rem;
padding-bottom: 2rem;
}
&__content {
flex: 1 1 auto;
}
&__content-inner {
display: flex;
}
&__sidebar {
flex: 0 0 auto;
width: 18rem;