Commit 85717bd3 authored by NGPixel's avatar NGPixel

feat: navigator sd footer + setup icons fixes

parent a155af20
...@@ -26,33 +26,46 @@ ...@@ -26,33 +26,46 @@
svg.icons.is-24(role='img') svg.icons.is-24(role='img')
title Search title Search
use(xlink:href='#gg-search') use(xlink:href='#gg-search')
a(href='') a(href='', title='New Document')
svg.icons.is-24(role='img', title='New Document') svg.icons.is-24(role='img')
title New Document title New Document
use(xlink:href='#nc-plus-circle') use(xlink:href='#nc-plus-circle')
a(href='') a(href='', title='Edit Document')
svg.icons.is-24(role='img', title='Edit Document') svg.icons.is-24(role='img')
title Edit Document title Edit Document
use(xlink:href='#nc-pen-red') use(xlink:href='#nc-pen-red')
a(href='') a(href='', title='History')
svg.icons.is-24(role='img', title='History') svg.icons.is-24(role='img')
title History title History
use(xlink:href='#nc-restore') use(xlink:href='#nc-restore')
a(href='') a(href='', title='View Source')
svg.icons.is-24(role='img', title='View Source') svg.icons.is-24(role='img')
title View Source title View Source
use(xlink:href='#nc-code-editor') use(xlink:href='#nc-code-editor')
a(href='') a(href='', title='Move Document')
svg.icons.is-24(role='img', title='Move Document') svg.icons.is-24(role='img')
title Move Document title Move Document
use(xlink:href='#nc-move') use(xlink:href='#nc-move')
a(href='') a(href='', title='Delete Document')
svg.icons.is-24(role='img', title='Delete Document') svg.icons.is-24(role='img')
title Delete Document title Delete Document
use(xlink:href='#nc-trash') use(xlink:href='#nc-trash')
.navigator-sd-search .navigator-sd-search
input(type='text', placeholder='Search') input(type='text', ref='iptSearch', placeholder='Search')
.navigator-sd-results .navigator-sd-results
.navigator-sd-footer
a(href='', title='Settings')
svg.icons.is-24(role='img')
title Settings
use(xlink:href='#nc-gear')
a(href='', title='Users')
svg.icons.is-24(role='img')
title Users
use(xlink:href='#nc-users')
a(href='', title='Assets')
svg.icons.is-24(role='img')
title Assets
use(xlink:href='#nc-image')
</template> </template>
<script> <script>
...@@ -91,6 +104,11 @@ export default { ...@@ -91,6 +104,11 @@ export default {
methods: { methods: {
toggleMainMenu() { toggleMainMenu() {
this.sdShown = !this.sdShown this.sdShown = !this.sdShown
if (this.sdShown) {
this.$nextTick(() => {
this.$refs.iptSearch.focus()
})
}
// this.$store.dispatch('navigator/alert', { // this.$store.dispatch('navigator/alert', {
// style: 'success', // style: 'success',
// icon: 'gg-check', // icon: 'gg-check',
......
...@@ -150,7 +150,6 @@ ...@@ -150,7 +150,6 @@
width: 350px; width: 350px;
background-color: #FFF; background-color: #FFF;
border-radius: 0 0 5px 0; border-radius: 0 0 5px 0;
padding: 0 0 1rem 0;
transition: all .4s ease; transition: all .4s ease;
transform-origin: top left; transform-origin: top left;
...@@ -180,14 +179,6 @@ ...@@ -180,14 +179,6 @@
&:hover { &:hover {
background-color: #FFF; background-color: #FFF;
} }
svg {
use {
color: mc('blue-grey', '500');
fill: mc('blue-grey', '500');
transition: all .4s ease;
}
}
} }
} }
...@@ -197,11 +188,12 @@ ...@@ -197,11 +188,12 @@
input { input {
display: block; display: block;
width: 100%; width: 100%;
padding: 0 1rem 0 1rem; padding: 0 3rem 0 1rem;
height: 40px; height: 40px;
border: 0; border: 0;
font-size: .9rem; font-size: .9rem;
color: mc('grey', '700'); color: mc('grey', '700');
position: relative;
&:focus { &:focus {
outline: none; outline: none;
...@@ -209,17 +201,33 @@ ...@@ -209,17 +201,33 @@
} }
} }
svg { &::after {
content: " ";
@include spinner(mc('blue', '200'),0.5s,18px);
position: absolute; position: absolute;
width: 20px; display: block;
height: 20px; top: 11px;
top: 9px; right: 1rem;
left: 15px; }
}
use { &-footer {
color: mc('grey', '500'); background-color: mc('blue-grey', '100');
fill: mc('grey', '500'); border-top: 5px solid mc('blue-grey', '200');
border-radius: 0 0 5px 0;
display: flex;
justify-content: center;
a {
display: flex;
align-items: center;
justify-content: center;
height: 50px;
width: 50px;
transition: all .4s ease; transition: all .4s ease;
&:hover {
background-color: mc('blue-grey', '200');
} }
} }
} }
......
...@@ -54,7 +54,7 @@ block body ...@@ -54,7 +54,7 @@ block body
.is-logo .is-logo
svg.icons.is-64: use(xlink:href='#nc-metrics') svg.icons.is-64: use(xlink:href='#nc-metrics')
h4 System Check h4 System Check
p(v-if='loading') #[svg.icons.is-24.is-text: use(xlink:href='#nc-ms-dots')] Checking your system for compatibility... p(v-if='loading') #[svg.icons.is-24.is-text: use(xlink:href='#wk-msdots')] Checking your system for compatibility...
p(v-if='!loading && syscheck.ok') p(v-if='!loading && syscheck.ok')
ul ul
li(v-for='rs in syscheck.results') #[svg.icons.is-18.is-text: use(xlink:href='#nc-check-bold')] {{rs}} li(v-for='rs in syscheck.results') #[svg.icons.is-18.is-text: use(xlink:href='#nc-check-bold')] {{rs}}
...@@ -81,7 +81,7 @@ block body ...@@ -81,7 +81,7 @@ block body
.panel-content.form-sections .panel-content.form-sections
section section
.is-logo .is-logo
svg.icons.is-64: use(xlink:href='#nc-webpage-2-2') svg.icons.is-64: use(xlink:href='#nc-webpage')
h4 General Information h4 General Information
p.control.is-fullwidth p.control.is-fullwidth
label.label Site Title label.label Site Title
...@@ -249,14 +249,14 @@ block body ...@@ -249,14 +249,14 @@ block body
.is-logo .is-logo
img(src='svg/logo-git.svg', alt='Git Logo') img(src='svg/logo-git.svg', alt='Git Logo')
h4 Git Repository Check h4 Git Repository Check
p(v-if='loading') #[svg.icons.is-24.is-text: use(xlink:href='#nc-ms-dots')] Verifying Git repository settings... p(v-if='loading') #[svg.icons.is-24.is-text: use(xlink:href='#wk-msdots')] Verifying Git repository settings...
p(v-if='!loading && gitcheck.ok') p(v-if='!loading && gitcheck.ok')
ul ul
li(v-for='rs in gitcheck.results') #[svg.icons.is-18.is-text: use(xlink:href='#nc-check-bold')] {{rs}} li(v-for='rs in gitcheck.results') #[svg.icons.is-18.is-text: use(xlink:href='#nc-check-bold')] {{rs}}
p(v-if='!loading && gitcheck.ok') p(v-if='!loading && gitcheck.ok')
svg.icons.is-18.is-text: use(xlink:href='#nc-check-bold') svg.icons.is-18.is-text: use(xlink:href='#nc-check-bold')
strong Git settings are correct! strong Git settings are correct!
p(v-if='!loading && !gitcheck.ok') #[svg.icons.is-18.is-text: use(xlink:href='#nc-square-remove-12')] Error: {{ gitcheck.error }} p(v-if='!loading && !gitcheck.ok') #[svg.icons.is-18.is-text: use(xlink:href='#nc-square-remove')] Error: {{ gitcheck.error }}
.panel-footer .panel-footer
.progress-bar: div(v-bind:style='{width: currentProgress}') .progress-bar: div(v-bind:style='{width: currentProgress}')
button.button.is-small.is-light-blue.is-outlined(v-on:click='proceedToGit', v-bind:disabled='loading') Back button.button.is-small.is-light-blue.is-outlined(v-on:click='proceedToGit', v-bind:disabled='loading') Back
...@@ -274,7 +274,7 @@ block body ...@@ -274,7 +274,7 @@ block body
i(v-if='loading') i(v-if='loading')
.panel-content.is-text .panel-content.is-text
.is-logo .is-logo
svg.icons.is-64: use(xlink:href='#nc-man-38') svg.icons.is-64: use(xlink:href='#nc-man')
h4 Administrator Account h4 Administrator Account
p A root administrator account will be created for local authentication. From this account, you can create or authorize more users. p A root administrator account will be created for local authentication. From this account, you can create or authorize more users.
.panel-content.form-sections .panel-content.form-sections
...@@ -335,7 +335,7 @@ block body ...@@ -335,7 +335,7 @@ block body
i(v-if='loading') i(v-if='loading')
.panel-content.is-text .panel-content.is-text
.is-logo(v-if='loading') .is-logo(v-if='loading')
svg.icons.is-64: use(xlink:href='#nc-ms-dots') svg.icons.is-64: use(xlink:href='#wk-msdots')
h4 Finalizing your installation... h4 Finalizing your installation...
.is-logo(v-if='!loading && final.ok') .is-logo(v-if='!loading && final.ok')
svg.icons.is-64: use(xlink:href='#nc-check-bold') svg.icons.is-64: use(xlink:href='#nc-check-bold')
...@@ -343,7 +343,7 @@ block body ...@@ -343,7 +343,7 @@ block body
p(v-if='!loading && final.ok'): strong Wiki.js was configured successfully and is now ready for use. p(v-if='!loading && final.ok'): strong Wiki.js was configured successfully and is now ready for use.
p(v-if='!loading && final.ok') p(v-if='!loading && final.ok')
| Click the <strong>Start</strong> button below to launch your newly configured wiki. | Click the <strong>Start</strong> button below to launch your newly configured wiki.
p(v-if='!loading && !final.ok') #[svg.icons.is-18.is-text: use(xlink:href='#nc-square-remove-12')] Error: {{ final.error }} p(v-if='!loading && !final.ok') #[svg.icons.is-18.is-text: use(xlink:href='#nc-square-remove')] Error: {{ final.error }}
.panel-footer .panel-footer
.progress-bar: div(v-bind:style='{width: currentProgress}') .progress-bar: div(v-bind:style='{width: currentProgress}')
button.button.is-small.is-light-blue.is-outlined(v-on:click='proceedToAdmin', v-bind:disabled='loading') Back button.button.is-small.is-light-blue.is-outlined(v-on:click='proceedToAdmin', v-bind:disabled='loading') Back
......
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