@ -23,32 +23,71 @@
status - indicator . mr - 3. ml - 4 ( active , pulse )
. caption . blue -- text { { $t ( 'common:page.global' ) } }
v - spacer
v - btn . mx- 1. animated . fadeInRight . wait - p4s ( color = 'grey' , large , outlined , to = '/pages' )
v - btn . animated. fadeInDown . wait - p3s ( color = 'grey' , icon , outlined , to = '/pages' )
v - icon mdi - arrow - left
v - divider . mx - 1. animated . fadeInRight . wait - p3s . mx - 1 ( vertical )
v - dialog ( v - model = 'deletePageDialog' , max - width = '500' )
v - menu ( offset - y , origin = 'top right' )
template ( v - slot : activator = '{ on }' )
v - btn . mx - 1. animated . fadeInDown . wait - p1s ( color = 'red' , large , outlined , v - on = 'on' )
v - icon ( color = 'red' ) mdi - trash - can - outline
v - card
. dialog - header . is - short . is - red
v - icon . mr - 2 ( color = 'white' ) mdi - file - document - box - remove - outline
span { { $t ( 'common:page.delete' ) } }
v - card - text . pt - 5
i18next . body - 2 ( path = 'common:page.deleteTitle' , tag = 'div' )
span . red -- text . text -- darken - 2 ( place = 'title' ) { { page . title } }
. caption { { $t ( 'common:page.deleteSubtitle' ) } }
v - chip . mt - 3. ml - 0. mr - 1 ( label , color = 'red lighten-4' , disabled , small )
. caption . red -- text . text -- darken - 2 { { page . locale . toUpperCase ( ) } }
v - chip . mt - 3. mx - 0 ( label , color = 'red lighten-5' , disabled , small )
span . red -- text . text -- darken - 2 / { { page . path } }
v - card - chin
v - spacer
v - btn ( text , @ click = 'deletePageDialog = false' , : disabled = 'loading' ) { { $t ( 'common:actions.cancel' ) } }
v - btn ( color = 'red darken-2' , @ click = 'deletePage' , : loading = 'loading' ) . white -- text { { $t ( 'common:actions.delete' ) } }
v - btn . ml - 1. animated . fadeInDown ( color = 'teal' , large , outlined , @ click = 'rerenderPage' )
v - icon ( left ) mdi - cube - scan
span Re - render
v - btn . mx - 3. animated . fadeInDown . wait - p2s ( color = 'black' , v - on = 'on' , depressed , dark )
span Actions
v - icon ( right ) mdi - chevron - down
v - list ( dense , nav )
v - list - item ( : href = '`/` + page.locale + `/` + page.path' )
v - list - item - icon
v - icon ( color = 'indigo' ) mdi - text - subject
v - list - item - title View
v - list - item ( : href = '`/e/` + page.locale + `/` + page.path' )
v - list - item - icon
v - icon ( color = 'indigo' ) mdi - pencil
v - list - item - title Edit
v - list - item ( @ click = '' , disabled )
v - list - item - icon
v - icon ( color = 'grey' ) mdi - cube - scan
v - list - item - title Re - Render
v - list - item ( @ click = '' , disabled )
v - list - item - icon
v - icon ( color = 'grey' ) mdi - earth - remove
v - list - item - title Unpublish
v - list - item ( : href = '`/s/` + page.locale + `/` + page.path' )
v - list - item - icon
v - icon ( color = 'indigo' ) mdi - code - tags
v - list - item - title View Source
v - list - item ( : href = '`/h/` + page.locale + `/` + page.path' )
v - list - item - icon
v - icon ( color = 'indigo' ) mdi - history
v - list - item - title View History
v - list - item ( @ click = '' , disabled )
v - list - item - icon
v - icon ( color = 'grey' ) mdi - content - duplicate
v - list - item - title Duplicate
v - list - item ( @ click = '' , disabled )
v - list - item - icon
v - icon ( color = 'grey' ) mdi - content - save - move - outline
v - list - item - title Move / Rename
v - dialog ( v - model = 'deletePageDialog' , max - width = '500' )
template ( v - slot : activator = '{ on }' )
v - list - item ( v - on = 'on' )
v - list - item - icon
v - icon ( color = 'red' ) mdi - trash - can - outline
v - list - item - title Delete
v - card
. dialog - header . is - short . is - red
v - icon . mr - 2 ( color = 'white' ) mdi - file - document - box - remove - outline
span { { $t ( 'common:page.delete' ) } }
v - card - text . pt - 5
i18next . body - 2 ( path = 'common:page.deleteTitle' , tag = 'div' )
span . red -- text . text -- darken - 2 ( place = 'title' ) { { page . title } }
. caption { { $t ( 'common:page.deleteSubtitle' ) } }
v - chip . mt - 3. ml - 0. mr - 1 ( label , color = 'red lighten-4' , disabled , small )
. caption . red -- text . text -- darken - 2 { { page . locale . toUpperCase ( ) } }
v - chip . mt - 3. mx - 0 ( label , color = 'red lighten-5' , disabled , small )
span . red -- text . text -- darken - 2 / { { page . path } }
v - card - chin
v - spacer
v - btn ( text , @ click = 'deletePageDialog = false' , : disabled = 'loading' ) { { $t ( 'common:actions.cancel' ) } }
v - btn ( color = 'red darken-2' , @ click = 'deletePage' , : loading = 'loading' ) . white -- text { { $t ( 'common:actions.delete' ) } }
v - btn . animated . fadeInDown ( color = 'success' , large , depressed , disabled )
v - icon ( left ) mdi - check
span Save Changes
v - flex ( xs12 , lg6 )
v - card . animated . fadeInUp
v - toolbar ( color = 'primary' , dense , dark , flat )
@ -69,17 +108,11 @@
v - list - item - content
v - list - item - title : . overline . grey -- text Locale
v - list - item - subtitle . body - 2 ( : class = '$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`' ) { { page . locale } }
v - list - item - action
v - btn ( icon , x - small )
v - icon ( color = 'grey' ) mdi - pencil
v - divider
v - list - item
v - list - item - content
v - list - item - title : . overline . grey -- text Path
v - list - item - subtitle . body - 2 ( : class = '$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`' ) { { page . path } }
v - list - item - action
v - btn ( icon , x - small )
v - icon ( color = 'grey' ) mdi - pencil
v - divider
v - list - item
v - list - item - content
@ -90,27 +123,11 @@
v - list - item - content
v - list - item - title : . overline . grey -- text Content Type
v - list - item - subtitle . body - 2 ( : class = '$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`' ) { { page . contentType || '?' } }
v - toolbar . elevation - 2. mt - 3. animated . fadeInUp . wait - p4s ( : color = '$vuetify.theme.dark ? `grey darken-3-d5` : `white`' , dense )
v - spacer
v - btn ( color = 'primary' , text , : href = '`/` + page.locale + `/` + page.path' )
v - icon ( left ) mdi - text - subject
span View
v - divider . mx - 2 ( vertical )
v - btn ( color = 'primary' , text , : href = '`/e/` + page.locale + `/` + page.path' )
v - icon ( left ) mdi - pencil
span Edit
v - divider . mx - 2 ( vertical )
v - btn ( color = 'primary' , text , : href = '`/s/` + page.locale + `/` + page.path' )
v - icon ( left ) mdi - code - tags
span Source
v - divider . mx - 2 ( vertical )
v - btn ( color = 'primary' , text , : href = '`/h/` + page.locale + `/` + page.path' )
v - icon ( left ) mdi - history
span History
v - spacer
. caption . mt - 4. grey -- text . animated . fadeInUp . wait - p6s Page Hash : { { page . hash } }
v - divider
v - list - item
v - list - item - content
v - list - item - title : . overline . grey -- text Page Hash
v - list - item - subtitle . body - 2 ( : class = '$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`' ) { { page . hash } }
v - flex ( xs12 , lg6 )
v - card . animated . fadeInUp . wait - p2s
@ -137,25 +154,6 @@
v - list - item - subtitle . body - 2 ( : class = '$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-3`' ) { { page . authorName } } # [ em . caption ( { { page . authorEmail } } ) ]
v - list - item - action
v - list - item - action - text { { page . updatedAt | moment ( 'calendar' ) } }
v - card . mt - 3. animated . fadeInUp . wait - p4s
v - toolbar ( color = 'primary' , dense , dark , flat )
v - icon . mr - 2 mdi - history
span Recent History
v - spacer
v - chip ( label , color = 'white' , small ) . primary -- text coming soon
v - timeline . mx - 3 ( dense , clipped )
v - timeline - item ( color = 'teal' , small , v - if = 'page.createdAt !== page.updatedAt' )
v - layout ( justify - space - between )
v - flex ( xs7 ) . body - 2 Page Modified by # [ strong { { page . authorName } } ] # [ em . caption ( { { page . authorEmail } } ) ]
v - flex . text - right ( xs5 ) . caption . grey -- text . text - darken - 2 { { page . updatedAt | moment ( 'calendar' ) } }
v - timeline - item ( hide - dot , small )
. body - 2 ...
v - btn . mx - 0. mt - 1 ( outlined , color = 'grey' , : href = '`/h/` + page.locale + `/` + page.path' ) View Full History
. body - 2 ...
v - timeline - item ( color = 'pink' , small )
v - layout ( justify - space - between )
v - flex ( xs7 ) . body - 2 Page created by # [ strong { { page . creatorName } } ] # [ em . caption ( { { page . creatorEmail } } ) ]
v - flex . text - right ( xs5 ) . caption . grey -- text . text - darken - 2 { { page . createdAt | moment ( 'calendar' ) } }
v - layout ( row , align - center , v - else )
v - progress - circular ( indeterminate , width = '2' , color = 'grey' )