Add Help-Menu

This commit is contained in:
Jan Oberhauser 2019-09-22 21:59:45 +02:00
parent 37bf2f02b7
commit 8328d7ad9a
2 changed files with 56 additions and 10 deletions

View file

@ -26,7 +26,7 @@
</a> </a>
</el-menu-item> </el-menu-item>
<el-submenu index="workflow"> <el-submenu index="workflow" title="Workflow">
<template slot="title"> <template slot="title">
<font-awesome-icon icon="network-wired"/>&nbsp; <font-awesome-icon icon="network-wired"/>&nbsp;
<span slot="title" class="item-title-root">Workflows</span> <span slot="title" class="item-title-root">Workflows</span>
@ -88,7 +88,7 @@
</el-menu-item> </el-menu-item>
</el-submenu> </el-submenu>
<el-submenu index="credentials"> <el-submenu index="credentials" title="Credentials">
<template slot="title"> <template slot="title">
<font-awesome-icon icon="key"/>&nbsp; <font-awesome-icon icon="key"/>&nbsp;
<span slot="title" class="item-title-root">Credentials</span> <span slot="title" class="item-title-root">Credentials</span>
@ -113,6 +113,38 @@
<span slot="title" class="item-title-root">Executions</span> <span slot="title" class="item-title-root">Executions</span>
</el-menu-item> </el-menu-item>
<el-submenu index="help" class="help-menu" title="Help">
<template slot="title">
<font-awesome-icon icon="question"/>&nbsp;
<span slot="title" class="item-title-root">Help</span>
</template>
<el-menu-item index="help-documentation">
<template slot="title">
<a href="https://docs.n8n.io" target="_blank">
<font-awesome-icon icon="book"/>
<span slot="title" class="item-title">Documentation</span>
</a>
</template>
</el-menu-item>
<el-menu-item index="help-forum">
<template slot="title">
<a href="https://community.n8n.io" target="_blank">
<font-awesome-icon icon="users"/>
<span slot="title" class="item-title">Forum</span>
</a>
</template>
</el-menu-item>
<el-menu-item index="help-examples">
<template slot="title">
<a href="https://n8n.io/workflows" target="_blank">
<font-awesome-icon icon="network-wired"/>
<span slot="title" class="item-title">Workflows</span>
</a>
</template>
</el-menu-item>
</el-submenu>
</el-menu> </el-menu>
</div> </div>
@ -418,7 +450,12 @@ export default mixins(
transform: scale(1.1); transform: scale(1.1);
} }
.el-menu-item.logo-item { .el-menu-item {
a {
color: #666;
}
&.logo-item {
background-color: $--color-primary !important; background-color: $--color-primary !important;
height: 65px; height: 65px;
@ -428,8 +465,11 @@ export default mixins(
left: -10px; left: -10px;
top: -2px; top: -2px;
} }
}
} }
a.logo-text { a.logo-text {
position: relative; position: relative;
top: -3px; top: -3px;

View file

@ -23,6 +23,7 @@ import {
faAngleUp, faAngleUp,
faArrowRight, faArrowRight,
faAt, faAt,
faBook,
faBug, faBug,
faCalendar, faCalendar,
faCheck, faCheck,
@ -59,6 +60,7 @@ import {
faPlay, faPlay,
faPlayCircle, faPlayCircle,
faPlus, faPlus,
faQuestion,
faQuestionCircle, faQuestionCircle,
faRedo, faRedo,
faRss, faRss,
@ -78,6 +80,7 @@ import {
faTimes, faTimes,
faTrash, faTrash,
faUndo, faUndo,
faUsers,
} from '@fortawesome/free-solid-svg-icons'; } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
@ -90,6 +93,7 @@ library.add(faAngleRight);
library.add(faAngleUp); library.add(faAngleUp);
library.add(faArrowRight); library.add(faArrowRight);
library.add(faAt); library.add(faAt);
library.add(faBook);
library.add(faBug); library.add(faBug);
library.add(faCalendar); library.add(faCalendar);
library.add(faCheck); library.add(faCheck);
@ -126,6 +130,7 @@ library.add(faPen);
library.add(faPlay); library.add(faPlay);
library.add(faPlayCircle); library.add(faPlayCircle);
library.add(faPlus); library.add(faPlus);
library.add(faQuestion);
library.add(faQuestionCircle); library.add(faQuestionCircle);
library.add(faRedo); library.add(faRedo);
library.add(faRss); library.add(faRss);
@ -145,6 +150,7 @@ library.add(faThLarge);
library.add(faTimes); library.add(faTimes);
library.add(faTrash); library.add(faTrash);
library.add(faUndo); library.add(faUndo);
library.add(faUsers);
Vue.component('font-awesome-icon', FontAwesomeIcon); Vue.component('font-awesome-icon', FontAwesomeIcon);