Skip to content

W
wiki-js
Commit 6ea3ff11 authored by Nick's avatar Nick
Browse files
Options

feat: admin enter animation

parent f3b8d37f
Hide whitespace changes
Inline Side-by-side
Showing with 65 additions and 66 deletions
client/components/admin/admin-auth.vue
View file @ 6ea3ff11
......@@ -3,18 +3,18 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-unlock.svg', alt='Authentication', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-unlock.svg', alt='Authentication', style='width: 80px;')
.admin-header-title
.headline.primary--text Authentication
.subheading.grey--text Configure the authentication settings of your wiki #[v-chip(label, color='primary', small).white--text coming soon]
.headline.primary--text.animated.fadeInLeft Authentication
.subheading.grey--text.animated.fadeInLeft.wait-p4s Configure the authentication settings of your wiki #[v-chip(label, color='primary', small).white--text coming soon]
v-spacer
v-btn(outline, color='grey', @click='refresh', large)
v-btn.animated.fadeInDown.wait-p2s(outline, color='grey', @click='refresh', large)
v-icon refresh
v-btn(color='success', @click='save', depressed, large)
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) check
span {{$t('common:actions.apply')}}
v-card.mt-3
v-card.mt-3.animated.fadeInUp
v-tabs(color='grey darken-2', fixed-tabs, slider-color='white', show-arrows, dark)
v-tab(key='settings'): v-icon settings
v-tab(v-for='strategy in activeStrategies', :key='strategy.key') {{ strategy.title }}
......
client/components/admin/admin-contribute.vue
View file @ 6ea3ff11
......@@ -3,11 +3,11 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-heart-health.svg', alt='Contribute', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-heart-health.svg', alt='Contribute', style='width: 80px;')
.admin-header-title
.headline.primary--text {{ $t('admin:contribute.title') }}
.subheading.grey--text {{ $t('admin:contribute.subtitle') }}
v-card.mt-3
.headline.primary--text.animated.fadeInLeft {{ $t('admin:contribute.title') }}
.subheading.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:contribute.subtitle') }}
v-card.mt-3.animated.fadeInUp
v-card-text
i18next.body-1.pl-3(path='admin:contribute.openSource', tag='div')
v-icon(color='red') favorite
......
client/components/admin/admin-general.vue
View file @ 6ea3ff11
......@@ -3,19 +3,19 @@
v-layout(row wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-categorize.svg', alt='General', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-categorize.svg', alt='General', style='width: 80px;')
.admin-header-title
.headline.primary--text {{ $t('admin:general.title') }}
.subheading.grey--text {{ $t('admin:general.subtitle') }}
.headline.primary--text.animated.fadeInLeft {{ $t('admin:general.title') }}
.subheading.grey--text.animated.fadeInLeft {{ $t('admin:general.subtitle') }}
v-spacer
v-btn(color='success', depressed, @click='save', large)
v-btn.animated.fadeInDown(color='success', depressed, @click='save', large)
v-icon(left) check
span {{$t('common:actions.apply')}}
v-form.pt-3
v-layout(row wrap)
v-flex(lg6 xs12)
v-form
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading {{ $t('admin:general.siteInfo') }}
......@@ -87,7 +87,7 @@
hint='A unique identifier provided by your analytics service provider.'
)
v-flex(lg6 xs12)
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp.wait-p2s
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading {{ $t('admin:general.siteBranding') }}
......@@ -124,7 +124,7 @@
hint='Name to use when displaying copyright notice in the footer. Leave empty to hide.'
)
v-card.wiki-form.mt-3
v-card.wiki-form.mt-3.animated.fadeInUp.wait-p4s
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading Features
......@@ -169,7 +169,7 @@ export default {
analyticsServices: [
{ text: 'None', value: '' },
{ text: 'Google Analytics', value: 'ga' },
{ text: 'Google Tag Manager', value: 'gtm' },
{ text: 'Google Tag Manager', value: 'gtm' }
],
metaRobots: [
{ text: 'Index', value: 'index' },
......
client/components/admin/admin-groups.vue
View file @ 6ea3ff11
......@@ -3,15 +3,15 @@
v-layout(row wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-people.svg', alt='Groups', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-people.svg', alt='Groups', style='width: 80px;')
.admin-header-title
.headline.blue--text.text--darken-2 Groups
.subheading.grey--text Manage groups and their permissions
.headline.blue--text.text--darken-2.animated.fadeInLeft Groups
.subheading.grey--text.animated.fadeInLeft.wait-p4s Manage groups and their permissions
v-spacer
v-btn(color='grey', outline, @click='refresh', large)
v-btn.animated.fadeInDown.wait-p2s(color='grey', outline, @click='refresh', large)
v-icon refresh
v-dialog(v-model='newGroupDialog', max-width='500')
v-btn(color='primary', depressed, slot='activator', large)
v-btn.animated.fadeInDown(color='primary', depressed, slot='activator', large)
v-icon(left) add
span New Group
v-card.wiki-form
......@@ -32,7 +32,7 @@
v-spacer
v-btn(flat, @click='newGroupDialog = false') Cancel
v-btn(color='primary', @click='createGroup') Create
v-card.mt-3
v-card.mt-3.animated.fadeInUp
v-data-table(
:items='groups'
:headers='headers'
......@@ -63,7 +63,6 @@ import _ from 'lodash'
import groupsQuery from 'gql/admin/groups/groups-query-list.gql'
import createGroupMutation from 'gql/admin/groups/groups-mutation-create.gql'
import deleteGroupMutation from 'gql/admin/groups/groups-mutation-delete.gql'
export default {
data() {
......
client/components/admin/admin-locale.vue
View file @ 6ea3ff11
......@@ -3,18 +3,18 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-globe-earth.svg', alt='Locale', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-globe-earth.svg', alt='Locale', style='width: 80px;')
.admin-header-title
.headline.primary--text {{ $t('admin:locale.title') }}
.subheading.grey--text {{ $t('admin:locale.subtitle') }}
.headline.primary--text.animated.fadeInLeft {{ $t('admin:locale.title') }}
.subheading.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:locale.subtitle') }}
v-spacer
v-btn(color='success', depressed, @click='save', large, :loading='loading')
v-btn.animated.fadeInDown(color='success', depressed, @click='save', large, :loading='loading')
v-icon(left) check
span {{$t('common:actions.apply')}}
v-form.pt-3
v-layout(row wrap)
v-flex(lg6 xs12)
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading {{ $t('admin:locale.settings') }}
......@@ -48,7 +48,7 @@
:hint='namespacing ? $t("admin:locale.autoUpdate.hintWithNS") : $t("admin:locale.autoUpdate.hint")'
)
v-card.wiki-form.mt-3
v-card.wiki-form.mt-3.animated.fadeInUp.wait-p2s
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading {{ $t('admin:locale.namespacing') }}
......@@ -99,7 +99,7 @@
v-list-tile-action
v-checkbox(:input-value='data.tile.props.value', color='primary', value)
v-flex(lg6 xs12)
v-card
v-card.animated.fadeInUp.wait-p4s
v-toolbar(color='teal', dark, dense, flat)
v-toolbar-title
.subheading {{ $t('admin:locale.download') }}
......
client/components/admin/admin-mail.vue
View file @ 6ea3ff11
<template lang='pug'>
v-container(fluid, grid-list-lg)
v-layout(row wrap)
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-new-post.svg', alt='Mail', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-new-post.svg', alt='Mail', style='width: 80px;')
.admin-header-title
.headline.primary--text {{ $t('admin:mail.title') }}
.subheading.grey--text {{ $t('admin:mail.subtitle') }}
.headline.primary--text.animated.fadeInLeft {{ $t('admin:mail.title') }}
.subheading.grey--text.animated.fadeInLeft.wait-p4s {{ $t('admin:mail.subtitle') }}
v-spacer
v-btn(color='success', depressed, @click='save', large)
v-btn.animated.fadeInDown(color='success', depressed, @click='save', large)
v-icon(left) check
span {{$t('common:actions.apply')}}
v-form.pt-3
v-layout(row wrap)
v-flex(lg6 xs12)
v-form
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading {{ $t('admin:mail.configuration') }}
......@@ -84,7 +84,7 @@
)
v-flex(lg6 xs12)
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp.wait-p2s
v-form
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
......
client/components/admin/admin-navigation.vue
View file @ 6ea3ff11
......@@ -3,20 +3,20 @@
v-layout(row wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-triangle-arrow.svg', alt='Navigation', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-triangle-arrow.svg', alt='Navigation', style='width: 80px;')
.admin-header-title
.headline.primary--text {{$t('navigation.title')}}
.subheading.grey--text {{$t('navigation.subtitle')}}
.headline.primary--text.animated.fadeInLeft {{$t('navigation.title')}}
.subheading.grey--text.animated.fadeInLeft.wait-p4s {{$t('navigation.subtitle')}}
v-spacer
v-btn(outline, color='grey', @click='refresh', large)
v-btn.animated.fadeInDown.wait-p2s(outline, color='grey', @click='refresh', large)
v-icon refresh
v-btn(color='success', depressed, @click='save', large)
v-btn.animated.fadeInDown(color='success', depressed, @click='save', large)
v-icon(left) check
span {{$t('common:actions.apply')}}
v-container.pa-0.mt-3(fluid, grid-list-lg)
v-layout(row)
v-flex(style='flex: 0 0 350px;')
v-card
v-card.animated.fadeInUp
v-list.py-2(dense, dark, :class='navTree.length < 1 ? "grey lighten-4" : "primary"')
v-list-tile(v-if='navTree.length < 1')
v-list-tile-avatar: v-icon(color='grey') explore_off
......@@ -60,7 +60,7 @@
v-list-tile(@click='addItem("divider")')
v-list-tile-avatar: v-icon power_input
v-list-tile-title {{$t('navigation.divider')}}
v-flex
v-flex.animated.fadeInUp.wait-p2s
v-card.wiki-form(v-if='current.kind === "link"')
v-toolbar(dense, color='blue', flat, dark)
.subheading {{$t('navigation.edit', { kind: $t('navigation.link') })}}
......
client/components/admin/admin-rendering.vue
View file @ 6ea3ff11
......@@ -3,18 +3,18 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-process.svg', alt='Rendering', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-process.svg', alt='Rendering', style='width: 80px;')
.admin-header-title
.headline.primary--text Rendering
.subheading.grey--text Configure how content is rendered
.headline.primary--text.animated.fadeInLeft Rendering
.subheading.grey--text.animated.fadeInLeft.wait-p4s Configure how content is rendered
v-spacer
v-btn(outline, color='grey', @click='refresh', large)
v-btn.animated.fadeInDown.wait-p2s(outline, color='grey', @click='refresh', large)
v-icon refresh
v-btn(color='success', @click='save', depressed, large)
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) check
span {{$t('common:actions.apply')}}
v-flex(lg3, xs12)
v-flex.animated.fadeInUp(lg3, xs12)
v-toolbar(
color='primary'
dense
......@@ -60,7 +60,7 @@
v-divider.my-0(v-if='n < core.children.length - 1')
v-flex(lg9, xs12)
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp
v-toolbar(
color='grey darken-1'
dark
......@@ -138,7 +138,7 @@ export default {
}
},
computed: {
darkMode: get('site/dark'),
darkMode: get('site/dark')
},
watch: {
renderers(newValue, oldValue) {
......
client/components/admin/admin-storage.vue
View file @ 6ea3ff11
......@@ -3,18 +3,18 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-cloud-storage.svg', alt='Storage', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-cloud-storage.svg', alt='Storage', style='width: 80px;')
.admin-header-title
.headline.primary--text Storage
.subheading.grey--text Set backup and sync targets for your content
.headline.primary--text.animated.fadeInLeft Storage
.subheading.grey--text.animated.fadeInLeft.wait-p4s Set backup and sync targets for your content
v-spacer
v-btn(outline, color='grey', @click='refresh', large)
v-btn.animated.fadeInDown.wait-p2s(outline, color='grey', @click='refresh', large)
v-icon refresh
v-btn(color='success', @click='save', depressed, large)
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) check
span {{$t('common:actions.apply')}}
v-card.mt-3
v-card.mt-3.animated.fadeInUp
v-tabs(color='grey darken-2', fixed-tabs, slider-color='white', show-arrows, dark, v-model='currentTab')
v-tab(key='settings'): v-icon settings
v-tab(v-for='tgt in activeTargets', :key='tgt.key') {{ tgt.title }}
......
client/components/admin/admin-users.vue
View file @ 6ea3ff11
......@@ -3,17 +3,17 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-customer.svg', alt='Users', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-customer.svg', alt='Users', style='width: 80px;')
.admin-header-title
.headline.blue--text.text--darken-2 Users
.subheading.grey--text Manage users
.headline.blue--text.text--darken-2.animated.fadeInLeft Users
.subheading.grey--text.animated.fadeInLeft.wait-p4s Manage users
v-spacer
v-btn(outline, color='grey', large, @click='refresh')
v-btn.animated.fadeInDown.wait-p2s(outline, color='grey', large, @click='refresh')
v-icon refresh
v-btn(color='primary', large, depressed, @click='createUser')
v-btn.animated.fadeInDown(color='primary', large, depressed, @click='createUser')
v-icon(left) add
span New User
v-card.mt-3
v-card.mt-3.animated.fadeInUp
v-data-table(
v-model='selected'
:items='users',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment