diff --git a/gulpfile.js b/gulpfile.js
index 7092e6ff8..1494c2a5b 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -15,5 +15,5 @@ elixir(function(mix) {
mix.sass('styles.scss');
mix.scripts('image-manager.js', 'public/js/image-manager.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');
});
diff --git a/resources/assets/js/global.js b/resources/assets/js/global.js
new file mode 100644
index 000000000..884727e45
--- /dev/null
+++ b/resources/assets/js/global.js
@@ -0,0 +1,10 @@
+$(function () {
+
+ $('.notification').click(function () {
+ $(this).fadeOut(100);
+ });
+
+ // Dropdown toggles
+ $('[data-dropdown]').dropDown();
+
+});
\ No newline at end of file
diff --git a/resources/assets/js/jquery-extensions.js b/resources/assets/js/jquery-extensions.js
index f4302b12b..bda36f5e6 100644
--- a/resources/assets/js/jquery-extensions.js
+++ b/resources/assets/js/jquery-extensions.js
@@ -1,4 +1,5 @@
+// Smooth scrolling
jQuery.fn.smoothScrollTo = function() {
if(this.length === 0) return;
$('body').animate({
@@ -6,12 +7,15 @@ jQuery.fn.smoothScrollTo = function() {
}, 800); // Adjust to change animations speed (ms)
return this;
};
+
+// Making contains text expression not worry about casing
$.expr[":"].contains = $.expr.createPseudo(function(arg) {
return function( elem ) {
return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
};
});
+// Show a success message after the element it's called upon.
jQuery.fn.showSuccess = function (message) {
var elem = $(this);
var success = $('' + message + '
');
@@ -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) {
var elem = $(this);
$.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() {
$(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');
+ });
+ });
};
\ No newline at end of file
diff --git a/resources/assets/sass/_forms.scss b/resources/assets/sass/_forms.scss
index 9536b93f3..59ce23da9 100644
--- a/resources/assets/sass/_forms.scss
+++ b/resources/assets/sass/_forms.scss
@@ -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 {
@extend .inline-input-style;
font-size: $fs-m;
diff --git a/resources/assets/sass/_grid.scss b/resources/assets/sass/_grid.scss
index 72158f632..76ee7c591 100644
--- a/resources/assets/sass/_grid.scss
+++ b/resources/assets/sass/_grid.scss
@@ -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 */
div[class^="col-"] img {
max-width: 100%;
@@ -13,6 +36,20 @@ div[class^="col-"] img {
&.fluid {
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 {
@@ -29,6 +66,7 @@ div[class^="col-"] img {
.block {
display: block;
+ position: relative;
}
.inline {
diff --git a/resources/assets/sass/_header.scss b/resources/assets/sass/_header.scss
new file mode 100644
index 000000000..14a9626ed
--- /dev/null
+++ b/resources/assets/sass/_header.scss
@@ -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;
+ }
+ }
+}
\ No newline at end of file
diff --git a/resources/assets/sass/image-manager.scss b/resources/assets/sass/_image-manager.scss
similarity index 96%
rename from resources/assets/sass/image-manager.scss
rename to resources/assets/sass/_image-manager.scss
index 4e9ce7053..954e10ac0 100644
--- a/resources/assets/sass/image-manager.scss
+++ b/resources/assets/sass/_image-manager.scss
@@ -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 {
background-color: #FFF;
max-height: 90%;
width: 90%;
height: 90%;
margin: 2% 5%;
- //border: 2px solid $primary;
border-radius: 4px;
box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3);
overflow: hidden;
@@ -245,7 +259,7 @@
width: 80px;
margin-left: -40px;
background: rgba(255, 255, 255, 0.9);
- -webkit-transform: scale(1);
+ transform: scale(1);
border-radius: 8px;
overflow: hidden; }
.dz-preview .dz-progress .dz-upload {
diff --git a/resources/assets/sass/_lists.scss b/resources/assets/sass/_lists.scss
new file mode 100644
index 000000000..05dadce86
--- /dev/null
+++ b/resources/assets/sass/_lists.scss
@@ -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;
+ }
+}
\ No newline at end of file
diff --git a/resources/assets/sass/_pages.scss b/resources/assets/sass/_pages.scss
new file mode 100644
index 000000000..c7d41a5d9
--- /dev/null
+++ b/resources/assets/sass/_pages.scss
@@ -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;
+}
\ No newline at end of file
diff --git a/resources/assets/sass/_variables.scss b/resources/assets/sass/_variables.scss
index d3b75cd11..b2a88cb51 100644
--- a/resources/assets/sass/_variables.scss
+++ b/resources/assets/sass/_variables.scss
@@ -12,6 +12,9 @@ $m: 800px;
$s: 600px;
$xs: 400px;
$xxs: 360px;
+$screen-md: 992px;
+$screen-lg: 1200px;
+$screen-sm: 768px;
// Spacing (Margins+Padding)
$-xxxl: 64px;
diff --git a/resources/assets/sass/styles.scss b/resources/assets/sass/styles.scss
index 1c9f92d4f..350dea5ce 100644
--- a/resources/assets/sass/styles.scss
+++ b/resources/assets/sass/styles.scss
@@ -11,437 +11,9 @@
@import "animations";
@import "tinymce";
@import "image-manager";
-
-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;
- 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;
- }
-}
+@import "header";
+@import "lists";
+@import "pages";
// Jquery Sortable Styles
.dragged {
@@ -449,46 +21,16 @@ h1, h2, h3, h4, h5, h6 {
opacity: 0.5;
z-index: 2000;
}
-
body.dragging, body.dragging * {
cursor: move !important;
}
-.sortable-page-list li.placeholder {
- 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;
- }
-}
-
+// User Avatar Images
.avatar {
border-radius: 100%;
}
+// System wide notifications
.notification {
position: fixed;
top: 0;
@@ -498,7 +40,7 @@ body.dragging, body.dragging * {
background-color: #EEE;
border-radius: 3px;
box-shadow: $bs-med;
- z-index: 99999999;
+ z-index: 999999;
display: table;
cursor: pointer;
max-width: 480px;
@@ -522,59 +64,7 @@ body.dragging, body.dragging * {
}
}
-.setting-nav {
- 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
.search-results > h3 a {
font-size: 0.66em;
color: $primary;
diff --git a/resources/views/base.blade.php b/resources/views/base.blade.php
index 3c692317f..76447b5f5 100644
--- a/resources/views/base.blade.php
+++ b/resources/views/base.blade.php
@@ -14,10 +14,9 @@
-
-
+
@@ -40,16 +39,16 @@