Formatted Account pages + fixed search UI

This commit is contained in:
NGPixel 2016-11-22 22:06:59 -05:00
parent 75ab068672
commit 2227515b26
18 changed files with 219 additions and 172 deletions

View File

@ -6,9 +6,12 @@
global.PROCNAME = 'AGENT'; global.PROCNAME = 'AGENT';
global.ROOTPATH = __dirname; global.ROOTPATH = __dirname;
global.CORE_PATH = ROOTPATH + './node_modules/requarks-core/';
//global.CORE_PATH = ROOTPATH + '/../core/';
global.IS_DEBUG = process.env.NODE_ENV === 'development'; global.IS_DEBUG = process.env.NODE_ENV === 'development';
if(IS_DEBUG) {
global.CORE_PATH = ROOTPATH + '/../core/';
} else {
global.CORE_PATH = ROOTPATH + './node_modules/requarks-core/';
}
// ---------------------------------------- // ----------------------------------------
// Load Winston // Load Winston

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,3 +1,6 @@
$primary: 'indigo';
@import 'core-client/scss/core'; @import 'core-client/scss/core';
@import 'core-client/scss/components/alert'; @import 'core-client/scss/components/alert';
@import 'core-client/scss/components/button'; @import 'core-client/scss/components/button';
@ -8,13 +11,15 @@
@import 'core-client/scss/components/markdown-content'; @import 'core-client/scss/components/markdown-content';
@import 'core-client/scss/components/modal'; @import 'core-client/scss/components/modal';
@import 'core-client/scss/components/nav'; @import 'core-client/scss/components/nav';
@import 'core-client/scss/components/panel';
@import 'core-client/scss/components/search';
@import 'core-client/scss/components/sidebar'; @import 'core-client/scss/components/sidebar';
@import 'core-client/scss/components/typography'; @import 'core-client/scss/components/typography';
@import './libs/twemoji-awesome'; @import './libs/twemoji-awesome';
@import './libs/jquery-contextmenu'; @import './libs/jquery-contextmenu';
//@import './components/_editor'; @import './components/_editor';
@import './layout/_header'; @import './layout/_header';
//@import './layout/_content'; //@import './layout/_content';

View File

@ -1,13 +1,13 @@
.editor-toolbar { .editor-toolbar {
z-index: 2; z-index: 2;
background-color: rgba(0,0,0,0.65); background-color: rgba(0,0,0,0.75);
border: none; border: none;
border-top-left-radius: 0; border-top-left-radius: 0;
border-top-right-radius: 0; border-top-right-radius: 0;
opacity: 1; opacity: 1;
position: fixed; position: fixed;
top: 52px; top: 51px;
left: 0; left: 0;
width: 100%; width: 100%;
@ -44,7 +44,7 @@
span { span {
font-size: 12px; font-size: 12px;
color: $blue; color: mc('blue', '500');
} }
i { i {
@ -57,7 +57,7 @@
&::before { &::before {
content: " "; content: " ";
@include spinner($blue,0.5s,24px); @include spinner(mc('blue', '500'),0.5s,24px);
} }
} }
@ -143,11 +143,11 @@
} }
&.is-active { &.is-active {
background-color: $primary; background-color: mc($primary, '500');
color: #FFF; color: #FFF;
> img { > img {
border-color: darken($primary, 10%); border-color: darken(mc($primary, '500'), 10%);
} }
> span > strong { > span > strong {
@ -157,11 +157,11 @@
} }
&.is-contextopen { &.is-contextopen {
background-color: $warning; background-color: mc('orange', '500');
color: #FFF; color: #FFF;
> img { > img {
border-color: darken($warning, 10%); border-color: darken(mc('orange', '500'), 10%);
} }
> span > strong { > span > strong {
@ -205,7 +205,7 @@
border-left: none; border-left: none;
border-right: none; border-right: none;
padding-top: 52px; padding-top: 52px;
font-family: $family-monospace; font-family: $core-font-monospace;
} }
.CodeMirror .CodeMirror-code .cm-url { .CodeMirror .CodeMirror-code .cm-url {
@ -256,7 +256,7 @@
top: 100px; top: 100px;
width: 100%; width: 100%;
background-color: rgba(255,255,255,0.95); background-color: rgba(255,255,255,0.95);
border-bottom: 1px solid $grey-light; border-bottom: 1px solid mc('grey', '500');
z-index: 6; z-index: 6;
padding: 20px; padding: 20px;
border-bottom: 1px solid #CCC; border-bottom: 1px solid #CCC;
@ -264,7 +264,7 @@
display: none; display: none;
> h3, .column > h3 { > h3, .column > h3 {
color: $grey-dark; color: mc('grey', '700');
font-size: 24px; font-size: 24px;
font-weight: 300; font-weight: 300;
} }

View File

@ -33,19 +33,4 @@
#search-input { #search-input {
max-width: 300px; max-width: 300px;
width: 33vw; width: 33vw;
}
.searchresults {
position: fixed;
top: 45px;
left: 0;
right: 0;
margin: 0 auto;
width: 500px;
z-index: 1;
&.slideInDown {
@include prefix(animation-duration, .6s);
}
} }

View File

@ -12,6 +12,8 @@ var gzip = require('gulp-gzip');
var sass = require('gulp-sass'); var sass = require('gulp-sass');
var cleanCSS = require('gulp-clean-css'); var cleanCSS = require('gulp-clean-css');
var include = require("gulp-include"); var include = require("gulp-include");
var run = require('run-sequence');
var _ = require('lodash');
/** /**
* Paths * Paths
@ -57,8 +59,7 @@ var paths = {
'./client/scss/*.scss' './client/scss/*.scss'
], ],
includes: [ includes: [
//'../core', './node_modules/requarks-core' //! MUST BE LAST
'./node_modules/requarks-core'
], ],
watch: [ watch: [
'./client/scss/**/*.scss', './client/scss/**/*.scss',
@ -68,8 +69,7 @@ var paths = {
fonts: [ fonts: [
'./node_modules/font-awesome/fonts/*-webfont.*', './node_modules/font-awesome/fonts/*-webfont.*',
'!./node_modules/font-awesome/fonts/*-webfont.svg', '!./node_modules/font-awesome/fonts/*-webfont.svg',
'../node_modules/requarks-core/core-client/fonts/**/*' '../node_modules/requarks-core/core-client/fonts/**/*' //! MUST BE LAST
//'../core/core-client/fonts/**/*'
], ],
deploy: [ deploy: [
'./**/*', './**/*',
@ -189,6 +189,18 @@ gulp.task('watch', function() {
*/ */
gulp.task('default', ['watch', 'server']); gulp.task('default', ['watch', 'server']);
gulp.task('dev', function() {
paths.css.includes.pop();
paths.css.includes.push('../core');
paths.fonts.pop();
paths.fonts.push('../core/core-client/fonts/**/*');
return run('default');
})
/** /**
* TASK - Creates deployment packages * TASK - Creates deployment packages
*/ */

View File

@ -5,7 +5,7 @@
"main": "server.js", "main": "server.js",
"scripts": { "scripts": {
"start": "node server", "start": "node server",
"dev": "gulp", "dev": "gulp dev",
"test": "snyk test && istanbul cover ./node_modules/mocha/bin/_mocha --report lcovonly -- -R spec ./tests/index.js && cat ./coverage/lcov.info | ./node_modules/.bin/codacy-coverage && rm -rf ./coverage", "test": "snyk test && istanbul cover ./node_modules/mocha/bin/_mocha --report lcovonly -- -R spec ./tests/index.js && cat ./coverage/lcov.info | ./node_modules/.bin/codacy-coverage && rm -rf ./coverage",
"snyk-protect": "snyk protect", "snyk-protect": "snyk protect",
"__prepublish": "npm run snyk-protect" "__prepublish": "npm run snyk-protect"
@ -53,24 +53,24 @@
"filesize.js": "^1.0.2", "filesize.js": "^1.0.2",
"fs-extra": "^0.30.0", "fs-extra": "^0.30.0",
"git-wrapper2-promise": "^0.2.9", "git-wrapper2-promise": "^0.2.9",
"highlight.js": "^9.7.0", "highlight.js": "^9.8.0",
"i18next": "^3.4.3", "i18next": "^3.5.2",
"i18next-express-middleware": "^1.0.2", "i18next-express-middleware": "^1.0.2",
"i18next-node-fs-backend": "^0.1.2", "i18next-node-fs-backend": "^0.1.3",
"js-yaml": "^3.6.1", "js-yaml": "^3.7.0",
"lodash": "^4.16.5", "lodash": "^4.17.2",
"markdown-it": "^8.0.0", "markdown-it": "^8.1.0",
"markdown-it-abbr": "^1.0.4", "markdown-it-abbr": "^1.0.4",
"markdown-it-anchor": "^2.5.0", "markdown-it-anchor": "^2.5.1",
"markdown-it-attrs": "^0.8.0", "markdown-it-attrs": "^0.8.0",
"markdown-it-emoji": "^1.3.0", "markdown-it-emoji": "^1.3.0",
"markdown-it-expand-tabs": "^1.0.11", "markdown-it-expand-tabs": "^1.0.11",
"markdown-it-external-links": "0.0.6", "markdown-it-external-links": "0.0.6",
"markdown-it-footnote": "^3.0.1", "markdown-it-footnote": "^3.0.1",
"markdown-it-task-lists": "^1.4.1", "markdown-it-task-lists": "^1.4.1",
"moment": "^2.15.1", "moment": "^2.17.0",
"moment-timezone": "^0.5.6", "moment-timezone": "^0.5.9",
"mongoose": "^4.6.3", "mongoose": "^4.6.8",
"multer": "^1.2.0", "multer": "^1.2.0",
"passport": "^0.3.2", "passport": "^0.3.2",
"passport-facebook": "^2.1.1", "passport-facebook": "^2.1.1",
@ -82,17 +82,17 @@
"read-chunk": "^2.0.0", "read-chunk": "^2.0.0",
"remove-markdown": "^0.1.0", "remove-markdown": "^0.1.0",
"requarks-core": "github:requarks/core", "requarks-core": "github:requarks/core",
"request": "^2.75.0", "request": "^2.79.0",
"search-index": "^0.9.6", "search-index": "^0.9.6",
"serve-favicon": "^2.3.0", "serve-favicon": "^2.3.2",
"sharp": "^0.16.1", "sharp": "^0.16.1",
"simplemde": "^1.11.2", "simplemde": "^1.11.2",
"snyk": "^1.19.1", "snyk": "^1.19.1",
"socket.io": "^1.5.0", "socket.io": "^1.6.0",
"sticky-js": "^1.0.7", "sticky-js": "^1.0.7",
"validator": "^6.0.0", "validator": "^6.0.0",
"validator-as-promised": "^1.0.2", "validator-as-promised": "^1.0.2",
"winston": "^2.2.0" "winston": "^2.3.0"
}, },
"devDependencies": { "devDependencies": {
"ace-builds": "^1.2.5", "ace-builds": "^1.2.5",
@ -105,7 +105,7 @@
"gulp": "^3.9.1", "gulp": "^3.9.1",
"gulp-babel": "^6.1.2", "gulp-babel": "^6.1.2",
"gulp-clean-css": "^2.0.13", "gulp-clean-css": "^2.0.13",
"gulp-concat": "^2.6.0", "gulp-concat": "^2.6.1",
"gulp-gzip": "^1.4.0", "gulp-gzip": "^1.4.0",
"gulp-include": "^2.3.1", "gulp-include": "^2.3.1",
"gulp-nodemon": "^2.2.1", "gulp-nodemon": "^2.2.1",
@ -124,9 +124,11 @@
"mocha": "^3.1.2", "mocha": "^3.1.2",
"mocha-lcov-reporter": "^1.2.0", "mocha-lcov-reporter": "^1.2.0",
"nodemon": "^1.11.0", "nodemon": "^1.11.0",
"sticky-js": "^1.1.4", "run-sequence": "^1.2.2",
"snyk": "^1.20.0",
"sticky-js": "^1.1.5",
"twemoji-awesome": "^1.0.4", "twemoji-awesome": "^1.0.4",
"vue": "^2.0.3" "vue": "^2.1.0"
}, },
"snyk": true "snyk": true
} }

View File

@ -7,9 +7,12 @@
global.PROCNAME = 'SERVER'; global.PROCNAME = 'SERVER';
global.ROOTPATH = __dirname; global.ROOTPATH = __dirname;
global.CORE_PATH = ROOTPATH + './node_modules/requarks-core/';
//global.CORE_PATH = ROOTPATH + '/../core/';
global.IS_DEBUG = process.env.NODE_ENV === 'development'; global.IS_DEBUG = process.env.NODE_ENV === 'development';
if(IS_DEBUG) {
global.CORE_PATH = ROOTPATH + '/../core/';
} else {
global.CORE_PATH = ROOTPATH + './node_modules/requarks-core/';
}
// ---------------------------------------- // ----------------------------------------
// Load Winston // Load Winston

View File

@ -24,18 +24,15 @@
transition(name="searchresults-anim", enter-active-class="slideInDown", leave-active-class="fadeOutUp") transition(name="searchresults-anim", enter-active-class="slideInDown", leave-active-class="fadeOutUp")
.searchresults.animated(v-show='searchactive', v-cloak, style={'display':'none'}) .searchresults.animated(v-show='searchactive', v-cloak, style={'display':'none'})
.menu p.searchresults-label Search Results
p.menu-label ul.searchresults-list
| Search Results li(v-if="searchres.length === 0")
ul.menu-list a: em No results matching your query
li(v-if="searchres.length === 0") li(v-for='sres in searchres', v-bind:class="{ 'is-active': searchmovekey === 'res.' + sres._id }")
a: em No results matching your query a(v-bind:href="'/' + sres._id") {{ sres.title }}
li(v-for='sres in searchres') p.searchresults-label(v-if='searchsuggest.length > 0') Did you mean...?
a(v-bind:href="'/' + sres._id", v-bind:class="{ 'is-active': searchmovekey === 'res.' + sres._id }") {{ sres.title }} ul.searchresults-list(v-if='searchsuggest.length > 0')
p.menu-label(v-if='searchsuggest.length > 0') li(v-for='sug in searchsuggest', v-bind:class="{ 'is-active': searchmovekey === 'sug.' + sug }")
| Did you mean...? a(v-on:click="useSuggestion(sug)") {{ sug }}
ul.menu-list(v-if='searchsuggest.length > 0')
li(v-for='sug in searchsuggest')
a(v-on:click="useSuggestion(sug)", v-bind:class="{ 'is-active': searchmovekey === 'sug.' + sug }") {{ sug }}

View File

@ -1,30 +1,58 @@
extends ../../layout.pug extends ../../layout.pug
block rootNavCenter block rootNavCenter
h2.nav-item Account
block rootNavRight block rootNavRight
i.nav-item#notifload i.nav-item#notifload
.nav-item .nav-item
a.button.btn-edit-discard(href='/') a.button.btn-edit-discard(href='/')
span.icon i.fa.fa-home
i.fa.fa-home
span Home span Home
block content block content
#page-type-account #page-type-account
section.hero.is-dark .container.is-fluid
.hero-body .columns.is-gapless
.container
h1.title Account .column.is-narrow.is-hidden-touch.sidebar
h2.subtitle Manage your settings and site configuration
nav.nav.has-shadow aside
.container .sidebar-label
.nav-left i.icon-th-small
a.nav-item.is-tab(href='/admin/profile', class={'is-active': adminTab === 'profile'}) My Profile span Navigation
a.nav-item.is-tab(href='/admin/stats', class={'is-active': adminTab === 'stats'}) Stats ul.sidebar-menu
a.nav-item.is-tab(href='/admin/users', class={'is-active': adminTab === 'users'}) Users li
a.nav-item.is-tab(href='/admin/settings', class={'is-active': adminTab === 'settings'}) Site Settings a(href='/')
a.nav-item.is-tab(href='/logout') Logout i.icon-home
block adminContent span Home
aside
.sidebar-label
i.icon-head
span Account
ul.sidebar-menu
li
a(href='/admin/profile')
i.icon-user
span My Profile
li
a(href='/admin/stats')
i.icon-bar-graph-2
span Stats
li
a(href='/admin/users')
i.icon-users
span Users
li
a(href='/admin/settings')
i.icon-cog
span Site Settings
li
a(href='/logout')
i.icon-delete2
span Logout
.column
block adminContent

View File

@ -1,28 +1,35 @@
extends ./_layout.pug extends ./_layout.pug
block adminContent block adminContent
section.section .hero
.container h1.title#title My Profile
.columns h2.subtitle Profile and authentication info
.column.is-two-thirds .form-sections
.columns.is-gapless
.column.is-two-thirds
section
label.label Email label.label Email
p.control.has-icon.has-icon-right p.control.is-fullwidth
input.input(type='email', placeholder='Email', value=user.email, disabled=(user.provider !== 'local')) input.input(type='text', placeholder='Email', value=user.email, disabled=(user.provider !== 'local'))
i.fa.fa-envelope if user.provider == 'local'
if user.provider == 'local' section
label.label Password label.label Password
p.control.has-icon.has-icon-right p.control.is-fullwidth
input.input(type='password', placeholder='Password', value='********') input.input(type='password', placeholder='Password', value='********')
i.fa.fa-lock section
label.label Verify Password label.label Verify Password
p.control.has-icon.has-icon-right p.control.is-fullwidth
input.input(type='password', placeholder='Password', value='********') input.input(type='password', placeholder='Password', value='********')
i.fa.fa-lock section
label.label Display Name label.label Display Name
p.control.has-icon.has-icon-right p.control.is-fullwidth
input.input(type='text', placeholder='John Smith', value=user.name) input.input(type='text', placeholder='John Smith', value=user.name)
i.fa.fa-user section
.column button.button.is-green
i.icon-check
span Save Changes
.column
.panel
label.label Provider label.label Provider
p.control.account-profile-provider p.control.account-profile-provider
case user.provider case user.provider
@ -35,9 +42,4 @@ block adminContent
label.label Member since label.label Member since
p.control= userMoment(user.createdAt).format('LL') p.control= userMoment(user.createdAt).format('LL')
label.label Last Profile Update label.label Last Profile Update
p.control= userMoment(user.updatedAt).format('LL') p.control= userMoment(user.updatedAt).format('LL')
section.section
.container
p.control
button.button.is-success
| Save Changes

View File

@ -1,6 +1,9 @@
extends ./_layout.pug extends ./_layout.pug
block adminContent block adminContent
section.section .hero
.container h1.title#title Site Settings
label.label Coming soon h2.subtitle Manage site configuration
.form-sections
section
| Coming soon

View File

@ -1,11 +1,14 @@
extends ./_layout.pug extends ./_layout.pug
block adminContent block adminContent
section.section .hero
.container h1.title#title Stats
label.label Entries h2.subtitle General site-wide statistics
p.control= totalEntries .form-sections
label.label Uploads section
p.control= totalUploads label.label Entries
label.label Users p.control= totalEntries
p.control= totalUsers label.label Uploads
p.control= totalUploads
label.label Users
p.control= totalUsers

View File

@ -1,15 +1,18 @@
extends ./_layout.pug extends ./_layout.pug
block adminContent block adminContent
section.section .hero
.container h1.title#title Users
.columns h2.subtitle Manage users and rights
.column.is-three-quarters ul.hero-menu
label.label Coming soon li
.column a.is-blue(href='/')
p.control i.icon-plus
button.button.is-info span Create Local User
| Create Local User li
p.control a.is-indigo(href='/')
button.button.is-info i.icon-globe
| Authorize Social User span Authorize Social User
.form-sections
section
| Coming soon

View File

@ -6,13 +6,11 @@ block rootNavCenter
block rootNavRight block rootNavRight
i.nav-item#notifload i.nav-item#notifload
span.nav-item span.nav-item
a.button.is-warning.btn-create-discard a.button.is-outlined.btn-create-discard
span.icon i.icon-cross
i.fa.fa-times
span Discard span Discard
a.button.is-success.btn-create-save a.button.btn-create-save
span.icon i.icon-check
i.fa.fa-check
span Save Document span Save Document
block content block content

View File

@ -5,11 +5,13 @@ block rootNavCenter
block rootNavRight block rootNavRight
i.nav-item#notifload i.nav-item#notifload
a.nav-item.btn-move-prompt.is-hidden
| Move
a.nav-item(href='/' + pageData.meta.path)
| Normal View
span.nav-item span.nav-item
a.button.is-outlined.btn-move-prompt.is-hidden
i.icon-shuffle
span Move
a.button.is-outlined(href='/' + pageData.meta.path)
i.icon-loader
span Normal View
a.button.is-orange(href='/edit/' + pageData.meta.path) a.button.is-orange(href='/edit/' + pageData.meta.path)
i.fa.fa-edit i.fa.fa-edit
span Edit span Edit