fix: sidebar display

This commit is contained in:
Nick 2019-08-04 13:54:23 -04:00
parent 065c1bb12e
commit e1f8bf59f5
9 changed files with 338 additions and 52 deletions

306
.gitattributes vendored
View File

@ -1,17 +1,295 @@
# Common settings that generally should always be used with your language specific settings
# Auto detect text files and perform LF normalization
* text eol=lf
# https://www.davidlaing.com/2012/09/19/customise-your-gitattributes-to-become-a-git-ninja/
* text=auto
# Custom for Visual Studio
*.cs diff=csharp
#
# The above will handle all files NOT found below
#
# Standard to msysgit
*.doc diff=astextplain
*.DOC diff=astextplain
*.docx diff=astextplain
*.DOCX diff=astextplain
*.dot diff=astextplain
*.DOT diff=astextplain
*.pdf diff=astextplain
*.PDF diff=astextplain
*.rtf diff=astextplain
*.RTF diff=astextplain
# Documents
*.bibtex text diff=bibtex
*.doc diff=astextplain
*.DOC diff=astextplain
*.docx diff=astextplain
*.DOCX diff=astextplain
*.dot diff=astextplain
*.DOT diff=astextplain
*.pdf diff=astextplain
*.PDF diff=astextplain
*.rtf diff=astextplain
*.RTF diff=astextplain
*.md text
*.tex text diff=tex
*.adoc text
*.textile text
*.mustache text
*.csv text
*.tab text
*.tsv text
*.txt text
*.sql text
# Graphics
*.png binary
*.jpg binary
*.jpeg binary
*.gif binary
*.tif binary
*.tiff binary
*.ico binary
# SVG treated as an asset (binary) by default.
*.svg text
# If you want to treat it as binary,
# use the following line instead.
# *.svg binary
*.eps binary
# Scripts
*.bash text eol=lf
*.sh text eol=lf
# These are explicitly windows files and should use crlf
*.bat text eol=crlf
*.cmd text eol=crlf
*.ps1 text eol=crlf
# Serialisation
*.json text
*.toml text
*.xml text
*.yaml text
*.yml text
# Archives
*.7z binary
*.gz binary
*.tar binary
*.zip binary
#
# Exclude files from exporting
#
.gitattributes export-ignore
.gitignore export-ignore
# Auto detect text files and perform LF normalization
# https://www.davidlaing.com/2012/09/19/customise-your-gitattributes-to-become-a-git-ninja/
* text=auto
*.cs text diff=csharp
# Treat all Go files in this repo as binary, with no git magic updating
# line endings. Windows users contributing to Go will need to use a
# modern version of git and editors capable of LF line endings.
*.go -text diff=golang
## GITATTRIBUTES FOR WEB PROJECTS
#
# These settings are for any web project.
#
# Details per file setting:
# text These files should be normalized (i.e. convert CRLF to LF).
# binary These files are binary and should be left untouched.
#
# Note that binary is a macro for -text -diff.
######################################################################
# Auto detect
## Handle line endings automatically for files detected as
## text and leave all files detected as binary untouched.
## This will handle all files NOT defined below.
* text=auto
# Source code
*.bash text eol=lf
*.bat text eol=crlf
*.cmd text eol=crlf
*.coffee text
*.css text
*.htm text diff=html
*.html text diff=html
*.inc text
*.ini text
*.js text
*.json text
*.jsx text
*.less text
*.ls text
*.map text -diff
*.od text
*.onlydata text
*.php text diff=php
*.pl text
*.ps1 text eol=crlf
*.py text diff=python
*.rb text diff=ruby
*.sass text
*.scm text
*.scss text diff=css
*.sh text eol=lf
*.sql text
*.styl text
*.tag text
*.ts text
*.tsx text
*.xml text
*.xhtml text diff=html
# Docker
*.dockerignore text
Dockerfile text
# Documentation
*.ipynb text
*.markdown text
*.md text
*.mdwn text
*.mdown text
*.mkd text
*.mkdn text
*.mdtxt text
*.mdtext text
*.txt text
AUTHORS text
CHANGELOG text
CHANGES text
CONTRIBUTING text
COPYING text
copyright text
*COPYRIGHT* text
INSTALL text
license text
LICENSE text
NEWS text
readme text
*README* text
TODO text
# Templates
*.dot text
*.ejs text
*.haml text
*.handlebars text
*.hbs text
*.hbt text
*.jade text
*.latte text
*.mustache text
*.njk text
*.phtml text
*.tmpl text
*.tpl text
*.twig text
*.vue text
# Linters
.csslintrc text
.eslintrc text
.htmlhintrc text
.jscsrc text
.jshintrc text
.jshintignore text
.stylelintrc text
# Configs
*.bowerrc text
*.cnf text
*.conf text
*.config text
.babelrc text
.browserslistrc text
.editorconfig text
.env text
.gitattributes text
.gitconfig text
.htaccess text
*.lock text -diff
package-lock.json text -diff
*.npmignore text
*.yaml text
*.yml text
browserslist text
Makefile text
makefile text
# Heroku
Procfile text
.slugignore text
# Graphics
*.ai binary
*.bmp binary
*.eps binary
*.gif binary
*.gifv binary
*.ico binary
*.jng binary
*.jp2 binary
*.jpg binary
*.jpeg binary
*.jpx binary
*.jxr binary
*.pdf binary
*.png binary
*.psb binary
*.psd binary
# SVG treated as an asset (binary) by default.
*.svg text
# If you want to treat it as binary,
# use the following line instead.
# *.svg binary
*.svgz binary
*.tif binary
*.tiff binary
*.wbmp binary
*.webp binary
# Audio
*.kar binary
*.m4a binary
*.mid binary
*.midi binary
*.mp3 binary
*.ogg binary
*.ra binary
# Video
*.3gpp binary
*.3gp binary
*.as binary
*.asf binary
*.asx binary
*.fla binary
*.flv binary
*.m4v binary
*.mng binary
*.mov binary
*.mp4 binary
*.mpeg binary
*.mpg binary
*.ogv binary
*.swc binary
*.swf binary
*.webm binary
# Archives
*.7z binary
*.gz binary
*.jar binary
*.rar binary
*.tar binary
*.zip binary
# Fonts
*.ttf binary
*.eot binary
*.otf binary
*.woff binary
*.woff2 binary
# Executables
*.exe binary
*.pyc binary

View File

@ -181,7 +181,8 @@ export default {
initialScrollX: 0,
scrollingX: false,
easing: 'easeOutQuad',
speed: 1000
speed: 1000,
verticalNativeBarPos: this.$vuetify.rtl ? `left` : `right`
},
rail: {
gutterOfEnds: '2px'

View File

@ -175,7 +175,7 @@ export default {
position: absolute;
right: 0;
top: 12px;
font-size: 120px !important;
font-size: 100px !important;
opacity: .25;
}

View File

@ -117,9 +117,9 @@
.caption.ml-2(:class='item.availability <= 33 ? `red--text` : (item.availability <= 66) ? `orange--text` : `green--text`') {{item.availability}}%
template(v-slot:item.isInstalled='{ item }')
v-progress-circular(v-if='item.isDownloading', indeterminate, color='blue', size='20', :width='2')
v-btn(v-else-if='item.isInstalled && item.installDate < item.updatedAt', icon, @click='download(item)')
v-btn(v-else-if='item.isInstalled && item.installDate < item.updatedAt', icon, small, @click='download(item)')
v-icon.blue--text mdi-cached
v-btn(v-else-if='item.isInstalled', icon, @click='download(item)')
v-btn(v-else-if='item.isInstalled', icon, small, @click='download(item)')
v-icon.green--text mdi-check
v-btn(v-else, icon, small, @click='download(item)')
v-icon.grey--text mdi-cloud-download

View File

@ -56,7 +56,7 @@
v-list-item.pl-4(@click='assets')
v-list-item-avatar(size='24'): v-icon(color='grey lighten-2') mdi-folder-multiple-image
v-list-item-title.body-2.grey--text.text--ligten-2 {{$t('common:header.imagesFiles')}}
v-toolbar-title(:class='{ "ml-2": $vuetify.breakpoint.mdAndUp, "ml-0": $vuetify.breakpoint.smAndDown }')
v-toolbar-title(:class='{ "mx-2": $vuetify.breakpoint.mdAndUp, "mx-0": $vuetify.breakpoint.smAndDown }')
span.subheading {{title}}
v-flex(md4, v-if='$vuetify.breakpoint.mdAndUp')
v-toolbar.nav-header-inner(color='black', dark, flat)
@ -159,7 +159,7 @@
template(v-slot:activator='{ on: menu }')
v-tooltip(bottom)
template(v-slot:activator='{ on: tooltip }')
v-btn(icon, v-on='{ ...menu, ...tooltip }', outlined, color='blue')
v-btn(icon, v-on='{ ...menu, ...tooltip }')
v-icon(v-if='picture.kind === `initials`', color='grey') mdi-account-circle
v-avatar(v-else-if='picture.kind === `image`', :size='29')
v-img(:src='picture.url')
@ -173,7 +173,7 @@
v-img(:src='picture.url')
v-list-item-content
v-list-item-title {{name}}
v-list-item-sub-title {{email}}
v-list-item-subtitle {{email}}
v-divider.my-0
v-list-item(href='/w', disabled)
v-list-item-action: v-icon(color='blue') mdi-view-compact-outline

View File

@ -1,6 +1,15 @@
<template lang="pug">
v-list.py-2(dense, :class='color', :dark='dark')
slot
template(v-for='item of items')
v-list-item(
v-if='item.kind === `link`'
:href='item.target'
)
v-list-item-avatar(size='24')
v-icon {{ item.icon }}
v-list-item-title {{ item.label }}
v-divider.my-2(v-else-if='item.kind === `divider`')
v-subheader.pl-4(v-else-if='item.kind === `header`') {{ item.label }}
</template>
<script>
@ -13,6 +22,10 @@ export default {
dark: {
type: Boolean,
default: true
},
items: {
type: Array,
default: () => []
}
},
data() {

View File

@ -12,8 +12,7 @@
:right='$vuetify.rtl'
)
vue-scroll(:ops='scrollStyle')
nav-sidebar(:color='darkMode ? `grey darken-5` : `primary`')
slot(name='sidebar')
nav-sidebar(:color='darkMode ? `grey darken-5` : `primary`', :items='sidebar')
v-fab-transition
v-btn(
@ -28,7 +27,7 @@
v-if='$vuetify.breakpoint.mdAndDown'
v-show='!navShown'
)
v-icon menu
v-icon mdi-menu
v-content(ref='content')
template(v-if='path !== `home`')
@ -64,12 +63,12 @@
v-list-item(@click='$vuetify.goTo(tocItem.anchor, scrollOpts)')
v-icon(color='grey', small) mdi-chevron-right
v-list-item-title.pl-3 {{tocItem.title}}
// v-divider(v-if='tocIdx < toc.length - 1 || tocItem.children.length')
//- v-divider(v-if='tocIdx < toc.length - 1 || tocItem.children.length')
template(v-for='tocSubItem in tocItem.children')
v-list-item(@click='$vuetify.goTo(tocSubItem.anchor, scrollOpts)')
v-icon.pl-3(color='grey lighten-1', small) mdi-chevron-right
v-list-item-title.pl-3.caption.grey--text.text--darken-1 {{tocSubItem.title}}
// v-divider(inset, v-if='tocIdx < toc.length - 1')
//- v-divider(inset, v-if='tocIdx < toc.length - 1')
v-card.mt-5
.pa-5.pt-3
@ -81,15 +80,10 @@
v-btn.btn-animate-edit(icon, :href='"/h/" + locale + "/" + path', v-on='on', x-small)
v-icon(color='grey', dense) mdi-history
span History
v-tooltip(top, v-if='isAuthenticated')
template(v-slot:activator='{ on }')
v-btn.btn-animate-edit(icon, :href='"/e/" + locale + "/" + path', v-on='on', x-small)
v-icon(color='grey', dense) mdi-pencil
span {{$t('common:page.editPage')}}
.body-2.grey--text(:class='darkMode ? `` : `text--darken-3`') {{ authorName }}
.caption.grey--text.text--darken-1 {{ updatedAt | moment('calendar') }}
v-card.mt-5(v-if='tags.length > 0')
v-card.mt-5(v-if='tags.length > 0 || true')
.pa-5
.overline.teal--text.pb-2 Tags
v-chip.mr-1(
@ -119,19 +113,24 @@
v-spacer
v-tooltip(bottom)
template(v-slot:activator='{ on }')
v-btn(icon, small, v-on='on'): v-icon(color='grey') mdi-bookmark
v-btn(icon, tile, small, v-on='on'): v-icon(color='grey') mdi-bookmark
span {{$t('common:page.bookmark')}}
v-tooltip(bottom)
template(v-slot:activator='{ on }')
v-btn(icon, small, v-on='on'): v-icon(color='grey') mdi-share-variant
v-btn(icon, tile, small, v-on='on'): v-icon(color='grey') mdi-share-variant
span {{$t('common:page.share')}}
v-tooltip(bottom)
template(v-slot:activator='{ on }')
v-btn(icon, small, v-on='on'): v-icon(color='grey') mdi-printer
v-btn(icon, tile, small, v-on='on'): v-icon(color='grey') mdi-printer
span {{$t('common:page.printFormat')}}
v-spacer
v-flex.page-col-content(xs12, lg9, xl10)
v-tooltip(left, v-if='isAuthenticated')
template(v-slot:activator='{ on }')
v-btn.btn-animate-edit(fab, bottom, right, color='primary', fixed, dark, :href='"/e/" + locale + "/" + path', v-on='on')
v-icon mdi-pencil
span {{$t('common:page.editPage')}}
.contents(ref='container')
slot(name='contents')
nav-footer
@ -143,11 +142,14 @@
fab
fixed
bottom
:right='!$vuetify.rtl'
:left='$vuetify.rtl'
:right='$vuetify.rtl'
:left='!$vuetify.rtl'
small
depressed
@click='$vuetify.goTo(0, scrollOpts)'
color='primary'
dark
:style='$vuetify.rtl ? `right: 235px;` : `left: 235px;`'
)
v-icon mdi-arrow-up
</template>
@ -221,6 +223,10 @@ export default {
toc: {
type: Array,
default: () => []
},
sidebar: {
type: Array,
default: () => []
}
},
data() {

View File

@ -293,7 +293,7 @@ module.exports = () => {
config: [
{
id: uuid(),
icon: 'home',
icon: 'mdi-home',
kind: 'link',
label: 'Home',
target: '/',

View File

@ -21,20 +21,8 @@ block body
:is-published=page.isPublished.toString()
:toc=page.toc
:page-id=page.id
:sidebar=sidebar
)
template(slot='sidebar')
each navItem in sidebar
if navItem.kind === 'link'
v-list-item(
href=navItem.target
)
v-list-item-avatar
v-icon= navItem.icon
v-list-item-title= navItem.label
else if navItem.kind === 'divider'
v-divider.my-2
else if navItem.kind === 'header'
v-subheader.pl-4= navItem.label
template(slot='contents')
div(v-pre)!= page.render
if injectCode.body