Docker/documize
Docker/documize
1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-08-02 20:15:26 +02:00
Code Releases Activity

Revamp document view using new layout

Browse source 
New master page system and UI framework implemented on document view.

Sidebar contains ToC and Attachments.
This commit is contained in:
Harvey Kandola 2018-12-18 19:03:34 +00:00
parent b4b3dbcb4c
commit 7cdf97aa86
27 changed files with 348 additions and 263 deletions
Download patch file Download diff file Expand all files Collapse all files

5
gui/app/styles/core/view/document/document.scss → gui/app/styles/core/view/document/all.scss
View file

@ -2,9 +2,10 @@
@import "copy-move.scss";
@import "doc-meta.scss";
@import "doc-structure.scss";
@import "doc-toc.scss";
@import "section-editor.scss";
@import "view-attachment.scss";
@import "sidebar.scss";
@import "sidebar-toc.scss";
@import "sidebar-attachment.scss";
@import "view-activity.scss";
@import "view-revision.scss";
@import "vote-likes.scss";

67
gui/app/styles/core/view/document/doc-toc.scss
View file

@ -1,67 +0,0 @@
.document-sidebar {
> .document-toc {
@include border-radius(3px);
@include ease-in();
margin: 0;
padding: 0 20px 20px 20px;
display: block;
> .header {
top: 0;
padding-top: 20px;
margin: 0;
> .toc-controls {
margin: 0 0 0 0;
text-align: center;
> .disabled {
cursor: not-allowed !important;
> .material-icons {
color: map-get($gray-shades, 300);
}
}
}
}
> .index-list {
padding: 0;
list-style: none;
font-size: 0.9rem;
overflow-x: hidden;
list-style-type: none;
margin: 0 0 0 0;
.item {
@extend .no-select;
padding: 4px 0;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: nowrap;
overflow: hidden;
> .link {
color: map-get($gray-shades, 800);
font-weight: bold;
&:hover {
color: $color-link;
}
> .numbering {
color: map-get($gray-shades, 600);
font-weight: bold;
display: inline-block;
margin-right: 10px;
}
}
> .selected {
color: $color-link;
}
}
}
}
}

40
gui/app/styles/core/view/document/sidebar-attachment.scss Normal file
View file

@ -0,0 +1,40 @@
.document-sidebar-attachment {
.dz-preview, .dz-processing {
display: none !important;
}
> .files {
margin: 0;
padding: 0;
> .file {
@include card();
list-style-type: none;
margin: 10px 0 0 0;
padding: 5px;
width: 100%;
font-size: 0.9rem;
position: relative;
> a {
display: inline-block;
font-size: 0.9rem;
vertical-align: text-top;
margin-right: 10px;
width: 90%;
@extend .text-truncate;
color: map-get($gray-shades, 800);
&:hover {
color: map-get($gray-shades, 900);
}
}
> .menu {
position: absolute;
right: -10px;
top: 0;
}
}
}
}

63
gui/app/styles/core/view/document/sidebar-toc.scss Normal file
View file

@ -0,0 +1,63 @@
.document-sidebar-toc {
> .controls {
margin: 5px 0 10px 0;
text-align: center;
> .arrow {
margin: 0 5px;
display: inline-block;
> i {
font-size: 2rem;
color: map-get($yellow-shades, 600);
}
}
> .disabled {
cursor: not-allowed !important;
> i {
color: map-get($gray-shades, 400);
}
}
}
> .index-list {
padding: 0;
list-style: none;
font-size: 0.9rem;
overflow-x: hidden;
list-style-type: none;
margin: 0 0 0 0;
.item {
@extend .no-select;
padding: 4px 0;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: nowrap;
overflow: hidden;
> .link {
color: map-get($gray-shades, 800);
font-weight: 400;
&:hover {
color: map-get($yellow-shades, 600);
}
> .numbering {
color: map-get($gray-shades, 600);
font-weight: 500;
display: inline-block;
margin-right: 10px;
}
}
> .selected {
color: map-get($yellow-shades, 600);
font-weight: 600;
}
}
}
}

52
gui/app/styles/core/view/document/sidebar.scss Normal file
View file

@ -0,0 +1,52 @@
.label-approval {
@include border-radius(3px);
@extend .no-select;
display: inline-block;
margin: 10px 5px 13px 0;
padding: 0.3rem 0.7rem;
font-size: 1.1rem;
font-weight: 400;
background-color: map-get($gray-shades, 700);
color: map-get($gray-shades, 100);
text-transform: uppercase;
}
.label-draft {
@include border-radius(3px);
@extend .no-select;
display: inline-block;
margin: 10px 5px 13px 0;
padding: 0.3rem 0.7rem;
font-size: 1.1rem;
font-weight: 400;
background-color: map-get($yellow-shades, 500);
color: map-get($gray-shades, 100);
text-transform: uppercase;
}
.label-live {
@include border-radius(3px);
@extend .no-select;
display: inline-block;
margin: 10px 5px 13px 0;
padding: 0.3rem 0.7rem;
font-size: 1.1rem;
font-weight: 400;
background-color: map-get($green-shades, 500);
color: map-get($gray-shades, 100);
text-transform: uppercase;
}
.label-archived {
@include border-radius(3px);
@extend .no-select;
display: inline-block;
margin: 10px 5px 13px 0;
padding: 0.3rem 0.7rem;
font-size: 1.1rem;
font-weight: 400;
background-color: map-get($red-shades, 300);
color: map-get($gray-shades, 800);
text-transform: uppercase;
}

49
gui/app/styles/core/view/document/view-attachment.scss
View file

@ -1,49 +0,0 @@
.view-attachment {
> .upload-document-files {
@include ease-in();
margin: 50px 0 10px 0;
> .dz-preview, .dz-processing {
display: none !important;
}
}
> .list {
margin: 10px 0 0 0;
padding: 0;
> .item {
margin: 0;
padding: 0;
font-size: 1.1rem;
list-style-type: none;
border-left: 6px solid map-get($gray-shades, 300);
padding-left: 15px;
margin-left: 3px;
> a {
@include ease-in();
display: inline-block;
font-size: 1.1rem;
vertical-align: text-top;
margin-right: 10px;
color: map-get($gray-shades, 600);
&:hover {
color: $color-link;
}
}
> .delete {
display: inline-block;
visibility: hidden;
}
&:hover {
> .delete {
visibility: visible;
}
}
}
}
}