diff --git a/gulpfile.js b/gulpfile.js index 92336797..37cff112 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -152,7 +152,7 @@ gulp.task('scripts_concat_tutti', function(done) { let toUglify = [ source.jquery + 'dist/jquery.min.js', - source.vue + 'dist/vue.min.js', + source.vue + (enabled.uglify ? 'dist/vue.min.js' : 'dist/vue.js'), source.popper + 'dist/umd/popper.min.js', source.bootstrap + 'js/dist/index.js', source.bootstrap + 'js/dist/util.js', diff --git a/src/scripts/js/es6/common/vuecomponents/comments/AttachmentEditor.js b/src/scripts/js/es6/common/vuecomponents/comments/AttachmentEditor.js index 72e86954..ae82c42b 100644 --- a/src/scripts/js/es6/common/vuecomponents/comments/AttachmentEditor.js +++ b/src/scripts/js/es6/common/vuecomponents/comments/AttachmentEditor.js @@ -104,8 +104,8 @@ Vue.component('comment-attachment-editor', { methods: { /** * Replaces all spaces with underscore and removes all o - * @param {String} unsafe - * @returns {String} + * @param {String} unsafe + * @returns {String} */ makeSafeAttachmentString(unsafe) { let candidate = (unsafe); @@ -113,8 +113,8 @@ Vue.component('comment-attachment-editor', { candidate = candidate .replace(matchSpace, '_') .replace(NON_VALID_NAME_REGEXP, '') - + return candidate || `${this.oid}` } } -}); \ No newline at end of file +}); diff --git a/src/scripts/js/es6/common/vuecomponents/comments/Comment.js b/src/scripts/js/es6/common/vuecomponents/comments/Comment.js index b25af25e..589caa3f 100644 --- a/src/scripts/js/es6/common/vuecomponents/comments/Comment.js +++ b/src/scripts/js/es6/common/vuecomponents/comments/Comment.js @@ -89,7 +89,7 @@ const TEMPLATE = ` {toastr.error(pillar.utils.messageFromError(err), 'Failed to submit comment')}) ) .then(() => { - EventBus.$emit(Events.EDIT_DONE, this.comment._id); + EventBus.$emit(Events.EDIT_DONE); }); }, thenSubmit() { diff --git a/src/scripts/js/es6/common/vuecomponents/comments/CommentTree.js b/src/scripts/js/es6/common/vuecomponents/comments/CommentTree.js index 377b47d1..82918168 100644 --- a/src/scripts/js/es6/common/vuecomponents/comments/CommentTree.js +++ b/src/scripts/js/es6/common/vuecomponents/comments/CommentTree.js @@ -63,7 +63,6 @@ Vue.component('comments-tree', { comments: [], showLoadingPlaceholder: true, user: pillar.utils.getCurrentUser(), - canPostComments: this.canPostCommentsStr == 'true' } }, computed: { @@ -74,12 +73,6 @@ Vue.component('comments-tree', { isLoggedIn() { return this.user.is_authenticated; }, - iSubscriber() { - return this.user.hasCap('subscriber'); - }, - canRenewSubscription() { - return this.user.hasCap('can-renew-subscription'); - }, canReply() { return !this.readOnly && !this.replyHidden && this.isLoggedIn; } diff --git a/src/scripts/js/es6/common/vuecomponents/comments/Rating.js b/src/scripts/js/es6/common/vuecomponents/comments/Rating.js index 5aeb7305..e74fe86e 100644 --- a/src/scripts/js/es6/common/vuecomponents/comments/Rating.js +++ b/src/scripts/js/es6/common/vuecomponents/comments/Rating.js @@ -45,7 +45,7 @@ Vue.component('comment-rating', { .then((updatedComment) => { EventBus.$emit(Events.UPDATED_COMMENT, updatedComment); }) - .fail((err) => {toastr.error(pillar.utils.messageFromError(err), 'Faied to vote on comment')}) + .fail((err) => {toastr.error(pillar.utils.messageFromError(err), 'Failed to vote on comment')}) ); } } diff --git a/src/scripts/js/es6/common/vuecomponents/customdirectives/click-outside.js b/src/scripts/js/es6/common/vuecomponents/customdirectives/click-outside.js index 1bfa4bca..bd07d311 100644 --- a/src/scripts/js/es6/common/vuecomponents/customdirectives/click-outside.js +++ b/src/scripts/js/es6/common/vuecomponents/customdirectives/click-outside.js @@ -1,5 +1,14 @@ -// Code from https://stackoverflow.com/a/42389266 - +/** + * Directive to detect clicks outside of component. + * Code from https://stackoverflow.com/a/42389266 + * + * @example + *
+ * ... + *
+ */ Vue.directive('click-outside', { bind: function (el, binding, vnode) { el.clickOutsideEvent = function (event) { diff --git a/src/scripts/js/es6/common/vuecomponents/init.js b/src/scripts/js/es6/common/vuecomponents/init.js index df843638..0382fac6 100644 --- a/src/scripts/js/es6/common/vuecomponents/init.js +++ b/src/scripts/js/es6/common/vuecomponents/init.js @@ -3,7 +3,7 @@ import './comments/CommentTree' import './customdirectives/click-outside' import { UnitOfWorkTracker } from './mixins/UnitOfWorkTracker' import { BrowserHistoryState, StateSaveMode } from './mixins/BrowserHistoryState' -import { PillarTable, TableState } from './table/Table' +import { PillarTable } from './table/Table' import { CellPrettyDate } from './table/cells/renderer/CellPrettyDate' import { CellDefault } from './table/cells/renderer/CellDefault' import { ColumnBase } from './table/columns/ColumnBase' @@ -28,7 +28,6 @@ let mixins = { let table = { PillarTable, - TableState, columns: { ColumnBase, Created, diff --git a/src/scripts/js/es6/common/vuecomponents/table/Table.js b/src/scripts/js/es6/common/vuecomponents/table/Table.js index 8167dc18..69c30770 100644 --- a/src/scripts/js/es6/common/vuecomponents/table/Table.js +++ b/src/scripts/js/es6/common/vuecomponents/table/Table.js @@ -5,29 +5,11 @@ import './rows/filter/RowFilter' import {UnitOfWorkTracker} from '../mixins/UnitOfWorkTracker' import {RowFilter} from './rows/filter/RowFilter' -/** - * Table State - * - * Used to restore a table to a given state. - */ -class TableState { - constructor(selectedIds) { - this.selectedIds = selectedIds || []; - } - - /** - * Apply state to row - * @param {RowBase} rowObject - */ - applyRowState(rowObject) { - rowObject.isSelected = this.selectedIds.includes(rowObject.getId()); - } -} class ComponentState { /** * Serializable state of this component. - * + * * @param {Object} rowFilter * @param {Object} columnFilter */ @@ -46,8 +28,8 @@ const TEMPLATE =` :rowObjects="sortedRowObjects" :config="rowFilterConfig" :componentState="(componentState || {}).rowFilter" - @visibleRowObjectsChanged="onVisibleRowObjectsChanged" - @componentStateChanged="onRowFilterStateChanged" + @visible-row-objects-changed="onVisibleRowObjectsChanged" + @component-state-changed="onRowFilterStateChanged" />
@@ -79,18 +61,18 @@ const TEMPLATE =` /** * The table renders RowObject instances for the rows, and ColumnBase instances for the Columns. - * Extend the table to fit your needs. - * + * Extend the table to fit your needs. + * * Usage: * Extend RowBase to wrap the data you want in your row * Extend ColumnBase once per column type you need * Extend RowObjectsSourceBase to fetch and initialize your rows * Extend ColumnFactoryBase to create the rows for your table * Extend This Table with your ColumnFactory and RowSource - * - * @emits isInitialized When all rows has been fetched, and are initialized. - * @emits selectItemsChanged(selectedItems) When selected rows has changed. - * @emits componentStateChanged(newState) When table state changed. Filtered rows, visible columns... + * + * @emits is-initialized When all rows has been fetched, and are initialized. + * @emits selected-items-changed(selectedItems) When selected rows has changed. + * @emits component-state-changed(newState) When table state changed. Filtered rows, visible columns... */ let PillarTable = Vue.component('pillar-table-base', { template: TEMPLATE, @@ -98,7 +80,7 @@ let PillarTable = Vue.component('pillar-table-base', { props: { selectedIds: { type: Array, - default: [] + default: () => {return []} }, canChangeSelectionCB: { type: Function, @@ -109,13 +91,14 @@ let PillarTable = Vue.component('pillar-table-base', { default: true }, componentState: { - // Instance of ComponentState + // Instance of ComponentState (but type Object since it has been deserialized) type: Object, default: undefined } }, data: function() { return { + currentlySelectedIds: [], columns: [], visibleColumns: [], visibleRowObjects: [], @@ -161,6 +144,9 @@ let PillarTable = Vue.component('pillar-table-base', { }, watch: { selectedIds(newValue) { + this.currentlySelectedIds = newValue; + }, + currentlySelectedIds(newValue) { this.rowAndChildObjects.forEach(item => { item.isSelected = newValue.includes(item.getId()); }); @@ -169,12 +155,12 @@ let PillarTable = Vue.component('pillar-table-base', { // Deep compare to avoid spamming un needed events let hasChanged = JSON.stringify(newValue ) !== JSON.stringify(oldValue); if (hasChanged) { - this.$emit('selectItemsChanged', newValue); + this.$emit('selected-items-changed', newValue); } }, isInitialized(newValue) { if (newValue) { - this.$emit('isInitialized'); + this.$emit('is-initialized'); } }, currentComponentState(newValue, oldValue) { @@ -182,14 +168,12 @@ let PillarTable = Vue.component('pillar-table-base', { // Deep compare to avoid spamming un needed events let hasChanged = JSON.stringify(newValue ) !== JSON.stringify(oldValue); if (hasChanged) { - this.$emit('componentStateChanged', newValue); + this.$emit('component-state-changed', newValue); } } } }, created() { - let tableState = new TableState(this.selectedIds); - this.unitOfWork( Promise.all([ this.columnFactory.thenGetColumns(), @@ -200,12 +184,11 @@ let PillarTable = Vue.component('pillar-table-base', { return this.rowsSource.thenInit(); }) .then(() => { - let currentlySelectedIds = this.selectedItems.map(it => it._id); - if (currentlySelectedIds.length > 0) { + if (this.currentlySelectedIds.length === 0) { + this.currentlySelectedIds = this.selectedIds; + } else { // User has clicked on a row while we inited the rows. Keep that selection! - tableState.selectedIds = currentlySelectedIds; } - this.rowAndChildObjects.forEach(tableState.applyRowState.bind(tableState)); this.isInitialized = true; }) .catch((err) => {toastr.error(pillar.utils.messageFromError(err), 'Loading table failed')}) @@ -234,24 +217,24 @@ let PillarTable = Vue.component('pillar-table-base', { if(!this.canChangeSelectionCB()) return; if(this.isMultiToggleClick(clickEvent) && this.canMultiSelect) { - let slectedIdsWithoutClicked = this.selectedIds.filter(id => id !== itemId); - if (slectedIdsWithoutClicked.length < this.selectedIds.length) { - this.selectedIds = slectedIdsWithoutClicked; + let slectedIdsWithoutClicked = this.currentlySelectedIds.filter(id => id !== itemId); + if (slectedIdsWithoutClicked.length < this.currentlySelectedIds.length) { + this.currentlySelectedIds = slectedIdsWithoutClicked; } else { - this.selectedIds = [itemId, ...this.selectedIds]; + this.currentlySelectedIds = [itemId, ...this.currentlySelectedIds]; } } else if(this.isSelectBetweenClick(clickEvent) && this.canMultiSelect) { - if (this.selectedIds.length > 0) { - let betweenA = this.selectedIds[this.selectedIds.length -1]; + if (this.currentlySelectedIds.length > 0) { + let betweenA = this.currentlySelectedIds[this.currentlySelectedIds.length -1]; let betweenB = itemId; - this.selectedIds = this.rowsBetween(betweenA, betweenB).map(it => it.getId()); + this.currentlySelectedIds = this.rowsBetween(betweenA, betweenB).map(it => it.getId()); } else { - this.selectedIds = [itemId]; + this.currentlySelectedIds = [itemId]; } } else { - this.selectedIds = [itemId]; + this.currentlySelectedIds = [itemId]; } }, isSelectBetweenClick(clickEvent) { @@ -263,8 +246,8 @@ let PillarTable = Vue.component('pillar-table-base', { }, /** * Get visible rows between id1 and id2 - * @param {String} id1 - * @param {String} id2 + * @param {String} id1 + * @param {String} id2 * @returns {Array(RowObjects)} */ rowsBetween(id1, id2) { @@ -282,8 +265,9 @@ let PillarTable = Vue.component('pillar-table-base', { } }, components: { - 'pillar-table-row-filter': RowFilter + 'pillar-table-row-filter': RowFilter, + 'pillar-table-actions': {template:'
'}, } }); -export { PillarTable, TableState } +export { PillarTable } diff --git a/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellDefault.js b/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellDefault.js index 8a9a71f1..f02a6c84 100644 --- a/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellDefault.js +++ b/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellDefault.js @@ -1,3 +1,6 @@ +import {ColumnBase} from '../../columns/ColumnBase' +import {RowBase} from '../../rows/RowObjectBase' + const TEMPLATE =`
{{ cellValue }} @@ -11,9 +14,9 @@ const TEMPLATE =` let CellDefault = Vue.component('pillar-cell-default', { template: TEMPLATE, props: { - column: Object, - rowObject: Object, - rawCellValue: Object + column: ColumnBase, + rowObject: RowBase, + rawCellValue: [String,Number,Boolean,Array,Object,Date,Function,Symbol,], }, computed: { cellValue() { diff --git a/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellProxy.js b/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellProxy.js index ac3322de..562841a0 100644 --- a/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellProxy.js +++ b/src/scripts/js/es6/common/vuecomponents/table/cells/renderer/CellProxy.js @@ -1,3 +1,6 @@ +import {RowBase} from '../../rows/RowObjectBase' +import {ColumnBase} from '../../columns/ColumnBase' + const TEMPLATE =` + @visible-row-objects-changed="$emit('visible-row-objects-changed', ...arguments)" + @component-state-changed="$emit('component-state-changed', ...arguments)" +/> `; /** - * Filter row objects based on there name. - * + * Filter row objects based on there name. + * * @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed. - * @emits componentStateChanged(newState) When row filter state changed. + * @emits component-state-changed(newState) When row filter state changed. */ let NameFilter = { template: TEMPLATE, diff --git a/src/scripts/js/es6/common/vuecomponents/table/rows/filter/RowFilter.js b/src/scripts/js/es6/common/vuecomponents/table/rows/filter/RowFilter.js index be8dcd37..4713353f 100644 --- a/src/scripts/js/es6/common/vuecomponents/table/rows/filter/RowFilter.js +++ b/src/scripts/js/es6/common/vuecomponents/table/rows/filter/RowFilter.js @@ -2,11 +2,11 @@ import {NameFilter} from './NameFilter' const TEMPLATE =`
-
`; diff --git a/src/scripts/js/es6/common/vuecomponents/table/rows/filter/StatusFilter.js b/src/scripts/js/es6/common/vuecomponents/table/rows/filter/StatusFilter.js index 7361449a..34c30584 100644 --- a/src/scripts/js/es6/common/vuecomponents/table/rows/filter/StatusFilter.js +++ b/src/scripts/js/es6/common/vuecomponents/table/rows/filter/StatusFilter.js @@ -7,15 +7,15 @@ const TEMPLATE =` :componentState="componentState" :rowObjects="rowObjects" :valueExtractorCB="extractStatus" - @visibleRowObjectsChanged="$emit('visibleRowObjectsChanged', ...arguments)" - @componentStateChanged="$emit('componentStateChanged', ...arguments)" -> + @visible-row-objects-changed="$emit('visible-row-objects-changed', ...arguments)" + @component-state-changed="$emit('component-state-changed', ...arguments)" +/> `; /** - * Filter row objects based on there status. - * + * Filter row objects based on there status. + * * @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed. - * @emits componentStateChanged(newState) When row filter state changed. + * @emits component-state-changed(newState) When row filter state changed. */ let StatusFilter = { template: TEMPLATE, diff --git a/src/scripts/js/es6/common/vuecomponents/table/rows/filter/TextFilter.js b/src/scripts/js/es6/common/vuecomponents/table/rows/filter/TextFilter.js index bab98d14..2b2bca00 100644 --- a/src/scripts/js/es6/common/vuecomponents/table/rows/filter/TextFilter.js +++ b/src/scripts/js/es6/common/vuecomponents/table/rows/filter/TextFilter.js @@ -1,5 +1,5 @@ const TEMPLATE =` -
diff --git a/src/scripts/js/es6/common/vuecomponents/table/rows/renderer/Row.js b/src/scripts/js/es6/common/vuecomponents/table/rows/renderer/Row.js index 660fd745..f64cfedf 100644 --- a/src/scripts/js/es6/common/vuecomponents/table/rows/renderer/Row.js +++ b/src/scripts/js/es6/common/vuecomponents/table/rows/renderer/Row.js @@ -1,4 +1,5 @@ import '../../cells/renderer/CellProxy' +import {RowBase} from '../RowObjectBase' const TEMPLATE =` @@ -21,7 +22,7 @@ const TEMPLATE =` Vue.component('pillar-table-row', { template: TEMPLATE, props: { - rowObject: Object, + rowObject: RowBase, columns: Array }, computed: { diff --git a/src/scripts/tutti/1_project-navigation.js b/src/scripts/tutti/1_project-navigation.js index 32d7b423..8265a619 100644 --- a/src/scripts/tutti/1_project-navigation.js +++ b/src/scripts/tutti/1_project-navigation.js @@ -77,10 +77,6 @@ function containerResizeY(window_height){ 'height': window_height_minus_nav + 'px'} ); - $('#project_context, #project_context-header').css( - {'top' : breadcrumbs_height} - ); - $('#project_nav-container, #project_tree').css( {'max-height': (window_height_minus_nav) + 'px', 'height': (window_height_minus_nav) + 'px'} @@ -113,18 +109,12 @@ function showProjectSidebar(){ Cookies.remove('bcloud_ui', 'hide_project_sidebar'); $('#project-container').addClass('is-sidebar-visible'); - - // Hide the toggle button. - $('.breadcrumbs-container .project-sidebar-toggle').hide(); } function hideProjectSidebar(){ setJSONCookie('bcloud_ui', 'hide_project_sidebar', true); $('#project-container').removeClass('is-sidebar-visible'); - - // Show the toggle button. - $('.breadcrumbs-container .project-sidebar-toggle').show(); } function toggleProjectSidebar(){ diff --git a/src/styles/_comments.sass b/src/styles/_comments.sass index 3b40497f..ab21d195 100644 --- a/src/styles/_comments.sass +++ b/src/styles/_comments.sass @@ -1,32 +1,32 @@ $comments-width-max: 710px .comments-tree + @extend .position-relative + @extend .w-100 max-width: $comments-width-max - position: relative - width: 100% .comments-list-title - padding: 15px 0 10px 0 + @extend .py-2 font-size: 1.1em font-weight: 300 - color: rgba($color-text, .5) + color: $color-text-dark-hint /* Each comment on the list*/ .comment-container, .comment-reply-container - display: flex - position: relative - padding: 15px 0 + @extend .d-flex + @extend .py-2 + @extend .position-relative transition: background-color 150ms ease-in-out, padding 150ms ease-in-out, margin 150ms ease-in-out &.comment-linked + @extend .px-3 background-color: $color-background-light !important - box-shadow: inset 3px 0 0 $color-info - padding-right: 20px + box-shadow: inset 5px 0 0 $color-primary &:before bottom: 15px - color: $color-info + color: $color-primary content: 'Linked Comment' font-size: .8em position: absolute @@ -108,18 +108,21 @@ $comments-width-max: 710px padding-bottom: 0 width: 100% + strong + color: $color-text-dark-primary + &.is-reply padding: left: 20px top: 5px margin-left: 35px - box-shadow: inset 3px 0 0 $color-background + box-shadow: inset 5px 0 0 $color-background +media-xs padding-left: 15px &.comment-linked - box-shadow: inset 3px 0 0 $color-info + box-shadow: inset 5px 0 0 $color-primary &.is-first border-top: 1px solid $color-background @@ -154,13 +157,12 @@ $comments-width-max: 710px .comment-action-rating.up:before content: '\e83f' // Heart filled - .comment-rating-value - padding-right: 15px color: $color-text-dark-secondary cursor: default .comment-action-rating + @extend .px-2 cursor: pointer font-family: 'pillar-font' height: 25px @@ -169,22 +171,22 @@ $comments-width-max: 710px .comment-action-rating.up &:hover color: $color-upvote + &:before content: '\e83e' // Heart outlined - top: 2px position: relative + top: 3px .comment-action - color: $color-primary padding-left: 10px - margin-left: 10px .action + color: $color-primary cursor: pointer margin-left: 15px + &:hover - color: $color-primary - text-decoration: underline + color: lighten($color-primary, 10%) &:before color: $color-text-dark-secondary @@ -386,21 +388,15 @@ $comments-width-max: 710px content: '' color: transparent - .user-badges ul.blender-id-badges - list-style: none - padding: 0 - margin: 4px 0 0 0 - - li - margin: 2px 0 !important - - li, li a, li img - padding: 0 !important - li - display: inline + .user-badges ul + @extend .list-unstyled + @extend .mt-1 img - width: 16px height: 16px + width: 16px + + li + line-height: 1.2em .comment-avatar @extend .d-flex @@ -409,10 +405,10 @@ $comments-width-max: 710px .user-avatar img - border-radius: 50% - width: 2em - height: 2em + @extend .rounded-circle box-shadow: 0 0 0 0.2em $color-background-light + height: 2em + width: 2em .drag-hover outline-style: solid diff --git a/src/styles/_project.sass b/src/styles/_project.sass index 861cb46c..c9905ffd 100644 --- a/src/styles/_project.sass +++ b/src/styles/_project.sass @@ -1,4 +1,5 @@ $node-latest-thumbnail-size: 160px +$breadcrumbs-container-height: 26px /* Dark navbar when browsing a project. */ body.project, @@ -32,8 +33,11 @@ body.svnman, body.edit_node_types, body.search-project +media-xl left: $project_nav-width-xl + .project-sidebar-toggle + @extend .d-none + #project-side-container - display: none + display: none // It's 'flex' when is-sidebar-visible is in #project-container +media-xs position: fixed @@ -126,6 +130,7 @@ body.svnman, body.edit_node_types, body.search-project /* Header with name and node edit tools */ #project_context-header + top: $breadcrumbs-container-height right: 0 z-index: $z-index-base + 3 @@ -258,9 +263,12 @@ ul.project-edit-tools border: none .breadcrumbs-container + height: $breadcrumbs-container-height top: $project_header-height + 1 #project_context + padding-top: $breadcrumbs-container-height + 1 + .node-details-description font: size: 1.2em diff --git a/src/styles/base.sass b/src/styles/base.sass index db61fb0c..443b9634 100644 --- a/src/styles/base.sass +++ b/src/styles/base.sass @@ -52,6 +52,7 @@ @import _notifications @import _comments @import _error +@import font-pillar @import components/base @import components/alerts diff --git a/src/styles/components/_alerts.sass b/src/styles/components/_alerts.sass index 2877b4e9..2433b118 100644 --- a/src/styles/components/_alerts.sass +++ b/src/styles/components/_alerts.sass @@ -1,9 +1,11 @@ .alert margin-bottom: 0 - text-align: center padding: 10px 20px z-index: 16 + p + margin: 0 + // overriden by alert types color: $color-text-dark background-color: $color-background diff --git a/src/styles/components/_jumbotron.sass b/src/styles/components/_jumbotron.sass index 0401ea9d..54f4d34c 100644 --- a/src/styles/components/_jumbotron.sass +++ b/src/styles/components/_jumbotron.sass @@ -9,6 +9,7 @@ size: cover margin-bottom: 0 position: relative + text-shadow: 1px 1px 0 rgba($black, .2) word-break: break-word +media-sm @@ -54,9 +55,3 @@ +media-sm font-size: $display4-size - - .display-4 - font-size: $h2-font-size - - +media-sm - font-size: $display4-size diff --git a/src/styles/components/_timeline.sass b/src/styles/components/_timeline.sass index 495fc783..adccb092 100644 --- a/src/styles/components/_timeline.sass +++ b/src/styles/components/_timeline.sass @@ -57,3 +57,10 @@ body.is-mobile blockquote background-color: rgba($color-background, .1) box-shadow: inset 5px 0 0 rgba($color-background, .2) + + .btn-outline-primary + border-color: $color-text-light + color: $color-text-light + + &:hover + border-color: transparent diff --git a/src/styles/main.sass b/src/styles/main.sass index 4dc07f6f..5774f4e2 100644 --- a/src/styles/main.sass +++ b/src/styles/main.sass @@ -46,9 +46,10 @@ @import "../../node_modules/bootstrap/scss/print" // Pillar components. +@import "font-pillar" + @import "apps_base" @import "components/base" - @import "components/jumbotron" @import "components/alerts" @import "components/navbar" diff --git a/src/styles/plugins/_jstree.sass b/src/styles/plugins/_jstree.sass index 19c6ec74..d6846fff 100644 --- a/src/styles/plugins/_jstree.sass +++ b/src/styles/plugins/_jstree.sass @@ -73,8 +73,14 @@ $tree-color-highlight-background-text: $primary .jstree-icon:empty left: 25px !important - /* Closed Folder */ - // &.jstree-closed + // Invisible element to expand/collapse folders. + &.jstree-open .jstree-icon.jstree-ocl, + &.jstree-closed .jstree-icon.jstree-ocl + float: left + min-width: 30px + opacity: 0 + position: absolute + z-index: 1 /* The text of the last level item */ .jstree-anchor diff --git a/src/styles/theatre.sass b/src/styles/theatre.sass index b6cd72dc..ef3effab 100644 --- a/src/styles/theatre.sass +++ b/src/styles/theatre.sass @@ -26,8 +26,9 @@ // Pillar components. -@import "apps_base" +@import "font-pillar" +@import "apps_base" @import "components/navbar" @import "components/dropdown" @import "components/footer" diff --git a/src/templates/errors/layout.pug b/src/templates/errors/layout.pug index 50ddefb8..adeff825 100644 --- a/src/templates/errors/layout.pug +++ b/src/templates/errors/layout.pug @@ -7,7 +7,6 @@ html(lang="en") link(href="{{ url_for('static_pillar', filename='assets/ico/favicon.png') }}", rel="shortcut icon") link(href="{{ url_for('static_pillar', filename='assets/ico/apple-touch-icon-precomposed.png') }}", rel="icon apple-touch-icon-precomposed", sizes="192x192") - link(href="{{ url_for('static_pillar', filename='assets/css/font-pillar.css') }}", rel="stylesheet") link(href="{{ url_for('static_pillar', filename='assets/css/base.css') }}", rel="stylesheet") link(href='//fonts.googleapis.com/css?family=Roboto:300,400', rel='stylesheet', type='text/css') | {% block head %}{% endblock %} diff --git a/src/templates/layout.pug b/src/templates/layout.pug index 361e5c17..c1d197a4 100644 --- a/src/templates/layout.pug +++ b/src/templates/layout.pug @@ -44,7 +44,6 @@ html(lang="en") | {% block head %}{% endblock %} | {% block css %} - link(href="{{ url_for('static_pillar', filename='assets/css/font-pillar.css') }}", rel="stylesheet") | {% if title == 'blog' %} link(href="{{ url_for('static_pillar', filename='assets/css/blog.css') }}", rel="stylesheet") | {% else %} diff --git a/src/templates/mixins/components.pug b/src/templates/mixins/components.pug index f226b3a5..c950d394 100644 --- a/src/templates/mixins/components.pug +++ b/src/templates/mixins/components.pug @@ -84,20 +84,3 @@ mixin timeline(projectid, sortdirection) //- TODO: Make nicer reuseable placeholder .h3.text-muted.m-auto i.pi-spin.spin - - -//- Category listing (Learn, Libraries, etc). -mixin category_list_item(title, text, url, image) - .row.pb-2.my-2 - .col-md-3 - a(href=url, title=title) - img.img-fluid(alt=title, src=image) - .col-md-9 - a(href=url, title=title) - h3.font-weight-bold - =title - .lead - =text - - if block - block diff --git a/src/templates/nodes/custom/asset/view_theatre_embed.pug b/src/templates/nodes/custom/asset/view_theatre_embed.pug index fdc350dd..ef8188d5 100644 --- a/src/templates/nodes/custom/asset/view_theatre_embed.pug +++ b/src/templates/nodes/custom/asset/view_theatre_embed.pug @@ -42,9 +42,10 @@ a(href="{{ node.short_link }}") {{ node.short_link }} | {% endif %} - comments-tree#comments-embed( - parent-id="{{ node._id }}" - ) + .mx-3 + comments-tree#comments-embed( + parent-id="{{ node._id }}" + ) include ../_scripts diff --git a/src/templates/nodes/custom/page/view_embed.pug b/src/templates/nodes/custom/page/view_embed.pug index 413a167e..5aa8b3cc 100644 --- a/src/templates/nodes/custom/page/view_embed.pug +++ b/src/templates/nodes/custom/page/view_embed.pug @@ -1,4 +1,4 @@ -| {% extends 'projects/landing.html' %} +| {% extends 'projects/view.html' %} include ../../../mixins/components | {% set title = node.properties.url %} @@ -12,7 +12,7 @@ include ../../../mixins/components +nav-secondary-link( href="{{ url_for('nodes.edit', node_id=node._id) }}") i.pi-edit.pr-2 - span Edit Post + span Edit Page | {% endif %} | {% if node.picture %} @@ -21,9 +21,8 @@ include ../../../mixins/components "{{ node.name }}", null, "{{ node.picture.thumbnail('h', api=api) }}", - "{{ node.url }}") -| {% endif %} - + "{{ request.url }}") +| {% else %} .container.pt-5 .row .col-12.text-center @@ -31,6 +30,7 @@ include ../../../mixins/components | {{ node.name }} hr.pb-2 +| {% endif %} .container.pb-5 .row diff --git a/src/templates/nodes/edit.pug b/src/templates/nodes/edit.pug index e8b6d525..76ae0074 100644 --- a/src/templates/nodes/edit.pug +++ b/src/templates/nodes/edit.pug @@ -1,7 +1,7 @@ | {% extends 'projects/view.html' %} | {% block body %} -#project-container.container +#project-container.container.is-sidebar-visible div.page-content | {% include 'nodes/edit_embed.html' %} | {% endblock body %} diff --git a/src/templates/projects/edit_layout.pug b/src/templates/projects/edit_layout.pug index cf6e3012..d7c652ea 100644 --- a/src/templates/projects/edit_layout.pug +++ b/src/templates/projects/edit_layout.pug @@ -10,8 +10,8 @@ include ../mixins/components | {% endblock navigation_tabs %} | {% block body %} -#project-container - #project-side-container +#project-container.is-sidebar-visible + #project-side-container.bg-light #project_nav #project_nav-container diff --git a/src/templates/projects/view_theatre.pug b/src/templates/projects/view_theatre.pug index 6493ddd9..a3677fba 100644 --- a/src/templates/projects/view_theatre.pug +++ b/src/templates/projects/view_theatre.pug @@ -29,14 +29,12 @@ li.nav-item | {% endblock %} | {% block css %} -link(href="{{ url_for('static_pillar', filename='assets/css/font-pillar.css') }}", rel="stylesheet") link(href="{{ url_for('static_pillar', filename='assets/css/theatre.css') }}", rel="stylesheet") | {% endblock %} | {% block body %} #theatre-container.d-flex.position-relative.h-100.overflow-hidden( class="{% if current_user.is_authenticated %}with-info{% endif %}") - | {% endblock %} | {% block footer_scripts %}