mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-01-19 08:42:48 +08:00
Cleaned and organised many css/js files
This commit is contained in:
parent
713827f941
commit
d990c3cec9
|
@ -15,5 +15,5 @@ elixir(function(mix) {
|
||||||
mix.sass('styles.scss');
|
mix.sass('styles.scss');
|
||||||
mix.scripts('image-manager.js', 'public/js/image-manager.js');
|
mix.scripts('image-manager.js', 'public/js/image-manager.js');
|
||||||
mix.scripts('book-dashboard.js', 'public/js/book-dashboard.js');
|
mix.scripts('book-dashboard.js', 'public/js/book-dashboard.js');
|
||||||
mix.scripts('jquery-extensions.js', 'public/js/jquery-extensions.js');
|
mix.scripts(['jquery-extensions.js', 'global.js'], 'public/js/common.js');
|
||||||
});
|
});
|
||||||
|
|
10
resources/assets/js/global.js
Normal file
10
resources/assets/js/global.js
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
$(function () {
|
||||||
|
|
||||||
|
$('.notification').click(function () {
|
||||||
|
$(this).fadeOut(100);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Dropdown toggles
|
||||||
|
$('[data-dropdown]').dropDown();
|
||||||
|
|
||||||
|
});
|
19
resources/assets/js/jquery-extensions.js
vendored
19
resources/assets/js/jquery-extensions.js
vendored
|
@ -1,4 +1,5 @@
|
||||||
|
|
||||||
|
// Smooth scrolling
|
||||||
jQuery.fn.smoothScrollTo = function() {
|
jQuery.fn.smoothScrollTo = function() {
|
||||||
if(this.length === 0) return;
|
if(this.length === 0) return;
|
||||||
$('body').animate({
|
$('body').animate({
|
||||||
|
@ -6,12 +7,15 @@ jQuery.fn.smoothScrollTo = function() {
|
||||||
}, 800); // Adjust to change animations speed (ms)
|
}, 800); // Adjust to change animations speed (ms)
|
||||||
return this;
|
return this;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Making contains text expression not worry about casing
|
||||||
$.expr[":"].contains = $.expr.createPseudo(function(arg) {
|
$.expr[":"].contains = $.expr.createPseudo(function(arg) {
|
||||||
return function( elem ) {
|
return function( elem ) {
|
||||||
return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
|
return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Show a success message after the element it's called upon.
|
||||||
jQuery.fn.showSuccess = function (message) {
|
jQuery.fn.showSuccess = function (message) {
|
||||||
var elem = $(this);
|
var elem = $(this);
|
||||||
var success = $('<div class="text-pos" style="display:none;"><i class="zmdi zmdi-check-circle"></i>' + message + '</div>');
|
var success = $('<div class="text-pos" style="display:none;"><i class="zmdi zmdi-check-circle"></i>' + message + '</div>');
|
||||||
|
@ -25,6 +29,7 @@ jQuery.fn.showSuccess = function (message) {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Show a failure messages from laravel. Searches for the name of the inputs.
|
||||||
jQuery.fn.showFailure = function (messageMap) {
|
jQuery.fn.showFailure = function (messageMap) {
|
||||||
var elem = $(this);
|
var elem = $(this);
|
||||||
$.each(messageMap, function (key, messages) {
|
$.each(messageMap, function (key, messages) {
|
||||||
|
@ -42,6 +47,20 @@ jQuery.fn.showFailure = function (messageMap) {
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Submit the form that the called upon element sits in.
|
||||||
jQuery.fn.submitForm = function() {
|
jQuery.fn.submitForm = function() {
|
||||||
$(this).closest('form').submit();
|
$(this).closest('form').submit();
|
||||||
|
};
|
||||||
|
|
||||||
|
// Dropdown menu display
|
||||||
|
jQuery.fn.dropDown = function() {
|
||||||
|
var container = $(this),
|
||||||
|
menu = container.find('ul');
|
||||||
|
container.find('[data-dropdown-toggle]').on('click', function() {
|
||||||
|
menu.show().addClass('anim menuIn');
|
||||||
|
container.mouseleave(function() {
|
||||||
|
menu.hide();
|
||||||
|
menu.removeClass('anim menuIn');
|
||||||
|
});
|
||||||
|
});
|
||||||
};
|
};
|
|
@ -90,6 +90,12 @@ input[type="text"], input[type="number"], input[type="email"], input[type="searc
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.page-title input {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 1.4em;
|
||||||
|
}
|
||||||
|
|
||||||
.description-input textarea {
|
.description-input textarea {
|
||||||
@extend .inline-input-style;
|
@extend .inline-input-style;
|
||||||
font-size: $fs-m;
|
font-size: $fs-m;
|
||||||
|
|
|
@ -1,4 +1,27 @@
|
||||||
|
|
||||||
|
/** Flexbox styling rules **/
|
||||||
|
body.flexbox {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: stretch;
|
||||||
|
height: 100%;
|
||||||
|
min-height: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
#content {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-fill {
|
||||||
|
display: flex;
|
||||||
|
align-items: stretch;
|
||||||
|
.flex, &.flex {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/** Rules for all columns */
|
/** Rules for all columns */
|
||||||
div[class^="col-"] img {
|
div[class^="col-"] img {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
|
@ -13,6 +36,20 @@ div[class^="col-"] img {
|
||||||
&.fluid {
|
&.fluid {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
&.small {
|
||||||
|
max-width: 840px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-box {
|
||||||
|
margin: 15vh auto 0 auto;
|
||||||
|
padding: $-m $-xxl $-xl*2 $-xxl;
|
||||||
|
max-width: 346px;
|
||||||
|
&.login {
|
||||||
|
background-color: #EEE;
|
||||||
|
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
border: 1px solid #DDD;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.row {
|
.row {
|
||||||
|
@ -29,6 +66,7 @@ div[class^="col-"] img {
|
||||||
|
|
||||||
.block {
|
.block {
|
||||||
display: block;
|
display: block;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inline {
|
.inline {
|
||||||
|
|
185
resources/assets/sass/_header.scss
Normal file
185
resources/assets/sass/_header.scss
Normal file
|
@ -0,0 +1,185 @@
|
||||||
|
/**
|
||||||
|
* Includes the main navigation header and the faded toolbar.
|
||||||
|
*/
|
||||||
|
|
||||||
|
header {
|
||||||
|
display: block;
|
||||||
|
z-index: 2;
|
||||||
|
top: 0;
|
||||||
|
background-color: $primary-dark;
|
||||||
|
color: #fff;
|
||||||
|
.padded {
|
||||||
|
padding: $-m;
|
||||||
|
}
|
||||||
|
border-bottom: 1px solid #DDD;
|
||||||
|
//margin-bottom: $-l;
|
||||||
|
.links {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
margin-right: $-xl;
|
||||||
|
}
|
||||||
|
.links a {
|
||||||
|
display: inline-block;
|
||||||
|
padding: $-l;
|
||||||
|
color: #FFF;
|
||||||
|
&:last-child {
|
||||||
|
padding-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.avatar, .user-name {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.avatar {
|
||||||
|
margin-top: (45px/2);
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.user-name {
|
||||||
|
vertical-align: top;
|
||||||
|
padding-top: 25.5px;
|
||||||
|
padding-left: $-m;
|
||||||
|
display: inline-block;
|
||||||
|
cursor: pointer;
|
||||||
|
i {
|
||||||
|
padding-left: $-xs;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
form.search-box {
|
||||||
|
margin-top: $-l *0.9;
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
text-align: left;
|
||||||
|
input {
|
||||||
|
background-color: transparent;
|
||||||
|
border-radius: 0;
|
||||||
|
border: none;
|
||||||
|
border-bottom: 2px solid #EEE;
|
||||||
|
color: #EEE;
|
||||||
|
padding-right: $-l;
|
||||||
|
outline: 0;
|
||||||
|
}
|
||||||
|
button {
|
||||||
|
vertical-align: top;
|
||||||
|
margin-left: -$-l;
|
||||||
|
color: #FFF;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
display: inline-block;
|
||||||
|
position: absolute;
|
||||||
|
&:hover {
|
||||||
|
color: #FFF;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 1.8em;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 400;
|
||||||
|
padding: $-l $-l $-l 0;
|
||||||
|
vertical-align: top;
|
||||||
|
line-height: 1;
|
||||||
|
&:hover {
|
||||||
|
color: #FFF;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-container {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-container ul {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
margin: $-m 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
list-style: none;
|
||||||
|
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
border-radius: 1px;
|
||||||
|
border: 1px solid #EEE;
|
||||||
|
min-width: 180px;
|
||||||
|
padding: $-xs 0;
|
||||||
|
color: #555;
|
||||||
|
a {
|
||||||
|
display: block;
|
||||||
|
padding: $-xs $-m;
|
||||||
|
color: #555;
|
||||||
|
&:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #EEE;
|
||||||
|
}
|
||||||
|
i {
|
||||||
|
margin-right: $-m;
|
||||||
|
padding-right: 0;
|
||||||
|
display: inline;
|
||||||
|
width: 22px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
li.border-bottom {
|
||||||
|
border-bottom: 1px solid #DDD;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.breadcrumbs span.sep {
|
||||||
|
color: #aaa;
|
||||||
|
padding: 0 $-xs;
|
||||||
|
}
|
||||||
|
|
||||||
|
.faded {
|
||||||
|
a, button, span {
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
.text-button {
|
||||||
|
opacity: 0.5;
|
||||||
|
transition: all ease-in-out 120ms;
|
||||||
|
&:hover {
|
||||||
|
opacity: 1;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.faded-small {
|
||||||
|
color: #000;
|
||||||
|
font-size: 0.9em;
|
||||||
|
background-color: rgba(21, 101, 192, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.breadcrumbs .text-button, .action-buttons .text-button {
|
||||||
|
display: inline-block;
|
||||||
|
padding: $-s;
|
||||||
|
&:last-child {
|
||||||
|
padding-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.action-buttons {
|
||||||
|
text-align: right;
|
||||||
|
&.text-left {
|
||||||
|
text-align: left;
|
||||||
|
.text-button {
|
||||||
|
padding-right: $-m;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-nav {
|
||||||
|
text-align: center;
|
||||||
|
a {
|
||||||
|
padding: $-m;
|
||||||
|
display: inline-block;
|
||||||
|
color: #666;
|
||||||
|
&.selected {
|
||||||
|
border-bottom: 2px solid $primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,10 +1,24 @@
|
||||||
|
.overlay {
|
||||||
|
background-color: rgba(0, 0, 0, 0.2);
|
||||||
|
position: fixed;
|
||||||
|
display: none;
|
||||||
|
z-index: 95536;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
min-width: 100%;
|
||||||
|
min-height: 100%;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.image-manager-body {
|
.image-manager-body {
|
||||||
background-color: #FFF;
|
background-color: #FFF;
|
||||||
max-height: 90%;
|
max-height: 90%;
|
||||||
width: 90%;
|
width: 90%;
|
||||||
height: 90%;
|
height: 90%;
|
||||||
margin: 2% 5%;
|
margin: 2% 5%;
|
||||||
//border: 2px solid $primary;
|
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3);
|
box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
@ -245,7 +259,7 @@
|
||||||
width: 80px;
|
width: 80px;
|
||||||
margin-left: -40px;
|
margin-left: -40px;
|
||||||
background: rgba(255, 255, 255, 0.9);
|
background: rgba(255, 255, 255, 0.9);
|
||||||
-webkit-transform: scale(1);
|
transform: scale(1);
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
overflow: hidden; }
|
overflow: hidden; }
|
||||||
.dz-preview .dz-progress .dz-upload {
|
.dz-preview .dz-progress .dz-upload {
|
198
resources/assets/sass/_lists.scss
Normal file
198
resources/assets/sass/_lists.scss
Normal file
|
@ -0,0 +1,198 @@
|
||||||
|
.page-list {
|
||||||
|
h3 {
|
||||||
|
margin: $-l 0 $-m 0;
|
||||||
|
}
|
||||||
|
a.chapter {
|
||||||
|
color: $color-chapter;
|
||||||
|
}
|
||||||
|
.inset-list {
|
||||||
|
display: block;
|
||||||
|
overflow: hidden;
|
||||||
|
// padding-left: $-m;
|
||||||
|
margin-bottom: $-l;
|
||||||
|
}
|
||||||
|
h4 {
|
||||||
|
display: block;
|
||||||
|
margin: $-s 0 0 0;
|
||||||
|
border-left: 5px solid $color-page;
|
||||||
|
padding: $-xs 0 $-xs $-m;
|
||||||
|
}
|
||||||
|
hr {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
.book-child {
|
||||||
|
padding-left: $-l;
|
||||||
|
&.page {
|
||||||
|
border-left: 5px solid $color-page;
|
||||||
|
}
|
||||||
|
&.chapter {
|
||||||
|
border-left: 5px solid $color-chapter;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.chapter-toggle {
|
||||||
|
cursor: pointer;
|
||||||
|
margin: 0 0 $-l 0;
|
||||||
|
transition: all ease-in-out 180ms;
|
||||||
|
i {
|
||||||
|
transition: all ease-in-out 180ms;
|
||||||
|
transform: rotate(0deg);
|
||||||
|
transform-origin: 25% 50%;
|
||||||
|
}
|
||||||
|
&.open {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
&.open i {
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-nav-list {
|
||||||
|
$nav-indent: $-s;
|
||||||
|
margin-left: 2px;
|
||||||
|
list-style: none;
|
||||||
|
li {
|
||||||
|
//border-left: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
|
padding-left: $-xs;
|
||||||
|
border-left: 2px solid #888;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
li a {
|
||||||
|
color: #555;
|
||||||
|
}
|
||||||
|
.nav-H2 {
|
||||||
|
margin-left: $nav-indent;
|
||||||
|
font-size: 0.95em;
|
||||||
|
}
|
||||||
|
.nav-H3 {
|
||||||
|
margin-left: $nav-indent*2;
|
||||||
|
font-size: 0.90em
|
||||||
|
}
|
||||||
|
.nav-H4 {
|
||||||
|
margin-left: $nav-indent*3;
|
||||||
|
font-size: 0.85em
|
||||||
|
}
|
||||||
|
.nav-H5 {
|
||||||
|
margin-left: $nav-indent*4;
|
||||||
|
font-size: 0.80em
|
||||||
|
}
|
||||||
|
.nav-H6 {
|
||||||
|
margin-left: $nav-indent*5;
|
||||||
|
font-size: 0.75em
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Sidebar list
|
||||||
|
.book-tree {
|
||||||
|
margin-top: $-xl;
|
||||||
|
}
|
||||||
|
.book-tree h4 {
|
||||||
|
padding: $-m $-s 0 $-s;
|
||||||
|
i {
|
||||||
|
padding-right: $-s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.book-tree .sidebar-page-list {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
margin-top: $-xs;
|
||||||
|
border-left: 5px solid $color-book;
|
||||||
|
li a {
|
||||||
|
display: block;
|
||||||
|
border-bottom: none;
|
||||||
|
padding-left: $-s;
|
||||||
|
padding: $-xs 0 $-xs $-s;
|
||||||
|
&:hover {
|
||||||
|
background-color: rgba(255, 255, 255, 0.2);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
li, a {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
a.bold {
|
||||||
|
color: #EEE !important;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.book {
|
||||||
|
color: $color-book !important;
|
||||||
|
&.selected {
|
||||||
|
background-color: rgba($color-book, 0.29);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.chapter {
|
||||||
|
color: $color-chapter !important;
|
||||||
|
&.selected {
|
||||||
|
background-color: rgba($color-chapter, 0.12);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list-item-chapter {
|
||||||
|
border-left: 5px solid $color-chapter;
|
||||||
|
margin: 10px 10px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.list-item-page {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
.page {
|
||||||
|
color: $color-page !important;
|
||||||
|
border-left: 5px solid $color-page;
|
||||||
|
margin: 10px 10px;
|
||||||
|
border-bottom: none;
|
||||||
|
&.selected {
|
||||||
|
background-color: rgba($color-page, 0.1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Sortable Lists
|
||||||
|
.sortable-page-list, .sortable-page-list ul {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
.sortable-page-list {
|
||||||
|
margin-left: 0;
|
||||||
|
box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
ul {
|
||||||
|
margin-bottom: 0;
|
||||||
|
margin-top: 0;
|
||||||
|
box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
border: 1px solid #DDD;
|
||||||
|
padding: $-xs $-s;
|
||||||
|
margin-top: -1px;
|
||||||
|
min-height: 38px;
|
||||||
|
&.text-chapter {
|
||||||
|
border-left: 2px solid $color-chapter;
|
||||||
|
}
|
||||||
|
&.text-page {
|
||||||
|
border-left: 2px solid $color-page;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
li:first-child {
|
||||||
|
margin-top: $-xs;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.sortable-page-list li.placeholder {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.sortable-page-list li.placeholder:before {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.activity-list-item {
|
||||||
|
padding: $-s 0;
|
||||||
|
color: #888;
|
||||||
|
border-bottom: 1px solid #EEE;
|
||||||
|
font-size: 0.9em;
|
||||||
|
.left {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.left + .right {
|
||||||
|
margin-left: 30px + $-s;
|
||||||
|
}
|
||||||
|
}
|
60
resources/assets/sass/_pages.scss
Normal file
60
resources/assets/sass/_pages.scss
Normal file
|
@ -0,0 +1,60 @@
|
||||||
|
.page-editor {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: stretch;
|
||||||
|
.faded-small {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
.edit-area {
|
||||||
|
flex: 1;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-style.editor {
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-content {
|
||||||
|
max-width: 840px;
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
height:auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Link hooks & popovers
|
||||||
|
a.link-hook {
|
||||||
|
position: absolute;
|
||||||
|
display: inline-block;
|
||||||
|
top: $-xs;
|
||||||
|
left: -$-l;
|
||||||
|
padding-bottom: 30px;
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 20px;
|
||||||
|
color: #BBB;
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(10px, 0, 0);
|
||||||
|
transition: all ease-in-out 240ms;
|
||||||
|
background-color: transparent;
|
||||||
|
&:hover {
|
||||||
|
color: $primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
&:hover a.link-hook {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Side Navigation
|
||||||
|
.side-nav {
|
||||||
|
position: fixed;
|
||||||
|
padding-left: $-m;
|
||||||
|
opacity: 0.8;
|
||||||
|
margin-top: $-xxl;
|
||||||
|
margin-left: 0;
|
||||||
|
max-width: 240px;
|
||||||
|
display: none;
|
||||||
|
}
|
|
@ -12,6 +12,9 @@ $m: 800px;
|
||||||
$s: 600px;
|
$s: 600px;
|
||||||
$xs: 400px;
|
$xs: 400px;
|
||||||
$xxs: 360px;
|
$xxs: 360px;
|
||||||
|
$screen-md: 992px;
|
||||||
|
$screen-lg: 1200px;
|
||||||
|
$screen-sm: 768px;
|
||||||
|
|
||||||
// Spacing (Margins+Padding)
|
// Spacing (Margins+Padding)
|
||||||
$-xxxl: 64px;
|
$-xxxl: 64px;
|
||||||
|
|
|
@ -11,437 +11,9 @@
|
||||||
@import "animations";
|
@import "animations";
|
||||||
@import "tinymce";
|
@import "tinymce";
|
||||||
@import "image-manager";
|
@import "image-manager";
|
||||||
|
@import "header";
|
||||||
header {
|
@import "lists";
|
||||||
display: block;
|
@import "pages";
|
||||||
z-index: 2;
|
|
||||||
top: 0;
|
|
||||||
background-color: $primary-dark;
|
|
||||||
color: #fff;
|
|
||||||
.padded {
|
|
||||||
padding: $-m;
|
|
||||||
}
|
|
||||||
border-bottom: 1px solid #DDD;
|
|
||||||
//margin-bottom: $-l;
|
|
||||||
.links {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: top;
|
|
||||||
margin-right: $-xl;
|
|
||||||
}
|
|
||||||
.links a {
|
|
||||||
display: inline-block;
|
|
||||||
padding: $-l;
|
|
||||||
color: #FFF;
|
|
||||||
&:last-child {
|
|
||||||
padding-right: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.avatar, .user-name {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.avatar {
|
|
||||||
margin-top: (45px/2);
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
}
|
|
||||||
.user-name {
|
|
||||||
vertical-align: top;
|
|
||||||
padding-top: 25.5px;
|
|
||||||
padding-left: $-m;
|
|
||||||
display: inline-block;
|
|
||||||
cursor: pointer;
|
|
||||||
i {
|
|
||||||
padding-left: $-xs;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
form.search-box {
|
|
||||||
margin-top: $-l *0.9;
|
|
||||||
display: inline-block;
|
|
||||||
position: relative;
|
|
||||||
input {
|
|
||||||
background-color: transparent;
|
|
||||||
border-radius: 0;
|
|
||||||
border: none;
|
|
||||||
border-bottom: 2px solid #EEE;
|
|
||||||
color: #EEE;
|
|
||||||
padding-right: $-l;
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
vertical-align: top;
|
|
||||||
margin-left: -$-l;
|
|
||||||
color: #FFF;
|
|
||||||
top: 0;
|
|
||||||
display: inline-block;
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#content {
|
|
||||||
display: block;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
body.flexbox {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: stretch;
|
|
||||||
height: 100%;
|
|
||||||
min-height: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
#content {
|
|
||||||
flex: 1;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.flex-fill {
|
|
||||||
display: flex;
|
|
||||||
align-items: stretch;
|
|
||||||
.flex, &.flex {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-editor {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: stretch;
|
|
||||||
.faded-small {
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
.edit-area {
|
|
||||||
flex: 1;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo {
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 1.8em;
|
|
||||||
color: #fff;
|
|
||||||
font-weight: 400;
|
|
||||||
padding: $-l $-l $-l 0;
|
|
||||||
vertical-align: top;
|
|
||||||
line-height: 1;
|
|
||||||
&:hover {
|
|
||||||
color: #FFF;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-title input {
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
font-size: 1.4em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-style {
|
|
||||||
padding: $-s $-xxl $-xxl $-xxl;
|
|
||||||
margin-bottom: $-xxl;
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-style.editor {
|
|
||||||
padding: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-content {
|
|
||||||
@extend .page-style;
|
|
||||||
min-height: 70vh;
|
|
||||||
max-width: 840px;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
&.right {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
&.left {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
max-width: 100%;
|
|
||||||
height:auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-list {
|
|
||||||
h3 {
|
|
||||||
margin: $-l 0 $-m 0;
|
|
||||||
}
|
|
||||||
a.chapter {
|
|
||||||
color: $color-chapter;
|
|
||||||
}
|
|
||||||
.inset-list {
|
|
||||||
display: block;
|
|
||||||
overflow: hidden;
|
|
||||||
// padding-left: $-m;
|
|
||||||
margin-bottom: $-l;
|
|
||||||
}
|
|
||||||
h4 {
|
|
||||||
display: block;
|
|
||||||
margin: $-s 0 0 0;
|
|
||||||
border-left: 5px solid $color-page;
|
|
||||||
padding: $-xs 0 $-xs $-m;
|
|
||||||
}
|
|
||||||
hr {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
.book-child {
|
|
||||||
padding-left: $-l;
|
|
||||||
&.page {
|
|
||||||
border-left: 5px solid $color-page;
|
|
||||||
}
|
|
||||||
&.chapter {
|
|
||||||
border-left: 5px solid $color-chapter;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.chapter-toggle {
|
|
||||||
cursor: pointer;
|
|
||||||
margin: 0 0 $-l 0;
|
|
||||||
transition: all ease-in-out 180ms;
|
|
||||||
i {
|
|
||||||
transition: all ease-in-out 180ms;
|
|
||||||
transform: rotate(0deg);
|
|
||||||
transform-origin: 25% 50%;
|
|
||||||
}
|
|
||||||
&.open {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
&.open i {
|
|
||||||
transform: rotate(90deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.side-nav {
|
|
||||||
position: fixed;
|
|
||||||
padding-left: $-m;
|
|
||||||
opacity: 0.8;
|
|
||||||
margin-top: $-xxl;
|
|
||||||
margin-left: 0;
|
|
||||||
max-width: 240px;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-nav-list {
|
|
||||||
$nav-indent: $-s;
|
|
||||||
margin-left: 2px;
|
|
||||||
list-style: none;
|
|
||||||
li {
|
|
||||||
//border-left: 1px solid rgba(0, 0, 0, 0.1);
|
|
||||||
padding-left: $-xs;
|
|
||||||
border-left: 2px solid #888;
|
|
||||||
margin-bottom: 4px;
|
|
||||||
}
|
|
||||||
li a {
|
|
||||||
color: #555;
|
|
||||||
}
|
|
||||||
.nav-H2 {
|
|
||||||
margin-left: $nav-indent;
|
|
||||||
font-size: 0.95em;
|
|
||||||
}
|
|
||||||
.nav-H3 {
|
|
||||||
margin-left: $nav-indent*2;
|
|
||||||
font-size: 0.90em
|
|
||||||
}
|
|
||||||
.nav-H4 {
|
|
||||||
margin-left: $nav-indent*3;
|
|
||||||
font-size: 0.85em
|
|
||||||
}
|
|
||||||
.nav-H5 {
|
|
||||||
margin-left: $nav-indent*4;
|
|
||||||
font-size: 0.80em
|
|
||||||
}
|
|
||||||
.nav-H6 {
|
|
||||||
margin-left: $nav-indent*5;
|
|
||||||
font-size: 0.75em
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.overlay {
|
|
||||||
background-color: rgba(0, 0, 0, 0.2);
|
|
||||||
position: fixed;
|
|
||||||
display: none;
|
|
||||||
z-index: 95536;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
min-width: 100%;
|
|
||||||
min-height: 100%;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Link hooks & popovers
|
|
||||||
a.link-hook {
|
|
||||||
position: absolute;
|
|
||||||
display: inline-block;
|
|
||||||
top: $-xs;
|
|
||||||
left: -$-l;
|
|
||||||
padding-bottom: 30px;
|
|
||||||
font-size: 20px;
|
|
||||||
line-height: 20px;
|
|
||||||
color: #BBB;
|
|
||||||
opacity: 0;
|
|
||||||
transform: translate3d(10px, 0, 0);
|
|
||||||
transition: all ease-in-out 240ms;
|
|
||||||
background-color: transparent;
|
|
||||||
&:hover {
|
|
||||||
color: $primary;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
|
||||||
&:hover a.link-hook {
|
|
||||||
opacity: 1;
|
|
||||||
transform: translate3d(0, 0, 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.breadcrumbs span.sep {
|
|
||||||
color: #aaa;
|
|
||||||
padding: 0 $-xs;
|
|
||||||
}
|
|
||||||
|
|
||||||
.faded {
|
|
||||||
a, button, span {
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
.text-button {
|
|
||||||
opacity: 0.5;
|
|
||||||
transition: all ease-in-out 120ms;
|
|
||||||
&:hover {
|
|
||||||
opacity: 1;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.faded-small {
|
|
||||||
color: #000;
|
|
||||||
font-size: 0.9em;
|
|
||||||
background-color: rgba(21, 101, 192, 0.15);
|
|
||||||
}
|
|
||||||
|
|
||||||
.breadcrumbs .text-button, .action-buttons .text-button {
|
|
||||||
display: inline-block;
|
|
||||||
padding: $-s;
|
|
||||||
&:last-child {
|
|
||||||
padding-right: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.action-buttons {
|
|
||||||
text-align: right;
|
|
||||||
&.text-left {
|
|
||||||
text-align: left;
|
|
||||||
.text-button {
|
|
||||||
padding-right: $-m;
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.book-tree {
|
|
||||||
margin-top: $-xl;
|
|
||||||
}
|
|
||||||
.book-tree h4 {
|
|
||||||
padding: $-m $-s 0 $-s;
|
|
||||||
i {
|
|
||||||
padding-right: $-s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// Sidebar list
|
|
||||||
.book-tree .sidebar-page-list {
|
|
||||||
list-style: none;
|
|
||||||
margin: 0;
|
|
||||||
margin-top: $-xs;
|
|
||||||
border-left: 5px solid $color-book;
|
|
||||||
li a {
|
|
||||||
display: block;
|
|
||||||
border-bottom: none;
|
|
||||||
padding-left: $-s;
|
|
||||||
padding: $-xs 0 $-xs $-s;
|
|
||||||
&:hover {
|
|
||||||
background-color: rgba(255, 255, 255, 0.2);
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
li, a {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
a.bold {
|
|
||||||
color: #EEE !important;
|
|
||||||
}
|
|
||||||
ul {
|
|
||||||
list-style: none;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
.book {
|
|
||||||
color: $color-book !important;
|
|
||||||
&.selected {
|
|
||||||
background-color: rgba($color-book, 0.29);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.chapter {
|
|
||||||
color: $color-chapter !important;
|
|
||||||
&.selected {
|
|
||||||
background-color: rgba($color-chapter, 0.12);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.list-item-chapter {
|
|
||||||
border-left: 5px solid $color-chapter;
|
|
||||||
margin: 10px 10px;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.list-item-page {
|
|
||||||
border-bottom: none;
|
|
||||||
}
|
|
||||||
.page {
|
|
||||||
color: $color-page !important;
|
|
||||||
border-left: 5px solid $color-page;
|
|
||||||
margin: 10px 10px;
|
|
||||||
border-bottom: none;
|
|
||||||
&.selected {
|
|
||||||
background-color: rgba($color-page, 0.1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Sortable Lists
|
|
||||||
.sortable-page-list, .sortable-page-list ul {
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
.sortable-page-list {
|
|
||||||
margin-left: 0;
|
|
||||||
box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
ul {
|
|
||||||
margin-bottom: 0;
|
|
||||||
margin-top: 0;
|
|
||||||
box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
li {
|
|
||||||
border: 1px solid #DDD;
|
|
||||||
padding: $-xs $-s;
|
|
||||||
margin-top: -1px;
|
|
||||||
min-height: 38px;
|
|
||||||
&.text-chapter {
|
|
||||||
border-left: 2px solid $color-chapter;
|
|
||||||
}
|
|
||||||
&.text-page {
|
|
||||||
border-left: 2px solid $color-page;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
li:first-child {
|
|
||||||
margin-top: $-xs;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Jquery Sortable Styles
|
// Jquery Sortable Styles
|
||||||
.dragged {
|
.dragged {
|
||||||
|
@ -449,46 +21,16 @@ h1, h2, h3, h4, h5, h6 {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
z-index: 2000;
|
z-index: 2000;
|
||||||
}
|
}
|
||||||
|
|
||||||
body.dragging, body.dragging * {
|
body.dragging, body.dragging * {
|
||||||
cursor: move !important;
|
cursor: move !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sortable-page-list li.placeholder {
|
// User Avatar Images
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.sortable-page-list li.placeholder:before {
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center-box {
|
|
||||||
margin: 15vh auto 0 auto;
|
|
||||||
padding: $-m $-xxl $-xl*2 $-xxl;
|
|
||||||
max-width: 346px;
|
|
||||||
&.login {
|
|
||||||
background-color: #EEE;
|
|
||||||
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
border: 1px solid #DDD;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.activity-list-item {
|
|
||||||
padding: $-s 0;
|
|
||||||
color: #888;
|
|
||||||
border-bottom: 1px solid #EEE;
|
|
||||||
font-size: 0.9em;
|
|
||||||
.left {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
.left + .right {
|
|
||||||
margin-left: 30px + $-s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar {
|
.avatar {
|
||||||
border-radius: 100%;
|
border-radius: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// System wide notifications
|
||||||
.notification {
|
.notification {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
@ -498,7 +40,7 @@ body.dragging, body.dragging * {
|
||||||
background-color: #EEE;
|
background-color: #EEE;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
box-shadow: $bs-med;
|
box-shadow: $bs-med;
|
||||||
z-index: 99999999;
|
z-index: 999999;
|
||||||
display: table;
|
display: table;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
max-width: 480px;
|
max-width: 480px;
|
||||||
|
@ -522,59 +64,7 @@ body.dragging, body.dragging * {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.setting-nav {
|
// Search results
|
||||||
text-align: center;
|
|
||||||
a {
|
|
||||||
padding: $-m;
|
|
||||||
display: inline-block;
|
|
||||||
//color: #666;
|
|
||||||
&.selected {
|
|
||||||
//color: $primary;
|
|
||||||
border-bottom: 2px solid $primary;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-container {
|
|
||||||
display: inline-block;
|
|
||||||
vertical-align: top;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
ul.dropdown {
|
|
||||||
display: none;
|
|
||||||
position: absolute;
|
|
||||||
z-index: 999;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
margin: $-m 0;
|
|
||||||
background-color: #FFFFFF;
|
|
||||||
list-style: none;
|
|
||||||
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
|
|
||||||
border-radius: 1px;
|
|
||||||
border: 1px solid #EEE;
|
|
||||||
min-width: 180px;
|
|
||||||
padding: $-xs 0;
|
|
||||||
color: #555;
|
|
||||||
a {
|
|
||||||
display: block;
|
|
||||||
padding: $-xs $-m;
|
|
||||||
color: #555;
|
|
||||||
&:hover {
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #EEE;
|
|
||||||
}
|
|
||||||
i {
|
|
||||||
margin-right: $-m;
|
|
||||||
padding-right: 0;
|
|
||||||
display: inline;
|
|
||||||
width: 22px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
li.border-bottom {
|
|
||||||
border-bottom: 1px solid #DDD;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-results > h3 a {
|
.search-results > h3 a {
|
||||||
font-size: 0.66em;
|
font-size: 0.66em;
|
||||||
color: $primary;
|
color: $primary;
|
||||||
|
|
|
@ -14,10 +14,9 @@
|
||||||
|
|
||||||
<!-- Scripts -->
|
<!-- Scripts -->
|
||||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
|
||||||
<script src="/js/jquery-extensions.js"></script>
|
|
||||||
<script src="/bower/bootstrap/dist/js/bootstrap.js"></script>
|
|
||||||
<script src="/bower/jquery-sortable/source/js/jquery-sortable.js"></script>
|
<script src="/bower/jquery-sortable/source/js/jquery-sortable.js"></script>
|
||||||
<script src="/bower/dropzone/dist/min/dropzone.min.js"></script>
|
<script src="/bower/dropzone/dist/min/dropzone.min.js"></script>
|
||||||
|
<script src="/js/common.js"></script>
|
||||||
<script src="/bower/vue/dist/vue.min.js"></script>
|
<script src="/bower/vue/dist/vue.min.js"></script>
|
||||||
<script src="/bower/vue-resource/dist/vue-resource.min.js"></script>
|
<script src="/bower/vue-resource/dist/vue-resource.min.js"></script>
|
||||||
|
|
||||||
|
@ -40,16 +39,16 @@
|
||||||
<header id="header">
|
<header id="header">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-3">
|
<div class="col-md-4">
|
||||||
<a href="/" class="logo">{{ Setting::get('app-name', 'BookStack') }}</a>
|
<a href="/" class="logo">{{ Setting::get('app-name', 'BookStack') }}</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-3 text-right">
|
<div class="col-md-4 text-center">
|
||||||
<form action="/search/all" method="GET" class="search-box">
|
<form action="/search/all" method="GET" class="search-box">
|
||||||
<input type="text" name="term" tabindex="2" value="{{ isset($searchTerm) ? $searchTerm : '' }}">
|
<input type="text" name="term" tabindex="2" value="{{ isset($searchTerm) ? $searchTerm : '' }}">
|
||||||
<a onclick="$(this).closest('form').submit();"><i class="zmdi zmdi-search"></i></a>
|
<button class="text-button"><i class="zmdi zmdi-search"></i></button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-6">
|
<div class="col-md-4">
|
||||||
<div class="float right">
|
<div class="float right">
|
||||||
<div class="links text-center">
|
<div class="links text-center">
|
||||||
<a href="/books"><i class="zmdi zmdi-book"></i>Books</a>
|
<a href="/books"><i class="zmdi zmdi-book"></i>Books</a>
|
||||||
|
@ -63,7 +62,7 @@
|
||||||
<span class="user-name" data-dropdown-toggle>
|
<span class="user-name" data-dropdown-toggle>
|
||||||
{{ $currentUser->name }} <i class="zmdi zmdi-caret-down"></i>
|
{{ $currentUser->name }} <i class="zmdi zmdi-caret-down"></i>
|
||||||
</span>
|
</span>
|
||||||
<ul class="dropdown">
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
<a href="/users/{{$currentUser->id}}" class="text-primary"><i class="zmdi zmdi-edit zmdi-hc-lg"></i>Edit Profile</a>
|
<a href="/users/{{$currentUser->id}}" class="text-primary"><i class="zmdi zmdi-edit zmdi-hc-lg"></i>Edit Profile</a>
|
||||||
</li>
|
</li>
|
||||||
|
@ -80,32 +79,10 @@
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<section id="content">
|
<section id="content" class="block">
|
||||||
@yield('content')
|
@yield('content')
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
@yield('bottom')
|
@yield('bottom')
|
||||||
<script>
|
|
||||||
$(function() {
|
|
||||||
|
|
||||||
$('.notification').click(function() {
|
|
||||||
$(this).fadeOut(100);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Dropdown toggles
|
|
||||||
$('[data-dropdown-toggle]').click(function() {
|
|
||||||
var toggleButton = $(this);
|
|
||||||
var container = toggleButton.closest('[data-dropdown]');
|
|
||||||
var dropdown = container.find('.dropdown');
|
|
||||||
dropdown.show().addClass('anim menuIn');
|
|
||||||
|
|
||||||
container.mouseleave(function() {
|
|
||||||
dropdown.hide();
|
|
||||||
dropdown.removeClass('anim menuIn');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Create New Book</h1>
|
<h1>Create New Book</h1>
|
||||||
<form action="/books" method="POST">
|
<form action="/books" method="POST">
|
||||||
@include('books/form')
|
@include('books/form')
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Delete Book</h1>
|
<h1>Delete Book</h1>
|
||||||
<p>This will delete the book with the name '{{$book->name}}', All pages and chapters will be removed.</p>
|
<p>This will delete the book with the name '{{$book->name}}', All pages and chapters will be removed.</p>
|
||||||
<p class="text-neg">Are you sure you want to delete this book?</p>
|
<p class="text-neg">Are you sure you want to delete this book?</p>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Edit Book</h1>
|
<h1>Edit Book</h1>
|
||||||
<form action="/books/{{$book->slug}}" method="POST">
|
<form action="/books/{{$book->slug}}" method="POST">
|
||||||
<input type="hidden" name="_method" value="PUT">
|
<input type="hidden" name="_method" value="PUT">
|
||||||
|
|
|
@ -24,10 +24,7 @@
|
||||||
<h1>Books</h1>
|
<h1>Books</h1>
|
||||||
@if(count($books) > 0)
|
@if(count($books) > 0)
|
||||||
@foreach($books as $book)
|
@foreach($books as $book)
|
||||||
<div class="book">
|
@include('books/list-item', ['book' => $book])
|
||||||
<h3><a href="{{$book->getUrl()}}">{{$book->name}}</a></h3>
|
|
||||||
<p class="text-muted">{{$book->description}}</p>
|
|
||||||
</div>
|
|
||||||
<hr>
|
<hr>
|
||||||
@endforeach
|
@endforeach
|
||||||
@else
|
@else
|
||||||
|
|
4
resources/views/books/list-item.blade.php
Normal file
4
resources/views/books/list-item.blade.php
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
<div class="book">
|
||||||
|
<h3 class="text-book"><a class="text-book" href="{{$book->getUrl()}}"><i class="zmdi zmdi-book"></i>{{$book->name}}</a></h3>
|
||||||
|
<p class="text-muted">{{$book->description}}</p>
|
||||||
|
</div>
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Create New Chapter</h1>
|
<h1>Create New Chapter</h1>
|
||||||
<form action="{{$book->getUrl()}}/chapter/create" method="POST">
|
<form action="{{$book->getUrl()}}/chapter/create" method="POST">
|
||||||
@include('chapters/form')
|
@include('chapters/form')
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Delete Chapter</h1>
|
<h1>Delete Chapter</h1>
|
||||||
<p>This will delete the chapter with the name '{{$chapter->name}}', All pages will be removed
|
<p>This will delete the chapter with the name '{{$chapter->name}}', All pages will be removed
|
||||||
and added directly to the book.</p>
|
and added directly to the book.</p>
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Edit Chapter</h1>
|
<h1>Edit Chapter</h1>
|
||||||
<form action="{{$chapter->getUrl()}}" method="POST">
|
<form action="{{$chapter->getUrl()}}" method="POST">
|
||||||
<input type="hidden" name="_method" value="PUT">
|
<input type="hidden" name="_method" value="PUT">
|
||||||
|
|
|
@ -30,50 +30,48 @@
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-3">
|
<div class="col-md-8">
|
||||||
@include('pages/sidebar-tree-list', ['book' => $book])
|
<h1>{{ $chapter->name }}</h1>
|
||||||
</div>
|
<p class="text-muted">{{ $chapter->description }}</p>
|
||||||
<div class="col-md-9">
|
|
||||||
<div class="page-content">
|
|
||||||
<h1>{{ $chapter->name }}</h1>
|
|
||||||
<p class="text-muted">{{ $chapter->description }}</p>
|
|
||||||
|
|
||||||
@if(count($chapter->pages) > 0)
|
@if(count($chapter->pages) > 0)
|
||||||
<div class="page-list">
|
<div class="page-list">
|
||||||
|
<hr>
|
||||||
|
@foreach($chapter->pages as $page)
|
||||||
|
<div >
|
||||||
|
<h3>
|
||||||
|
<a href="{{ $page->getUrl() }}">
|
||||||
|
<i class="zmdi zmdi-file-text"></i>{{ $page->name }}
|
||||||
|
</a>
|
||||||
|
</h3>
|
||||||
|
<p class="text-muted">
|
||||||
|
{{$page->getExcerpt(180)}}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
@foreach($chapter->pages as $page)
|
@endforeach
|
||||||
<div >
|
</div>
|
||||||
<h3>
|
@else
|
||||||
<a href="{{ $page->getUrl() }}">
|
<hr>
|
||||||
<i class="zmdi zmdi-file-text"></i>{{ $page->name }}
|
<p class="text-muted">No pages are currently in this chapter.</p>
|
||||||
</a>
|
<p>
|
||||||
</h3>
|
<a href="{{$chapter->getUrl() . '/create-page'}}" class="text-page"><i class="zmdi zmdi-file-text"></i>Create a new page</a>
|
||||||
<p class="text-muted">
|
<em class="text-muted">-or-</em>
|
||||||
{{$page->getExcerpt(180)}}
|
<a href="{{$book->getUrl() . '/sort'}}" class="text-book"><i class="zmdi zmdi-book"></i>Sort the current book</a>
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<hr>
|
|
||||||
@endforeach
|
|
||||||
</div>
|
|
||||||
@else
|
|
||||||
<hr>
|
|
||||||
<p class="text-muted">No pages are currently in this chapter.</p>
|
|
||||||
<p>
|
|
||||||
<a href="{{$chapter->getUrl() . '/create-page'}}" class="text-page"><i class="zmdi zmdi-file-text"></i>Create a new page</a>
|
|
||||||
<em class="text-muted">-or-</em>
|
|
||||||
<a href="{{$book->getUrl() . '/sort'}}" class="text-book"><i class="zmdi zmdi-book"></i>Sort the current book</a>
|
|
||||||
</p>
|
|
||||||
<hr>
|
|
||||||
@endif
|
|
||||||
|
|
||||||
<p class="text-muted small">
|
|
||||||
Created {{$chapter->created_at->diffForHumans()}} @if($chapter->createdBy) by {{$chapter->createdBy->name}} @endif
|
|
||||||
<br>
|
|
||||||
Last Updated {{$chapter->updated_at->diffForHumans()}} @if($chapter->createdBy) by {{$chapter->updatedBy->name}} @endif
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
<hr>
|
||||||
|
@endif
|
||||||
|
|
||||||
|
<p class="text-muted small">
|
||||||
|
Created {{$chapter->created_at->diffForHumans()}} @if($chapter->createdBy) by {{$chapter->createdBy->name}} @endif
|
||||||
|
<br>
|
||||||
|
Last Updated {{$chapter->updated_at->diffForHumans()}} @if($chapter->createdBy) by {{$chapter->updatedBy->name}} @endif
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="col-md-3 col-md-offset-1">
|
||||||
|
@include('pages/sidebar-tree-list', ['book' => $book])
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -9,10 +9,7 @@
|
||||||
<h2>Books</h2>
|
<h2>Books</h2>
|
||||||
@if(count($books) > 0)
|
@if(count($books) > 0)
|
||||||
@foreach($books as $book)
|
@foreach($books as $book)
|
||||||
<div class="book">
|
@include('books/list-item', ['book' => $book])
|
||||||
<h3><a href="{{$book->getUrl()}}">{{$book->name}}</a></h3>
|
|
||||||
<p class="text-muted">{{$book->description}}</p>
|
|
||||||
</div>
|
|
||||||
<hr>
|
<hr>
|
||||||
@endforeach
|
@endforeach
|
||||||
@else
|
@else
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Delete Page</h1>
|
<h1>Delete Page</h1>
|
||||||
<p class="text-neg">Are you sure you want to delete this page?</p>
|
<p class="text-neg">Are you sure you want to delete this page?</p>
|
||||||
|
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Page Revisions <span class="subheader">For "{{ $page->name }}"</span></h1>
|
<h1>Page Revisions <span class="subheader">For "{{ $page->name }}"</span></h1>
|
||||||
|
|
||||||
@if(count($page->revisions) > 0)
|
@if(count($page->revisions) > 0)
|
||||||
|
|
|
@ -35,14 +35,6 @@
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-3">
|
|
||||||
@include('pages/sidebar-tree-list', ['book' => $book])
|
|
||||||
<div class="side-nav faded">
|
|
||||||
<h4>Page Navigation</h4>
|
|
||||||
<ul class="page-nav-list">
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-9">
|
<div class="col-md-9">
|
||||||
<div class="page-content anim fadeIn">
|
<div class="page-content anim fadeIn">
|
||||||
@include('pages/page-display')
|
@include('pages/page-display')
|
||||||
|
@ -54,6 +46,14 @@
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="col-md-3">
|
||||||
|
@include('pages/sidebar-tree-list', ['book' => $book])
|
||||||
|
<div class="side-nav faded">
|
||||||
|
<h4>Page Navigation</h4>
|
||||||
|
<ul class="page-nav-list">
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Sorting Pages & Chapters<span class="subheader">For {{ $book->name }}</span></h1>
|
<h1>Sorting Pages & Chapters<span class="subheader">For {{ $book->name }}</span></h1>
|
||||||
|
|
||||||
<ul class="sortable-page-list" id="sort-list">
|
<ul class="sortable-page-list" id="sort-list">
|
||||||
|
|
|
@ -4,25 +4,26 @@
|
||||||
|
|
||||||
@include('settings/navbar', ['selected' => 'settings'])
|
@include('settings/navbar', ['selected' => 'settings'])
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Settings</h1>
|
|
||||||
|
|
||||||
<form action="/settings" method="POST">
|
<h1>Settings</h1>
|
||||||
{!! csrf_field() !!}
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="setting-app-name">Application Name</label>
|
|
||||||
<input type="text" value="{{ Setting::get('app-name') }}" name="setting-app-name" id="setting-app-name">
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="setting-app-public">Allow public viewing?</label>
|
|
||||||
<label><input type="radio" name="setting-app-public" @if(Setting::get('app-public') == 'true') checked @endif value="true"> Yes</label>
|
|
||||||
<label><input type="radio" name="setting-app-public" @if(Setting::get('app-public') == 'false') checked @endif value="false"> No</label>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<button type="submit" class="button pos">Update Settings</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
|
|
||||||
</div>
|
<form action="/settings" method="POST">
|
||||||
|
{!! csrf_field() !!}
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="setting-app-name">Application Name</label>
|
||||||
|
<input type="text" value="{{ Setting::get('app-name') }}" name="setting-app-name" id="setting-app-name">
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="setting-app-public">Allow public viewing?</label>
|
||||||
|
<label><input type="radio" name="setting-app-public" @if(Setting::get('app-public') == 'true') checked @endif value="true"> Yes</label>
|
||||||
|
<label><input type="radio" name="setting-app-public" @if(Setting::get('app-public') == 'false') checked @endif value="false"> No</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<button type="submit" class="button pos">Update Settings</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
@stop
|
@stop
|
|
@ -3,7 +3,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Create User</h1>
|
<h1>Create User</h1>
|
||||||
|
|
||||||
<form action="/users/create" method="post">
|
<form action="/users/create" method="post">
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
<h1>Delete User</h1>
|
<h1>Delete User</h1>
|
||||||
<p>This will fully delete this user with the name '<span class="text-neg">{{$user->name}}</span>' from the system.</p>
|
<p>This will fully delete this user with the name '<span class="text-neg">{{$user->name}}</span>' from the system.</p>
|
||||||
<p class="text-neg">Are you sure you want to delete this user?</p>
|
<p class="text-neg">Are you sure you want to delete this user?</p>
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="page-content">
|
<div class="container small">
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-6">
|
<div class="col-md-6">
|
||||||
|
|
|
@ -5,7 +5,8 @@
|
||||||
|
|
||||||
@include('settings/navbar', ['selected' => 'users'])
|
@include('settings/navbar', ['selected' => 'users'])
|
||||||
|
|
||||||
<div class="page-content">
|
|
||||||
|
<div class="container small">
|
||||||
<h1>Users</h1>
|
<h1>Users</h1>
|
||||||
@if($currentUser->can('user-create'))
|
@if($currentUser->can('user-create'))
|
||||||
<p>
|
<p>
|
||||||
|
@ -25,9 +26,9 @@
|
||||||
<td>
|
<td>
|
||||||
@if($currentUser->can('user-update') || $currentUser->id == $user->id)
|
@if($currentUser->can('user-update') || $currentUser->id == $user->id)
|
||||||
<a href="/users/{{$user->id}}">
|
<a href="/users/{{$user->id}}">
|
||||||
@endif
|
@endif
|
||||||
{{$user->name}}
|
{{$user->name}}
|
||||||
@if($currentUser->can('user-update') || $currentUser->id == $user->id)
|
@if($currentUser->can('user-update') || $currentUser->id == $user->id)
|
||||||
</a>
|
</a>
|
||||||
@endif
|
@endif
|
||||||
</td>
|
</td>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user