mirror of
https://github.com/documize/community.git
synced 2025-07-21 06:09:42 +02:00
removed redundant colors, widgets
This commit is contained in:
Harvey Kandola
parent
869884abda
commit
3f2edcaa96
36 changed files with 161 additions and 1499 deletions
|
|
@ -1,29 +0,0 @@
|
||||||
// Copyright 2016 Documize Inc. <legal@documize.com>. All rights reserved.
|
|
||||||
//
|
|
||||||
// This software (Documize Community Edition) is licensed under
|
|
||||||
// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html
|
|
||||||
//
|
|
||||||
// You can operate outside the AGPL restrictions by purchasing
|
|
||||||
// Documize Enterprise Edition and obtaining a commercial license
|
|
||||||
// by contacting <sales@documize.com>.
|
|
||||||
//
|
|
||||||
// https://documize.com
|
|
||||||
|
|
||||||
import Component from '@ember/component';
|
|
||||||
|
|
||||||
export default Component.extend({
|
|
||||||
actions: {
|
|
||||||
|
|
||||||
onPageSequenceChange(changes) {
|
|
||||||
this.attrs.onPageSequenceChange(changes);
|
|
||||||
},
|
|
||||||
|
|
||||||
onPageLevelChange(changes) {
|
|
||||||
this.attrs.onPageLevelChange(changes);
|
|
||||||
},
|
|
||||||
|
|
||||||
onGotoPage(id) {
|
|
||||||
this.attrs.onGotoPage(id);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -1,24 +0,0 @@
|
||||||
// Copyright 2016 Documize Inc. <legal@documize.com>. All rights reserved.
|
|
||||||
//
|
|
||||||
// This software (Documize Community Edition) is licensed under
|
|
||||||
// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html
|
|
||||||
//
|
|
||||||
// You can operate outside the AGPL restrictions by purchasing
|
|
||||||
// Documize Enterprise Edition and obtaining a commercial license
|
|
||||||
// by contacting <sales@documize.com>.
|
|
||||||
//
|
|
||||||
// https://documize.com
|
|
||||||
|
|
||||||
import Component from '@ember/component';
|
|
||||||
|
|
||||||
export default Component.extend({
|
|
||||||
page: {},
|
|
||||||
tagName: "li",
|
|
||||||
classNames: ["item"],
|
|
||||||
|
|
||||||
actions: {
|
|
||||||
onClick(id) {
|
|
||||||
this.get('onClick')(id);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
// Copyright 2016 Documize Inc. <legal@documize.com>. All rights reserved.
|
|
||||||
//
|
|
||||||
// This software (Documize Community Edition) is licensed under
|
|
||||||
// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html
|
|
||||||
//
|
|
||||||
// You can operate outside the AGPL restrictions by purchasing
|
|
||||||
// Documize Enterprise Edition and obtaining a commercial license
|
|
||||||
// by contacting <sales@documize.com>.
|
|
||||||
//
|
|
||||||
// https://documize.com
|
|
||||||
|
|
||||||
import Component from '@ember/component';
|
|
||||||
|
|
||||||
export default Component.extend({
|
|
||||||
});
|
|
||||||
|
|
@ -1,35 +0,0 @@
|
||||||
// Copyright 2016 Documize Inc. <legal@documize.com>. All rights reserved.
|
|
||||||
//
|
|
||||||
// This software (Documize Community Edition) is licensed under
|
|
||||||
// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html
|
|
||||||
//
|
|
||||||
// You can operate outside the AGPL restrictions by purchasing
|
|
||||||
// Documize Enterprise Edition and obtaining a commercial license
|
|
||||||
// by contacting <sales@documize.com>.
|
|
||||||
//
|
|
||||||
// https://documize.com
|
|
||||||
|
|
||||||
import { htmlSafe } from '@ember/string';
|
|
||||||
|
|
||||||
import { computed, set } from '@ember/object';
|
|
||||||
import Component from '@ember/component';
|
|
||||||
|
|
||||||
export default Component.extend({
|
|
||||||
myWidth: computed('tabs', function() {
|
|
||||||
let count = this.get('tabs.length');
|
|
||||||
let width = 95 / count;
|
|
||||||
return htmlSafe("width: " + `${width}%;`);
|
|
||||||
}),
|
|
||||||
|
|
||||||
actions: {
|
|
||||||
onTabSelect(tab) {
|
|
||||||
this.get('tabs').forEach(t => {
|
|
||||||
set(t, 'selected', false);
|
|
||||||
});
|
|
||||||
|
|
||||||
set(tab, 'selected', true);
|
|
||||||
|
|
||||||
this.attrs.onTabSelect(this.get('tabs'));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -1,64 +0,0 @@
|
||||||
// Copyright 2016 Documize Inc. <legal@documize.com>. All rights reserved.
|
|
||||||
//
|
|
||||||
// This software (Documize Community Edition) is licensed under
|
|
||||||
// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html
|
|
||||||
//
|
|
||||||
// You can operate outside the AGPL restrictions by purchasing
|
|
||||||
// Documize Enterprise Edition and obtaining a commercial license
|
|
||||||
// by contacting <sales@documize.com>.
|
|
||||||
//
|
|
||||||
// https://documize.com
|
|
||||||
|
|
||||||
// Copyright (c) 2015 Documize Inc.
|
|
||||||
import Component from '@ember/component';
|
|
||||||
import NotifierMixin from '../mixins/notifier';
|
|
||||||
|
|
||||||
export default Component.extend(NotifierMixin, {
|
|
||||||
drop1: null,
|
|
||||||
|
|
||||||
didInsertElement() {
|
|
||||||
this._super(...arguments);
|
|
||||||
new Tooltip({
|
|
||||||
target: document.getElementById("sample-1")
|
|
||||||
});
|
|
||||||
new Tooltip({
|
|
||||||
target: document.getElementById("sample-2")
|
|
||||||
});
|
|
||||||
new Tooltip({
|
|
||||||
target: document.getElementById("sample-3")
|
|
||||||
});
|
|
||||||
new Tooltip({
|
|
||||||
target: document.getElementById("sample-4")
|
|
||||||
});
|
|
||||||
|
|
||||||
// let drop1 = new Drop({
|
|
||||||
// target: document.getElementById('sample-dropdown-1'),
|
|
||||||
// content: document.getElementById('sample-dropdown-content-1'),
|
|
||||||
// classes: 'drop-theme-basic',
|
|
||||||
// position: 'bottom middle',
|
|
||||||
// openOn: 'click'
|
|
||||||
// });
|
|
||||||
|
|
||||||
// this.set('drop1', drop1);
|
|
||||||
|
|
||||||
$('#test-button').popover({
|
|
||||||
placement: 'top',
|
|
||||||
trigger: 'focus',
|
|
||||||
title: "How to Test",
|
|
||||||
content: "This is a demo that tests the suitability of Bootstrap 4 inside Documize"
|
|
||||||
});
|
|
||||||
|
|
||||||
$('#test-button2').tooltip({});
|
|
||||||
$('#test-button3').tooltip({});
|
|
||||||
},
|
|
||||||
|
|
||||||
actions: {
|
|
||||||
dropClose() {
|
|
||||||
this.get('drop1').close();
|
|
||||||
},
|
|
||||||
|
|
||||||
addFolder() {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -1,45 +1,57 @@
|
||||||
{{toolbar/nav-bar}}
|
{{toolbar/nav-bar}}
|
||||||
|
|
||||||
<div class="container">
|
<div class="container-fluid">
|
||||||
{{toolbar/for-document document=model.document spaces=model.folders space=model.folder permissions=model.permissions onDocumentDelete=(action 'onDocumentDelete') onSaveTemplate=(action 'onSaveTemplate')}}
|
|
||||||
|
|
||||||
{{document/document-heading document=model.document permissions=model.permissions onSaveDocument=(action 'onSaveDocument')}}
|
<div class="row">
|
||||||
|
|
||||||
{{document/document-meta document=model.document folder=model.folder folders=model.folders permissions=model.permissions onSaveDocument=(action 'onSaveDocument')}}
|
<div class="col-12 col-md-4">
|
||||||
|
|
||||||
<ul class="tabnav-control">
|
{{document/document-toc document=model.document folder=model.folder pages=model.pages page=model.page permissions=model.permissions
|
||||||
<li class="tab {{if (eq tab 'content') 'selected'}}" {{action 'onTabChange' 'content'}}>Content</li>
|
onPageSequenceChange=(action 'onPageSequenceChange') onPageLevelChange=(action 'onPageLevelChange') onGotoPage=(action 'onGotoPage')}}
|
||||||
<li class="tab {{if (eq tab 'attachment') 'selected'}}" {{action 'onTabChange' 'attachment'}}>Attachments</li>
|
|
||||||
<li class="tab {{if (eq tab 'activity') 'selected'}}" {{action 'onTabChange' 'activity'}}>Activity</li>
|
|
||||||
<li class="tab {{if (eq tab 'revision') 'selected'}}" {{action 'onTabChange' 'revision'}}>Revisions</li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
{{#if (eq tab 'content')}}
|
</div>
|
||||||
{{document/view-content
|
|
||||||
document=model.document links=model.links pages=model.pages
|
|
||||||
folder=model.folder folders=model.folders sections=model.sections permissions=model.permissions pageId=pageId
|
|
||||||
onSavePage=(action 'onSavePage') onInsertSection=(action 'onInsertSection')
|
|
||||||
onSavePageAsBlock=(action 'onSavePageAsBlock') onDeleteBlock=(action 'onDeleteBlock') onGotoPage=(action 'onGotoPage')
|
|
||||||
onCopyPage=(action 'onCopyPage') onMovePage=(action 'onMovePage') onDeletePage=(action 'onPageDeleted')}}
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
{{#if (eq tab 'attachment')}}
|
<div class="col-12 col-md-8">
|
||||||
{{document/view-attachment document=model.document permissions=model.permissions}}
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
{{#if (eq tab 'activity')}}
|
{{toolbar/for-document document=model.document spaces=model.folders space=model.folder permissions=model.permissions
|
||||||
{{document/view-activity document=model.document pages=model.pages permissions=model.permissions}}
|
onDocumentDelete=(action 'onDocumentDelete') onSaveTemplate=(action 'onSaveTemplate')}}
|
||||||
{{/if}}
|
|
||||||
|
{{document/document-heading document=model.document permissions=model.permissions
|
||||||
|
onSaveDocument=(action 'onSaveDocument')}}
|
||||||
|
|
||||||
|
{{document/document-meta document=model.document folder=model.folder folders=model.folders permissions=model.permissions
|
||||||
|
onSaveDocument=(action 'onSaveDocument')}}
|
||||||
|
|
||||||
|
<ul class="tabnav-control">
|
||||||
|
<li class="tab {{if (eq tab 'content') 'selected'}}" {{action 'onTabChange' 'content'}}>Content</li>
|
||||||
|
<li class="tab {{if (eq tab 'attachment') 'selected'}}" {{action 'onTabChange' 'attachment'}}>Attachments</li>
|
||||||
|
<li class="tab {{if (eq tab 'activity') 'selected'}}" {{action 'onTabChange' 'activity'}}>Activity</li>
|
||||||
|
<li class="tab {{if (eq tab 'revision') 'selected'}}" {{action 'onTabChange' 'revision'}}>Revisions</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
{{#if (eq tab 'content')}}
|
||||||
|
{{document/view-content
|
||||||
|
document=model.document links=model.links pages=model.pages
|
||||||
|
folder=model.folder folders=model.folders sections=model.sections permissions=model.permissions pageId=pageId
|
||||||
|
onSavePage=(action 'onSavePage') onInsertSection=(action 'onInsertSection')
|
||||||
|
onSavePageAsBlock=(action 'onSavePageAsBlock') onDeleteBlock=(action 'onDeleteBlock') onGotoPage=(action 'onGotoPage')
|
||||||
|
onCopyPage=(action 'onCopyPage') onMovePage=(action 'onMovePage') onDeletePage=(action 'onPageDeleted')}}
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
{{#if (eq tab 'attachment')}}
|
||||||
|
{{document/view-attachment document=model.document permissions=model.permissions}}
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
{{#if (eq tab 'activity')}}
|
||||||
|
{{document/view-activity document=model.document pages=model.pages permissions=model.permissions}}
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
{{#if (eq tab 'revision')}}
|
||||||
|
{{document/view-revision document=model.document folder=model.folder pages=model.pages onRollback=(action 'onRollback')}}
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
{{#if (eq tab 'revision')}}
|
|
||||||
{{document/view-revision document=model.document folder=model.folder pages=model.pages onRollback=(action 'onRollback')}}
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
<div id="zone-document-content" class="zone-document-content">
|
|
||||||
{{document/document-sidebar tab=tab
|
|
||||||
document=model.document folder=model.folder pages=model.pages page=model.page permissions=model.permissions
|
|
||||||
onPageSequenceChange=(action 'onPageSequenceChange') onPageLevelChange=(action 'onPageLevelChange')
|
|
||||||
onGotoPage=(action 'onGotoPage')}}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,15 +0,0 @@
|
||||||
// Copyright 2016 Documize Inc. <legal@documize.com>. All rights reserved.
|
|
||||||
//
|
|
||||||
// This software (Documize Community Edition) is licensed under
|
|
||||||
// GNU AGPL v3 http://www.gnu.org/licenses/agpl-3.0.en.html
|
|
||||||
//
|
|
||||||
// You can operate outside the AGPL restrictions by purchasing
|
|
||||||
// Documize Enterprise Edition and obtaining a commercial license
|
|
||||||
// by contacting <sales@documize.com>.
|
|
||||||
//
|
|
||||||
// https://documize.com
|
|
||||||
|
|
||||||
import Route from '@ember/routing/route';
|
|
||||||
import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';
|
|
||||||
|
|
||||||
export default Route.extend(AuthenticatedRouteMixin);
|
|
||||||
|
|
@ -1,3 +0,0 @@
|
||||||
<div class="margin-top-50 margin-left-50">
|
|
||||||
{{widget-sample}}
|
|
||||||
</div>
|
|
||||||
|
|
@ -109,10 +109,6 @@ export default Router.map(function () {
|
||||||
path: 'accounts'
|
path: 'accounts'
|
||||||
});
|
});
|
||||||
|
|
||||||
this.route('widgets', {
|
|
||||||
path: 'widgets'
|
|
||||||
});
|
|
||||||
|
|
||||||
this.route('not-found', {
|
this.route('not-found', {
|
||||||
path: '/*wildcard'
|
path: '/*wildcard'
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -27,6 +27,7 @@ $color-gray: #8b9096;
|
||||||
$color-gray-light: #d8d8d8;
|
$color-gray-light: #d8d8d8;
|
||||||
$color-gray-light2: #eaeaea;
|
$color-gray-light2: #eaeaea;
|
||||||
$color-border: #d3d3d3;
|
$color-border: #d3d3d3;
|
||||||
|
// $color-wysiwyg: #3c3c3c;
|
||||||
|
|
||||||
// colors
|
// colors
|
||||||
$color-red: #9E0D1F;
|
$color-red: #9E0D1F;
|
||||||
|
|
@ -38,31 +39,8 @@ $color-goldy: #FFD700;
|
||||||
$color-checkbox: #2667af;
|
$color-checkbox: #2667af;
|
||||||
$color-symbol-box: #dce5e8;
|
$color-symbol-box: #dce5e8;
|
||||||
$color-symbol-icon: #a4b8be;
|
$color-symbol-icon: #a4b8be;
|
||||||
|
|
||||||
|
|
||||||
// ?????
|
|
||||||
$color-wysiwyg: #3c3c3c;
|
|
||||||
|
|
||||||
// DEAD
|
|
||||||
$color-table-border: #e1e1e1;
|
|
||||||
$color-table-header: #f5f5f5;
|
|
||||||
$color-toolbar: #eeeeee;
|
|
||||||
$color-card: #F9F9F9;
|
$color-card: #F9F9F9;
|
||||||
$color-input: #5a5a5a;
|
|
||||||
$color-stroke: #e1e1e1;
|
$color-stroke: #e1e1e1;
|
||||||
$color-tooltip: #a1a1a1;
|
|
||||||
$color-toast: #4c4c4c;
|
|
||||||
$color-sidebar: #f5f5f5;
|
|
||||||
$color-sidebar-border: #e1e1e1;
|
|
||||||
$color-sidebar-text: $color-black;
|
|
||||||
$color-sidebar-link: $color-link;
|
|
||||||
$color-nav-button: #f2faff;
|
|
||||||
$color-nav-button-text: #2667af;
|
|
||||||
$color-nav-button-border: #dff0f9;
|
|
||||||
$color-selected-item: $color-sidebar;
|
|
||||||
$color-sidebar-navigation: #f2faff;
|
|
||||||
$color-sidebar-navigation-border: #dff0f9;
|
|
||||||
$color-sidebar-toolbar: $color-sidebar-border;
|
|
||||||
|
|
||||||
// Color utility classes for direct usage in HTML
|
// Color utility classes for direct usage in HTML
|
||||||
.color-white {
|
.color-white {
|
||||||
|
|
|
||||||
|
|
@ -1,98 +1,67 @@
|
||||||
.document-sidebar-view-index {
|
.document-toc {
|
||||||
margin: 0;
|
@include border-radius(3px);
|
||||||
|
margin: 20px 0;
|
||||||
|
padding: 10px 20px;
|
||||||
|
background-color: $color-off-white;
|
||||||
|
border: 1px solid $color-border;
|
||||||
|
display: inline-block;
|
||||||
|
position: fixed;
|
||||||
|
left: 20px;
|
||||||
|
z-index: 777;
|
||||||
|
|
||||||
>.structure {
|
> .title {
|
||||||
> .toc-controls {
|
color: $color-off-black;
|
||||||
margin: 0;
|
font-weight: bold;
|
||||||
color: $color-gray;
|
font-size: 1rem;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
> .round-button-mono {
|
> .toc-controls {
|
||||||
> .material-icons {
|
margin: 0;
|
||||||
color: $color-link;
|
text-align: center;
|
||||||
}
|
|
||||||
}
|
> .disabled {
|
||||||
|
cursor: not-allowed !important;
|
||||||
|
|
||||||
> .disabled {
|
> .material-icons {
|
||||||
cursor: not-allowed !important;
|
color: $color-gray-light;
|
||||||
color: $color-stroke;
|
}
|
||||||
border-color: $color-stroke;
|
}
|
||||||
|
}
|
||||||
|
|
||||||
> .material-icons {
|
> .index-list {
|
||||||
color: $color-stroke;
|
padding: 0;
|
||||||
}
|
list-style: none;
|
||||||
}
|
font-size: 0.9rem;
|
||||||
}
|
overflow-x: hidden;
|
||||||
|
list-style-type: none;
|
||||||
|
margin: 20px 0 0;
|
||||||
|
|
||||||
> .index-list {
|
.item {
|
||||||
padding: 0;
|
@extend .no-select;
|
||||||
list-style: none;
|
padding: 4px 0;
|
||||||
font-size: 13px;
|
text-overflow: ellipsis;
|
||||||
overflow-x: hidden;
|
word-wrap: break-word;
|
||||||
list-style-type: none;
|
white-space: nowrap;
|
||||||
margin: 20px 0 0;
|
overflow: hidden;
|
||||||
|
|
||||||
|
> .link {
|
||||||
|
color: $color-dark;
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $color-link;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.item {
|
> .selected {
|
||||||
padding: 4px 0;
|
color: $color-link;
|
||||||
text-overflow: ellipsis;
|
// font-weight: bold;
|
||||||
word-wrap: break-word;
|
}
|
||||||
white-space: nowrap;
|
}
|
||||||
overflow: hidden;
|
}
|
||||||
@extend .no-select;
|
|
||||||
|
|
||||||
> .link {
|
|
||||||
color: $color-off-black;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: $color-link;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .selected {
|
|
||||||
color: $color-link;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.document-sidebar-toolbar {
|
|
||||||
margin: 10px 0 0 0;
|
|
||||||
padding: 10px 0;
|
|
||||||
text-align: center;
|
|
||||||
// background-color: $color-sidebar-toolbar;
|
|
||||||
|
|
||||||
> .round-button-mono {
|
|
||||||
background-color: $color-white;
|
|
||||||
border-color: $color-sidebar-border;
|
|
||||||
|
|
||||||
> .material-icons {
|
|
||||||
color: $color-gray;
|
|
||||||
@include ease-in();
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
> .material-icons {
|
|
||||||
color: $color-link;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .selected {
|
|
||||||
background-color: $color-primary;
|
|
||||||
border-color: $color-primary;
|
|
||||||
|
|
||||||
> .material-icons {
|
|
||||||
color: $color-off-white;
|
|
||||||
@include ease-in();
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
> .material-icons {
|
|
||||||
color: $color-white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
.wysiwyg {
|
.wysiwyg {
|
||||||
font-size: 17px;
|
font-size: 17px;
|
||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
color: $color-wysiwyg;
|
color: $color-off-black;
|
||||||
|
|
||||||
table {
|
table {
|
||||||
border: 1px solid $color-border !important;
|
border: 1px solid $color-border !important;
|
||||||
|
|
|
||||||
|
|
@ -72,63 +72,3 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.page-search {
|
|
||||||
.input-control {
|
|
||||||
> input {
|
|
||||||
background-color: $color-sidebar;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.examples {
|
|
||||||
color: $color-gray;
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-results {
|
|
||||||
> .heading {
|
|
||||||
font-size: 2rem;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .list {
|
|
||||||
margin-top: 20px;
|
|
||||||
list-style: none;
|
|
||||||
|
|
||||||
> .item {
|
|
||||||
@include content-container();
|
|
||||||
cursor: pointer;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
|
|
||||||
> .link {
|
|
||||||
text-decoration: none;
|
|
||||||
color: $color-off-black;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: $color-link;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .title {
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .folder {
|
|
||||||
font-size: 0.8rem;
|
|
||||||
color: $color-gray;
|
|
||||||
margin-top: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .excerpt {
|
|
||||||
margin-top: 1rem;
|
|
||||||
font-size: 0.9rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .chips {
|
|
||||||
margin-top: 1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -192,17 +192,6 @@
|
||||||
> .action {
|
> .action {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
> .input-control {
|
|
||||||
margin: 0;
|
|
||||||
display: inline-block;
|
|
||||||
|
|
||||||
> input {
|
|
||||||
margin: 0 0 8px 0;
|
|
||||||
padding: 0;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -24,34 +24,3 @@
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.avatar-picker {
|
|
||||||
background-color: $color-off-white;
|
|
||||||
@include border-radius(20px);
|
|
||||||
@include ease-in();
|
|
||||||
padding: 7px 0 0 0;
|
|
||||||
letter-spacing: 1px;
|
|
||||||
text-align: center;
|
|
||||||
height: 35px;
|
|
||||||
width: 35px;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
> i {
|
|
||||||
color: $color-link;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> i {
|
|
||||||
color: $color-gray;
|
|
||||||
font-size: 1.4rem;
|
|
||||||
@include ease-in();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar-remover {
|
|
||||||
&:hover {
|
|
||||||
color: $color-white;
|
|
||||||
background-color: $color-red;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -1,323 +1,4 @@
|
||||||
// Copyright (c) 2015 Documize Inc.
|
// Copyright (c) 2015 Documize Inc.
|
||||||
|
|
||||||
@mixin button-hover-state($bg) {
|
|
||||||
&:hover {
|
|
||||||
background-color: lighten($bg, 3%);
|
|
||||||
@extend .z-depth-tiny;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.square-button-mono {
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
line-height: 31px;
|
|
||||||
padding: 0;
|
|
||||||
border-radius: 2px;
|
|
||||||
transition: .3s;
|
|
||||||
cursor: pointer;
|
|
||||||
vertical-align: middle;
|
|
||||||
border: 1px solid $color-gray;
|
|
||||||
text-align: center;
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
@extend .z-depth-tiny;
|
|
||||||
}
|
|
||||||
|
|
||||||
i {
|
|
||||||
color: $color-gray;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.round-button-mono {
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 35px;
|
|
||||||
height: 35px;
|
|
||||||
line-height: 34px;
|
|
||||||
padding: 0;
|
|
||||||
border-radius: 50%;
|
|
||||||
transition: .3s;
|
|
||||||
cursor: pointer;
|
|
||||||
vertical-align: middle;
|
|
||||||
border: 1px solid $color-stroke;
|
|
||||||
text-align: center;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
background-color: transparent;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
@extend .z-depth-tiny;
|
|
||||||
}
|
|
||||||
|
|
||||||
i {
|
|
||||||
color: $color-stroke;
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.square-button-white {
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
line-height: 31px;
|
|
||||||
padding: 0;
|
|
||||||
border-radius: 2px;
|
|
||||||
transition: .3s;
|
|
||||||
cursor: pointer;
|
|
||||||
vertical-align: middle;
|
|
||||||
background-color: $color-white;
|
|
||||||
border: 1px solid $color-stroke;
|
|
||||||
text-align: center;
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
@extend .z-depth-tiny;
|
|
||||||
}
|
|
||||||
|
|
||||||
i {
|
|
||||||
color: $color-gray;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-red-text {
|
|
||||||
&:hover {
|
|
||||||
> .material-icons {
|
|
||||||
@include ease-in();
|
|
||||||
color: $color-red !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.round-button {
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 35px;
|
|
||||||
height: 35px;
|
|
||||||
line-height: 36px;
|
|
||||||
padding: 0;
|
|
||||||
border-radius: 50%;
|
|
||||||
transition: .3s;
|
|
||||||
cursor: pointer;
|
|
||||||
vertical-align: middle;
|
|
||||||
text-align: center;
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
font-size: 1.2rem;
|
|
||||||
|
|
||||||
> i {
|
|
||||||
color: $color-white;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.round-button-small {
|
|
||||||
width: 20px;
|
|
||||||
height: 20px;
|
|
||||||
line-height: 20px;
|
|
||||||
font-size: 0.9rem;
|
|
||||||
|
|
||||||
> .material-icons {
|
|
||||||
font-size: 0.9rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.square-button {
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
line-height: 34px;
|
|
||||||
padding: 0;
|
|
||||||
border-radius: 2px;
|
|
||||||
transition: .3s;
|
|
||||||
cursor: pointer;
|
|
||||||
vertical-align: middle;
|
|
||||||
text-align: center;
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
|
|
||||||
> i {
|
|
||||||
color: $color-white;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.regular-button {
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 0 1rem;
|
|
||||||
text-align: center;
|
|
||||||
letter-spacing: .5px;
|
|
||||||
transition: .2s ease-out;
|
|
||||||
border-radius: 2px;
|
|
||||||
display: inline-block;
|
|
||||||
height: 32px;
|
|
||||||
line-height: 34px;
|
|
||||||
font-size: 0.9em;
|
|
||||||
outline: 0;
|
|
||||||
text-transform: uppercase;
|
|
||||||
vertical-align: middle;
|
|
||||||
-webkit-tap-highlight-color: transparent;
|
|
||||||
color: $color-white;
|
|
||||||
cursor: pointer;
|
|
||||||
border: none;
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
|
|
||||||
> .name {
|
|
||||||
vertical-align: top;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-red {
|
|
||||||
background-color: $color-red;
|
|
||||||
@include button-hover-state($color-red);
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-blue {
|
|
||||||
background-color: $color-blue;
|
|
||||||
@include button-hover-state($color-blue);
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-green {
|
|
||||||
background-color: $color-green;
|
|
||||||
@include button-hover-state($color-green);
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-gray {
|
|
||||||
background-color: $color-gray;
|
|
||||||
@include button-hover-state($color-gray);
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-white {
|
|
||||||
border: 1px solid $color-stroke;
|
|
||||||
background-color: $color-white;
|
|
||||||
color: $color-blue;
|
|
||||||
@include button-hover-state($color-white);
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-black {
|
|
||||||
border: none;
|
|
||||||
background-color: $color-off-black;
|
|
||||||
color: $color-white;
|
|
||||||
@include button-hover-state($color-black);
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-transparent {
|
|
||||||
background-color: transparent;
|
|
||||||
color: $color-gray;
|
|
||||||
border: 1px solid $color-gray;
|
|
||||||
}
|
|
||||||
|
|
||||||
.button-nav {
|
|
||||||
background-color: $color-nav-button;
|
|
||||||
color: $color-nav-button-text;
|
|
||||||
border: 1px solid $color-sidebar-border;
|
|
||||||
}
|
|
||||||
|
|
||||||
.flat-button {
|
|
||||||
box-shadow: none;
|
|
||||||
background-color: transparent;
|
|
||||||
color: $color-off-black;
|
|
||||||
cursor: pointer;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 0 0.7rem;
|
|
||||||
text-align: center;
|
|
||||||
letter-spacing: .5px;
|
|
||||||
transition: .2s ease-out;
|
|
||||||
border-radius: 2px;
|
|
||||||
display: inline-block;
|
|
||||||
height: 33px;
|
|
||||||
line-height: 34px;
|
|
||||||
font-size: 0.9em;
|
|
||||||
outline: 0;
|
|
||||||
text-transform: uppercase;
|
|
||||||
vertical-align: middle;
|
|
||||||
-webkit-tap-highlight-color: transparent;
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
box-shadow: none;
|
|
||||||
border: 1px solid #e2e2e2;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background-color: $color-off-white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.flat-red {
|
|
||||||
color: $color-red;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border: 1px solid $color-red;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.flat-blue {
|
|
||||||
color: $color-blue;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border: 1px solid $color-blue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.flat-green {
|
|
||||||
color: $color-green;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border: 1px solid $color-green;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.flat-gray {
|
|
||||||
color: $color-gray;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border: 1px solid $color-gray;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
//
|
|
||||||
// Bootstrap 4 compatible
|
|
||||||
//
|
|
||||||
|
|
||||||
.button-gap {
|
.button-gap {
|
||||||
width: 5px;
|
width: 5px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
|
||||||
|
|
@ -1,68 +0,0 @@
|
||||||
.base-card {
|
|
||||||
border: 1px solid $color-border;
|
|
||||||
display: inline-block;
|
|
||||||
border-radius : 3px;
|
|
||||||
background-color: $color-white;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
@extend .z-depth-half;
|
|
||||||
background-color: $color-selected-item;
|
|
||||||
border-color: $color-selected-item;
|
|
||||||
transition: 0.2s all ease;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.content-card {
|
|
||||||
@extend .base-card;
|
|
||||||
margin: 0 12px 12px 0;
|
|
||||||
padding: 20px 20px;
|
|
||||||
width: 200px;
|
|
||||||
height: 250px;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
font-size: 1rem;
|
|
||||||
font-family: "open_sanssemibold";
|
|
||||||
height: 3rem;
|
|
||||||
overflow: hidden;
|
|
||||||
margin-bottom: 0.75rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.snippet {
|
|
||||||
font-size: 0.8rem;
|
|
||||||
line-height: 1.1rem;
|
|
||||||
height: 2rem;
|
|
||||||
overflow: hidden;
|
|
||||||
margin-bottom: 0.75rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.stacked-card {
|
|
||||||
@extend .base-card;
|
|
||||||
padding: 20px 20px;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
font-size: 1rem;
|
|
||||||
font-family: "open_sanssemibold";
|
|
||||||
margin-bottom: 0.75rem;
|
|
||||||
color: $color-off-black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.snippet {
|
|
||||||
font-size: 0.8rem;
|
|
||||||
line-height: 1.1rem;
|
|
||||||
margin-bottom: 0.75rem;
|
|
||||||
color: $color-stroke;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.cards-list {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
> li {
|
|
||||||
list-type: none;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -31,3 +31,12 @@
|
||||||
.ui-checkbox-selected {
|
.ui-checkbox-selected {
|
||||||
color: $color-link;
|
color: $color-link;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.widget-checkbox {
|
||||||
|
color: $color-link;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-gray {
|
||||||
|
color: $color-gray !important;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,21 +0,0 @@
|
||||||
.chip {
|
|
||||||
display: inline-block;
|
|
||||||
border-radius: 3px;
|
|
||||||
padding: 0;
|
|
||||||
height: 25px;
|
|
||||||
line-height: 0;
|
|
||||||
margin: 0 5px 10px 0;
|
|
||||||
border: 1px solid $color-gray;
|
|
||||||
background-color: $color-gray;
|
|
||||||
color: $color-white;
|
|
||||||
|
|
||||||
> .chip-text {
|
|
||||||
display: inline-block;
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 1rem;
|
|
||||||
color: $color-white;
|
|
||||||
padding: 11px 10px 0 10px;
|
|
||||||
letter-spacing: 0.7px;
|
|
||||||
line-height: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,264 +0,0 @@
|
||||||
* {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-control {
|
|
||||||
position: relative;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
|
|
||||||
> label {
|
|
||||||
color: $color-input;
|
|
||||||
font-size: 1.1em;
|
|
||||||
font-weight: normal;
|
|
||||||
font-family: $font-semibold;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .tip {
|
|
||||||
color: $color-gray;
|
|
||||||
font-size: 0.9em;
|
|
||||||
margin: 5px 0 10px;
|
|
||||||
padding: 0;
|
|
||||||
text-align: left;
|
|
||||||
font-family: $font-light;
|
|
||||||
}
|
|
||||||
|
|
||||||
> input,
|
|
||||||
textarea {
|
|
||||||
font-size: 1em;
|
|
||||||
padding: 8px 0 10px;
|
|
||||||
margin: 0 0 15px;
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
border: none;
|
|
||||||
border-bottom: 1px solid $color-input;
|
|
||||||
height: 2.5rem;
|
|
||||||
outline: none;
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
outline: none;
|
|
||||||
border-bottom: 1px solid $color-primary !important;
|
|
||||||
box-shadow: 0 1px 0 0 $color-primary !important;
|
|
||||||
transition: 0.2s ease all;
|
|
||||||
-moz-transition: 0.2s ease all;
|
|
||||||
-webkit-transition: 0.2s ease all;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> textarea {
|
|
||||||
resize: none;
|
|
||||||
height: auto !important;
|
|
||||||
overflow-y: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
> select,
|
|
||||||
> div select {
|
|
||||||
background-color: $color-white;
|
|
||||||
padding: 5px;
|
|
||||||
border: 1px solid $color-input;
|
|
||||||
border-radius: 2px;
|
|
||||||
height: 2.5rem;
|
|
||||||
font-size: 1rem;
|
|
||||||
display: inline-block;
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
outline: none;
|
|
||||||
border: 1px solid $color-input !important;
|
|
||||||
box-shadow: none !important;
|
|
||||||
transition: 0.2s ease all;
|
|
||||||
-moz-transition: 0.2s ease all;
|
|
||||||
-webkit-transition: 0.2s ease all;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .checkbox {
|
|
||||||
width: 100%;
|
|
||||||
font-size: 1em;
|
|
||||||
padding: 8px 0 10px;
|
|
||||||
margin: 0 0 15px;
|
|
||||||
display: inline-block;
|
|
||||||
border: none;
|
|
||||||
border-bottom: 1px solid $color-input;
|
|
||||||
height: 2.5rem;
|
|
||||||
outline: none;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
outline: none;
|
|
||||||
border-bottom: 1px solid $color-input !important;
|
|
||||||
box-shadow: 0 1px 0 0 $color-input !important;
|
|
||||||
transition: 0.2s ease all;
|
|
||||||
-moz-transition: 0.2s ease all;
|
|
||||||
-webkit-transition: 0.2s ease all;
|
|
||||||
}
|
|
||||||
|
|
||||||
> input[type='checkbox'] {
|
|
||||||
font-size: 1em;
|
|
||||||
padding: 8px 0 10px;
|
|
||||||
margin: 0 0 15px 5px;
|
|
||||||
display: inline-block;
|
|
||||||
border: none;
|
|
||||||
border-bottom: none;
|
|
||||||
height: 1rem;
|
|
||||||
outline: none;
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
outline: none;
|
|
||||||
border-bottom: none !important;
|
|
||||||
box-shadow: none !important;
|
|
||||||
transition: 0.2s ease all;
|
|
||||||
-moz-transition: 0.2s ease all;
|
|
||||||
-webkit-transition: 0.2s ease all;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> label {
|
|
||||||
color: $color-off-black;
|
|
||||||
font-size: 1em;
|
|
||||||
font-weight: normal;
|
|
||||||
pointer-events: none;
|
|
||||||
display: inline-block;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.error {
|
|
||||||
border-color: $color-red;
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
border-bottom: 1px solid $color-red !important;
|
|
||||||
box-shadow: 0 1px 0 0 $color-red !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
select.error {
|
|
||||||
border-color: $color-red;
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
border: 1px solid $color-red !important;
|
|
||||||
box-shadow: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-inline {
|
|
||||||
display: inline-block;
|
|
||||||
cursor: default;
|
|
||||||
width: 97%;
|
|
||||||
|
|
||||||
> input {
|
|
||||||
font-size: 1em;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
width: 100%;
|
|
||||||
border: none;
|
|
||||||
height: auto;
|
|
||||||
outline: none;
|
|
||||||
display: inline-block;
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
outline: none;
|
|
||||||
border-bottom: none !important;
|
|
||||||
box-shadow: none !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.error-inline {
|
|
||||||
border-left: 3px solid $color-red;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-transparent {
|
|
||||||
background-color: transparent !important;
|
|
||||||
|
|
||||||
> input, textarea {
|
|
||||||
background-color: transparent !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-bordered {
|
|
||||||
padding: 30px 40px;
|
|
||||||
border: 10px solid $color-border;
|
|
||||||
@include border-radius(15px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-header {
|
|
||||||
> .title {
|
|
||||||
font-size: 1.4rem;
|
|
||||||
font-weight: normal;
|
|
||||||
font-family: $font-semibold;
|
|
||||||
pointer-events: none;
|
|
||||||
font-weight: bold;
|
|
||||||
color: $color-off-black;
|
|
||||||
@extend .no-select;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .tip {
|
|
||||||
color: $color-input;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
margin: 5px 0 30px;
|
|
||||||
padding: 0;
|
|
||||||
font-family: $font-light;
|
|
||||||
text-align: left;
|
|
||||||
@extend .no-select;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-header-sticky {
|
|
||||||
@include sticky();
|
|
||||||
top: 0;
|
|
||||||
padding: 20px 0;
|
|
||||||
background-color: $color-white;
|
|
||||||
|
|
||||||
> .left-zone {
|
|
||||||
float: left;
|
|
||||||
text-align: left;
|
|
||||||
width: 65%;
|
|
||||||
background-color: $color-white;
|
|
||||||
|
|
||||||
> .title {
|
|
||||||
font-size: 1.4rem;
|
|
||||||
font-weight: normal;
|
|
||||||
font-family: $font-semibold;
|
|
||||||
pointer-events: none;
|
|
||||||
font-weight: bold;
|
|
||||||
color: $color-off-black;
|
|
||||||
@extend .no-select;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .tip {
|
|
||||||
color: $color-input;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
margin: 5px 0 30px;
|
|
||||||
padding: 0;
|
|
||||||
font-family: $font-light;
|
|
||||||
text-align: left;
|
|
||||||
@extend .no-select;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .right-zone {
|
|
||||||
float: right;
|
|
||||||
text-align: right;
|
|
||||||
width: 30%;
|
|
||||||
background-color: $color-white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-divider {
|
|
||||||
margin-top: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.widget-checkbox {
|
|
||||||
color: $color-link;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.checkbox-gray {
|
|
||||||
color: $color-gray !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//
|
|
||||||
// Bootstrap 4 compatible
|
|
||||||
//
|
|
||||||
|
|
@ -3,7 +3,7 @@
|
||||||
display: none;
|
display: none;
|
||||||
top: 20px;
|
top: 20px;
|
||||||
right: 20px;
|
right: 20px;
|
||||||
background-color: $color-toast;
|
background-color: $color-off-black;
|
||||||
color: $color-white;
|
color: $color-white;
|
||||||
padding: 10px 15px;
|
padding: 10px 15px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
|
|
||||||
|
|
@ -1,34 +0,0 @@
|
||||||
.widget-selection {
|
|
||||||
> .option {
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
padding: 5px 10px;
|
|
||||||
text-align: left;
|
|
||||||
@extend .no-select;
|
|
||||||
cursor: pointer;
|
|
||||||
// border: 1px solid $color-border;
|
|
||||||
color: $color-off-black;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
> i.material-icons {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
@include ease-in();
|
|
||||||
background-color: $color-off-white;
|
|
||||||
}
|
|
||||||
|
|
||||||
> .selected {
|
|
||||||
background-color: $color-selected-item !important;
|
|
||||||
color: $color-primary !important;
|
|
||||||
|
|
||||||
> i.material-icons {
|
|
||||||
display: inline-block;
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
top: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,27 +0,0 @@
|
||||||
.sidebar-menu {
|
|
||||||
margin: 0;
|
|
||||||
|
|
||||||
> .options {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
|
|
||||||
> .option {
|
|
||||||
margin-bottom: 15px;
|
|
||||||
font-size: 1.3rem;
|
|
||||||
list-style: none;
|
|
||||||
cursor: pointer;
|
|
||||||
color: $color-off-black;
|
|
||||||
@extend .no-select;
|
|
||||||
@include ease-in();
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: $color-link;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .selected {
|
|
||||||
color: $color-link;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,29 +0,0 @@
|
||||||
.widget-tab {
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0 10px;
|
|
||||||
text-align: center;
|
|
||||||
@extend .no-select;
|
|
||||||
|
|
||||||
> .tab {
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0;
|
|
||||||
padding: 5px 10px;
|
|
||||||
background-color: $color-off-white;
|
|
||||||
color: $color-gray;
|
|
||||||
text-align: center;
|
|
||||||
cursor: pointer;
|
|
||||||
margin-right: -3px;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
@include ease-in();
|
|
||||||
background-color: $color-gray;
|
|
||||||
color: $color-off-white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> .selected {
|
|
||||||
background-color: $color-gray;
|
|
||||||
color: $color-off-white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -63,16 +63,10 @@
|
||||||
|
|
||||||
@import "widget-avatar";
|
@import "widget-avatar";
|
||||||
@import "widget-button";
|
@import "widget-button";
|
||||||
@import "widget-card";
|
|
||||||
@import "widget-checkbox";
|
@import "widget-checkbox";
|
||||||
@import "widget-chip";
|
|
||||||
@import "widget-input";
|
|
||||||
@import "widget-list-picker";
|
@import "widget-list-picker";
|
||||||
@import "widget-notification";
|
@import "widget-notification";
|
||||||
@import "widget-radio";
|
@import "widget-radio";
|
||||||
@import "widget-selection";
|
|
||||||
@import "widget-sidebar-menu";
|
|
||||||
@import "widget-symbol";
|
@import "widget-symbol";
|
||||||
@import "widget-tab";
|
|
||||||
@import "widget-table";
|
@import "widget-table";
|
||||||
@import "widget-tabnav";
|
@import "widget-tabnav";
|
||||||
|
|
|
||||||
|
|
@ -51,7 +51,7 @@
|
||||||
{{#if showSearch}}
|
{{#if showSearch}}
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col content-linker-modal-container">
|
<div class="col content-linker-modal-container">
|
||||||
<div class="input-control">
|
<div class="form-group">
|
||||||
<label>Search</label>
|
<label>Search</label>
|
||||||
<div class="tip">For content or attachments</div>
|
<div class="tip">For content or attachments</div>
|
||||||
{{focus-input id="content-linker-search" type="input" value=keywords placeholder="keyword search" autocomplete="off"}}
|
{{focus-input id="content-linker-search" type="input" value=keywords placeholder="keyword search" autocomplete="off"}}
|
||||||
|
|
|
||||||
|
|
@ -1,31 +0,0 @@
|
||||||
<div class="document-sidebar-view-index" draggable="true">
|
|
||||||
<div class="structure">
|
|
||||||
{{#if session.authenticated}}
|
|
||||||
{{#unless emptyState}}
|
|
||||||
<div id="tocToolbar" class="hidden-xs hidden-sm toc-controls {{if state.actionablePage 'current-page' ''}}">
|
|
||||||
<div id="toc-up-button" class="round-button-mono {{if state.upDisabled 'disabled'}}" data-tooltip="Move up" data-tooltip-position="top center" {{action 'pageUp'}}>
|
|
||||||
<i class="material-icons">arrow_upward</i>
|
|
||||||
</div>
|
|
||||||
<div class="button-gap" />
|
|
||||||
<div id="toc-down-button" class="round-button-mono {{if state.downDisabled 'disabled'}}" data-tooltip="Move down" data-tooltip-position="top center" {{action 'pageDown'}}>
|
|
||||||
<i class="material-icons">arrow_downward</i>
|
|
||||||
</div>
|
|
||||||
<div class="button-gap" />
|
|
||||||
<div id="toc-outdent-button" class="round-button-mono {{if state.outdentDisabled 'disabled'}}" data-tooltip="Outdent" data-tooltip-position="top center" {{action 'pageOutdent'}}>
|
|
||||||
<i class="material-icons">format_indent_decrease</i>
|
|
||||||
</div>
|
|
||||||
<div class="button-gap" />
|
|
||||||
<div id="toc-indent-button" class="round-button-mono {{if state.indentDisabled 'disabled'}}" data-tooltip="Indent" data-tooltip-position="top center" {{action 'pageIndent'}}>
|
|
||||||
<i class="material-icons">format_indent_increase</i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{{/unless}}
|
|
||||||
{{/if}}
|
|
||||||
|
|
||||||
<ul class="index-list">
|
|
||||||
{{#each pages key="id" as |p index|}}
|
|
||||||
{{document/index-entry page=p currentPageId=currentPageId index=index onClick=(action 'onEntryClick')}}
|
|
||||||
{{/each}}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,12 +0,0 @@
|
||||||
{{#if permissions.documentEdit}}
|
|
||||||
|
|
||||||
{{document/document-index
|
|
||||||
document=document
|
|
||||||
folder=folder
|
|
||||||
pages=pages
|
|
||||||
page=page
|
|
||||||
permissions=permissions
|
|
||||||
onPageSequenceChange=(action 'onPageSequenceChange')
|
|
||||||
onPageLevelChange=(action 'onPageLevelChange')
|
|
||||||
onGotoPage=(action 'onGotoPage')}}
|
|
||||||
{{/if}}
|
|
||||||
36
gui/app/templates/components/document/document-toc.hbs
Normal file
36
gui/app/templates/components/document/document-toc.hbs
Normal file
|
|
@ -0,0 +1,36 @@
|
||||||
|
<div class="document-toc">
|
||||||
|
<div class="title">Table of contents</div>
|
||||||
|
{{#if session.authenticated}}
|
||||||
|
{{#if permissions.documentEdit}}
|
||||||
|
{{#unless emptyState}}
|
||||||
|
<div id="tocToolbar" class="hidden-xs hidden-sm toc-controls {{if state.actionablePage 'current-page' ''}}">
|
||||||
|
<div id="toc-up-button" class="button-icon-green button-icon-small {{if state.upDisabled 'disabled'}}" {{action 'pageUp'}}>
|
||||||
|
<i class="material-icons">arrow_upward</i>
|
||||||
|
</div>
|
||||||
|
<div class="button-icon-gap" />
|
||||||
|
<div id="toc-down-button" class="button-icon-green button-icon-small {{if state.downDisabled 'disabled'}}" {{action 'pageDown'}}>
|
||||||
|
<i class="material-icons">arrow_downward</i>
|
||||||
|
</div>
|
||||||
|
<div class="button-icon-gap" />
|
||||||
|
<div id="toc-outdent-button" class="button-icon-green button-icon-small {{if state.outdentDisabled 'disabled'}}" {{action 'pageOutdent'}}>
|
||||||
|
<i class="material-icons">arrow_back</i>
|
||||||
|
</div>
|
||||||
|
<div class="button-icon-gap" />
|
||||||
|
<div id="toc-indent-button" class="button-icon-green button-icon-small {{if state.indentDisabled 'disabled'}}" {{action 'pageIndent'}}>
|
||||||
|
<i class="material-icons">arrow_forward</i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{/unless}}
|
||||||
|
{{/if}}
|
||||||
|
{{/if}}
|
||||||
|
|
||||||
|
<ul class="index-list">
|
||||||
|
{{#each pages key="id" as |page index|}}
|
||||||
|
<li class="item">
|
||||||
|
<a id="index-{{page.id}}" {{action 'onEntryClick' page.id}} class="link toc-index-item {{page.tocIndentCss}} {{if (eq page.id currentPageId) 'selected'}}">
|
||||||
|
{{page.numbering}}. {{page.title}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
{{/each}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<a id="index-{{page.id}}" class="link toc-index-item {{page.tocIndentCss}} {{if (eq page.id currentPageId) 'selected'}}" {{action 'onClick' page.id}}>{{page.title}}</a>
|
|
||||||
|
|
@ -46,10 +46,10 @@
|
||||||
|
|
||||||
<div id="wizard-placeholder" class="hide margin-top-50" />
|
<div id="wizard-placeholder" class="hide margin-top-50" />
|
||||||
<div id="new-section-wizard" class="new-section-wizard">
|
<div id="new-section-wizard" class="new-section-wizard">
|
||||||
<div class="input-inline input-transparent pull-left width-80">
|
<div class="">
|
||||||
{{input type="text" id="new-section-name" value=newSectionName class=(if newSectionNameMissing 'section-name error-inline' 'section-name') placeholder="Name" autocomplete="off"}}
|
{{input type="text" id="new-section-name" value=newSectionName class=(if newSectionNameMissing 'section-name error-inline' 'section-name') placeholder="Name" autocomplete="off"}}
|
||||||
</div>
|
</div>
|
||||||
<div class="round-button-mono pull-right" {{action 'onHideSectionWizard'}}>
|
<div class="button-icon-gray" {{action 'onHideSectionWizard'}}>
|
||||||
<i class="material-icons color-gray">close</i>
|
<i class="material-icons color-gray">close</i>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix" />
|
<div class="clearfix" />
|
||||||
|
|
|
||||||
|
|
@ -1,18 +1,17 @@
|
||||||
<div class="login-form">
|
<div class="login-form">
|
||||||
<form {{action 'reset' on="submit"}}>
|
<form {{action 'reset' on="submit"}}>
|
||||||
<div class="input-control">
|
<div class="form-group">
|
||||||
<label>New Password</label>
|
<label>New Password</label>
|
||||||
<div class="tip">Choose a strong password</div>
|
{{focus-input type="password" value=password id="newPassword" class=(if hasPasswordError 'form-control is-invalid' 'form-control')}}
|
||||||
{{focus-input type="password" value=password id="newPassword" class=(if hasPasswordError 'error')}}
|
<small class="form-text text-muted">Choose a strong password</small>
|
||||||
</div>
|
</div>
|
||||||
<div class="input-control">
|
<div class="form-group">
|
||||||
<label>Confirm Password</label>
|
<label>Confirm Password</label>
|
||||||
<div class="tip">Please type your new password again</div>
|
{{input type="password" value=passwordConfirm id="passwordConfirm" class=(if hasConfirmError 'form-control is-invalid' 'form-control')}}
|
||||||
{{input type="password" value=passwordConfirm id="passwordConfirm" class=(if hasConfirmError 'error')}}
|
<small class="form-text text-muted">Please type your new password again</small>
|
||||||
</div>
|
</div>
|
||||||
<div class="clearfix" />
|
|
||||||
<div class="margin-top-10 margin-bottom-20">
|
<div class="margin-top-10 margin-bottom-20">
|
||||||
<button type="submit" class="regular-button button-blue">Reset</button>
|
<button type="submit" class="btn btn-success">Reset</button>
|
||||||
<span class="{{unless mustMatch "hide"}} color-red margin-left-20">Passwords must match</span>
|
<span class="{{unless mustMatch "hide"}} color-red margin-left-20">Passwords must match</span>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
||||||
|
|
@ -1,6 +0,0 @@
|
||||||
<div class="widget-selection">
|
|
||||||
<div class="option {{if selected 'selected'}}">
|
|
||||||
{{yield}}
|
|
||||||
<i class="material-icons">check</i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
@ -1,5 +0,0 @@
|
||||||
<ul class="widget-tab">
|
|
||||||
{{#each tabs as |tab|}}
|
|
||||||
<li style={{myWidth}} class="tab {{if tab.selected 'selected'}}" {{action 'onTabSelect' tab}}>{{tab.label}}</li>
|
|
||||||
{{/each}}
|
|
||||||
</ul>
|
|
||||||
|
|
@ -1,227 +0,0 @@
|
||||||
<button type="button" class="btn btn-primary" id="test-button">Save</button>
|
|
||||||
<button type="button" class="btn btn-success font-weight-bold" id="test-button2" data-toggle="tooltip" data-placement="top" title="Tooltip on top">+ Document</button>
|
|
||||||
<button type="button" class="btn btn-secondary" id="test-button3" data-toggle="tooltip" data-placement="bottom" title="Tooltip on top">+ Document</button>
|
|
||||||
|
|
||||||
<button type="button" class="btn btn-danger" id="test-button4" data-toggle="modal" data-target="#exampleModal" data-backdrop="static">Delete</button>
|
|
||||||
<div class="modal" tabindex="-1" role="dialog" id="exampleModal">
|
|
||||||
<div class="modal-dialog" role="document">
|
|
||||||
<div class="modal-content">
|
|
||||||
<div class="modal-header">Modal title</div>
|
|
||||||
<div class="modal-body">
|
|
||||||
<p>Modal body text goes here.</p>
|
|
||||||
</div>
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button type="button" class="btn btn-light" data-dismiss="modal">Close</button>
|
|
||||||
<button type="button" class="btn btn-primary">Save changes</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="btn-group">
|
|
||||||
<i id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="material-icons">arrow_drop_down_circle</i>
|
|
||||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
|
|
||||||
<a class="dropdown-item" href="#">Action</a>
|
|
||||||
<a class="dropdown-item" href="#">Another action</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a class="dropdown-item" href="#">Something else here</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="btn-group">
|
|
||||||
<div class="round-button-mono" id="dropdownMenuButton2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" >
|
|
||||||
<i class="material-icons">settings</i>
|
|
||||||
</div>
|
|
||||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton2">
|
|
||||||
<a class="dropdown-item" href="#">Action</a>
|
|
||||||
<div class="dropdown-divider"></div>
|
|
||||||
<a class="dropdown-item" href="#">Another action</a>
|
|
||||||
<a class="dropdown-item" href="#">Something else here</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<button type="button" class="btn btn-primary">Primary</button>
|
|
||||||
<button type="button" class="btn btn-secondary">Secondary</button>
|
|
||||||
<button type="button" class="btn btn-success">Success</button>
|
|
||||||
<button type="button" class="btn btn-danger">Danger</button>
|
|
||||||
<button type="button" class="btn btn-warning">Warning</button>
|
|
||||||
<button type="button" class="btn btn-info">Info</button>
|
|
||||||
<button type="button" class="btn btn-light">Light</button>
|
|
||||||
<button type="button" class="btn btn-dark">Dark</button>
|
|
||||||
<button type="button" class="btn btn-link">Link</button>
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<div class="btn-group" role="group" aria-label="Basic example">
|
|
||||||
<button type="button" class="btn btn-secondary">Left</button>
|
|
||||||
<button type="button" class="btn btn-secondary">Middle</button>
|
|
||||||
<button type="button" class="btn btn-secondary">Right</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col">
|
|
||||||
<form>
|
|
||||||
<div class="input-group">
|
|
||||||
<span class="input-group-addon" id="basic-addon1">@</span>
|
|
||||||
<input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1">
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleFormControlInput1">Email address</label>
|
|
||||||
<input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleFormControlInput2">Email address</label>
|
|
||||||
<input type="email" class="form-control is-invalid" id="exampleFormControlInput2" placeholder="name@example.com">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleFormControlSelect1">Example select</label>
|
|
||||||
<select class="form-control" id="exampleFormControlSelect1">
|
|
||||||
<option>1</option>
|
|
||||||
<option>2</option>
|
|
||||||
<option>3</option>
|
|
||||||
<option>4</option>
|
|
||||||
<option>5</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleFormControlSelect2">Example multiple select</label>
|
|
||||||
<select multiple class="form-control" id="exampleFormControlSelect2">
|
|
||||||
<option>1</option>
|
|
||||||
<option>2</option>
|
|
||||||
<option>3</option>
|
|
||||||
<option>4</option>
|
|
||||||
<option>5</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="exampleFormControlTextarea1">Example textarea</label>
|
|
||||||
<textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="round-button-mono" id="sample-1" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">share</i>
|
|
||||||
</div>
|
|
||||||
<div class="round-button-mono" id="sample-2" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">clear</i>
|
|
||||||
</div>
|
|
||||||
<div class="round-button-mono" id="sample-" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">settings</i>
|
|
||||||
</div>
|
|
||||||
<div class="round-button-mono" id="delete-folder">
|
|
||||||
<i class="material-icons">delete</i>
|
|
||||||
</div>
|
|
||||||
<div class="clearfix" />
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="round-button button-red" id="sample-3" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">share</i>
|
|
||||||
</div>
|
|
||||||
<div class="round-button button-blue" id="sample-4" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">share</i>
|
|
||||||
</div>
|
|
||||||
<div class="round-button button-green" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">share</i>
|
|
||||||
</div>
|
|
||||||
<div class="round-button button-gray" id="" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">question_answer</i>
|
|
||||||
</div>
|
|
||||||
<div class="clearfix" />
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="square-button button-red" id="sample-3" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">share</i>
|
|
||||||
</div>
|
|
||||||
<div class="square-button button-blue" id="sample-4" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">share</i>
|
|
||||||
</div>
|
|
||||||
<div class="square-button button-green" id="sample-dropdown-1" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">share</i>
|
|
||||||
</div>
|
|
||||||
<div class="square-button button-gray" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
<i class="material-icons">question_answer</i>
|
|
||||||
</div>
|
|
||||||
<div class="clearfix" />
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="regular-button button-red" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
delete
|
|
||||||
</div>
|
|
||||||
<div class="regular-button button-blue" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
save
|
|
||||||
</div>
|
|
||||||
<div class="regular-button button-green" data-tooltip="Share folder" data-tooltip-position="top center">
|
|
||||||
update
|
|
||||||
</div>
|
|
||||||
<div class="regular-button button-gray" id="dropdown-menu-1">
|
|
||||||
menu
|
|
||||||
</div>
|
|
||||||
<div class="clearfix" />
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flat-button">
|
|
||||||
cancel
|
|
||||||
</div>
|
|
||||||
<div class="flat-button flat-blue">
|
|
||||||
Got it
|
|
||||||
</div>
|
|
||||||
<div class="flat-button flat-green">
|
|
||||||
save
|
|
||||||
</div>
|
|
||||||
<div class="flat-button flat-red">
|
|
||||||
delete
|
|
||||||
</div>
|
|
||||||
<div class="flat-button flat-gray">
|
|
||||||
ok
|
|
||||||
</div>
|
|
||||||
<div class="clearfix" />
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
<div class="margin-left-50" style="width: 300px;">
|
|
||||||
<div class="input-control">
|
|
||||||
<label>Name</label>
|
|
||||||
<input type="text" value="">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-control">
|
|
||||||
<label>Email</label>
|
|
||||||
<input type="text" value="">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="input-control">
|
|
||||||
<label>Notes</label>
|
|
||||||
<div class="tip">No more than 200 characters</div>
|
|
||||||
<textarea rows="3"></textarea>
|
|
||||||
</div>
|
|
||||||
<div class="regular-button button-blue">
|
|
||||||
save
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br/>
|
|
||||||
<br/>
|
|
||||||
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue