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

[WIP] theme selector

Browse source
This commit is contained in:
Harvey Kandola 2018-11-24 16:13:21 +00:00
parent a7e52809dc
commit 11e164496b
74 changed files with 363 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

132
gui/app/styles/core/view/document/add-section.scss Normal file
View file

@ -0,0 +1,132 @@
.start-section {
@extend .no-select;
background-color: transparent;
position: relative;
cursor: pointer;
font-size: 1.3rem;
> .start-button {
text-align: center;
margin: 30px 0 20px 0;
position: relative;
color: $color-gray-light;
> .cta {
@include ease-in();
font-weight: bold;
letter-spacing: 0.22rem;
&:hover {
color: $color-green;
}
}
}
}
.new-section-wizard {
margin: 0;
padding: 0;
.new-section-caption {
margin: 20px 0 10px 0;
color: $color-primary;
font-size: 1.4rem;
font-weight: bold;
}
.new-section-empty {
font-size: 1.2rem;
color: $color-gray;
}
.preset-list {
margin: 0;
padding: 0;
> .item {
@include ease-in();
@include border-radius(3px);
list-style: none;
cursor: pointer;
display: block;
margin: 0 20px 20px 0;
padding: 12px 0 0 20px;
height: 60px;
border: 1px solid $color-border;
background-color: $color-off-white;
&:hover {
border-color: $color-primary;
background-color: $color-primary-light;
}
.icon {
text-align: center;
display: inline-block;
width: 40px;
margin-right: 10px;
> .img {
text-align: center;
display: inline-block;
height: 30px;
width: 30px;
}
}
> .title {
display: inline-block;
font-size: 1.1rem;
font-weight: 500;
color: $color-off-black;
letter-spacing: 0.5px;
margin-top: 6px;
}
}
}
.block-list {
margin: 0;
padding: 0;
> .item {
@include ease-in();
@include border-radius(3px);
list-style: none;
cursor: pointer;
display: block;
margin: 0 20px 20px 0;
padding: 12px 20px;
width: 100%;
position: relative;
border: 1px solid $color-border;
background-color: $color-off-white;
&:hover {
border-color: $color-primary;
background-color: $color-primary-light;
}
> .actions {
@include ease-in();
position: absolute;
top: 10px;
right: 8px;
}
> .details {
> .title {
font-size: 1.1rem;
font-weight: 500;
color: $color-off-black;
letter-spacing: 0.5px;
}
> .desc {
color: $color-off-black;
font-size: 1rem;
}
}
}
}
}

55
gui/app/styles/core/view/document/copy-move.scss Normal file
View file

@ -0,0 +1,55 @@
.document-copy-move {
> .documents-list {
margin: 0;
padding: 0;
width: 100%;
> .document {
@include ease-in();
margin: 0 0 5px 0;
padding: 10px 15px;
color: $color-gray;
background-color: $color-off-white;
cursor: pointer;
position: relative;
list-style-type: none;
&:hover {
color: $color-black;
}
> .title {
color : $color-off-black;
font-size: 1rem;
}
> .space {
color : $color-gray;
font-size: 0.8rem;
font-style: italic;
font-weight: bold;
margin-bottom: 10px;
}
> .snippet {
color : $color-gray;
font-size: 0.9rem;
}
> .material-icons {
position: absolute;
top: 10px;
right: 10px;
color: $color-white;
}
}
> .selected {
background-color: $color-link !important;
> .title, .space, .snippet {
color: $color-white !important;
}
}
}
}

96
gui/app/styles/core/view/document/doc-meta.scss Normal file
View file

@ -0,0 +1,96 @@
.view-document {
> .document-heading {
.doc-title {
margin: 50px 0 10px;
font-size: 2.2rem;
font-weight: bold;
}
.doc-excerpt {
font-size: 1.2rem;
color: $color-gray;
margin: 0 0 20px;
}
}
}
.document-lifecycle-live {
@include border-radius(3px);
@include ease-in();
display: inline-block;
border: 2px solid $color-green;
padding: 2px 10px;
color: $color-gray;
background-color: $color-off-white;
font-weight: 800;
font-size: 1rem;
&:hover {
color: $color-green;
}
}
.document-lifecycle-draft {
@extend .document-lifecycle-live;
border: 2px solid $color-orange;
&:hover {
color: $color-orange;
}
}
.document-protection-unlocked {
@include border-radius(3px);
@include ease-in();
display: inline-block;
padding: 2px 10px;
font-weight: 800;
font-size: 1rem;
color: $color-gray;
background-color: $color-off-white;
border: 2px solid $color-gray;
&:hover {
color: $color-dark;
}
}
.document-protection-review {
@extend .document-protection-unlocked;
border: 2px solid $color-orange;
&:hover {
color: $color-orange;
}
}
.document-protection-locked {
@extend .document-protection-unlocked;
border: 2px solid $color-red;
&:hover {
color: $color-red;
}
}
.document-category {
display: inline-block;
padding: 2px 10px;
font-weight: 600;
font-size: 1rem;
color: $color-gray;
background-color: $color-off-white;
border: 2px solid $color-gray;
border-left: 13px solid $color-gray;
margin-right: 20px;
}
.document-tag {
display: inline-block;
padding: 2px 0;
font-size: 1.1rem;
font-weight: 600;
font-style: italic;
color: $color-gray;
margin-right: 20px;
}

69
gui/app/styles/core/view/document/doc-structure.scss Normal file
View file

@ -0,0 +1,69 @@
.document-tabnav {
margin: 20px 0 0 0;
padding: 0;
}
.document-structure {
margin: 0 0 0 0;
> .page-header {
margin: 0 0 2rem 0;
> .page-number {
color: $color-gray;
background-color: $color-gray-light2;
padding: 0.2rem 1rem;
font-size: 1.8rem;
margin: 0 1.5rem 0 0;
font-weight: normal;
text-align: center;
display: inline-block;
}
> .page-state-pending {
color: $color-red;
}
> .page-state-review {
color: $color-green;
}
> .page-title {
display: inline;
font-size: 2.0rem;
font-weight: bold;
margin: 16px 0;
color: $color-dark;
}
}
> .protection-table {
> tbody, > thead {
> tr, > th {
> td, > th {
margin: 0;
padding: 10px 15px;
text-align: center;
}
> td:first-child {
text-align: left;
}
}
}
> thead {
> tr {
> th {
background-color: $color-off-white;
color: $color-gray;
}
> th:first-child {
background-color: $color-white !important;
border: none !important;
}
}
}
}
}

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

@ -0,0 +1,67 @@
.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: $color-gray-light;
}
}
}
}
> .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: $color-dark;
font-weight: bold;
&:hover {
color: $color-link;
}
> .numbering {
color: $color-gray;
font-weight: bold;
display: inline-block;
margin-right: 10px;
}
}
> .selected {
color: $color-link;
}
}
}
}
}

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

@ -0,0 +1,11 @@
@import "add-section.scss";
@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 "view-activity.scss";
@import "view-revision.scss";
@import "vote-likes.scss";
@import "wysiwyg.scss";

27
gui/app/styles/core/view/document/section-editor.scss Normal file
View file

@ -0,0 +1,27 @@
.section-editor {
> .edit-title {
margin: 16px 0;
}
> .canvas {
// margin: 34px 0 0 0;
padding: 30px 20px;
box-shadow: 0 0 0 0.75pt $color-stroke,0 0 3pt 0.75pt $color-stroke;
}
}
.content-linker-modal-container {
height: 500px;
overflow-y: auto;
.icon {
margin-right: 5px;
height: 15px;
width: 15px;
}
}
.block-editor {
margin-top: 3rem;
}

64
gui/app/styles/core/view/document/view-activity.scss Normal file
View file

@ -0,0 +1,64 @@
.view-activity {
margin: 50px;
.title {
font-size: 1.8rem;
font-weight: bold;
margin: 0 0 30px 0;
color: $color-gray;
}
> .list {
margin: 0 0 50px 0;
padding: 0;
width: 100%;
> .item {
@include ease-in();
list-style: none;
padding: 10px 0;
margin: 5px 0;
white-space: nowrap;
position: relative;
> .dash {
position: absolute;
top: 19px;
left: -20px;
background-color: $color-border;
height: 3px;
width: 10px;
}
> .spacer {
display: inline-block;
padding-left: 10px;
}
> .details {
@include ease-in();
vertical-align: top;
display: inline-block;
> .doc {
font-size: 1.2rem;
font-weight: normal;
color: $color-off-black;
letter-spacing: 0.5px;
}
> .note {
color: $color-gray;
font-size: 1rem;
margin-top: 2px;
}
}
}
}
> .list-timeline {
border-left: 5px solid $color-border;
padding-left: 20px;
margin-left: 30px;
}
}

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

@ -0,0 +1,49 @@
.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 $color-gray-light;
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: $color-gray;
&:hover {
color: $color-link;
}
}
> .delete {
display: inline-block;
visibility: hidden;
}
&:hover {
> .delete {
visibility: visible;
}
}
}
}
}

16
gui/app/styles/core/view/document/view-revision.scss Normal file
View file

@ -0,0 +1,16 @@
.view-revision {
> .diff-zone {
@extend .transition-all;
@include border-radius(2px);
@include ease-in();
position: relative;
padding: 25px 50px;
box-shadow: 0 0 0 0.75pt $color-stroke,0 0 3pt 0.75pt $color-stroke;
background-color: $color-white;
margin: 50px 0;
> .canvas {
padding: 0;
}
}
}

25
gui/app/styles/core/view/document/vote-likes.scss Normal file
View file

@ -0,0 +1,25 @@
.vote-box {
margin: 50px 0;
padding: 30px 50px;
text-align: center;
max-width: 400px;
border: 1px dotted $color-border;
background: $color-off-white;
@include border-radius(3px);
> .prompt {
font-size: 1.5rem;
font-weight: 600;
color: $color-dark;
}
> .buttons {
margin: 20px 0 0 0;
}
> .ack {
font-size: 1.2rem;
font-weight: 600;
color: $color-green;
}
}

120
gui/app/styles/core/view/document/wysiwyg.scss Normal file
View file

@ -0,0 +1,120 @@
.wysiwyg {
font-size: 17px;
line-height: 25px;
color: $color-off-black;
table {
border: 1px solid $color-border !important;
th {
padding: 5px 7px !important;
border: 1px solid $color-border !important;
background-color: $color-off-white;
}
td {
padding: 5px 7px !important;
border: 1px solid $color-border !important;
p {
margin: 0 !important;
padding: 0 !important;
}
}
}
ol,
ul {
margin: 15px 0;
padding: 0 0 0 40px;
line-height: 20px;
}
ol {
li {
list-style-type: decimal;
line-height: 20px;
}
}
ul {
li {
list-style-type: disc;
line-height: 20px;
}
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: bold;
margin: 16px 0;
color: $color-dark;
}
h1 { font-size: 2.0rem; }
h2 { font-size: 1.8rem; }
h3 { font-size: 1.6rem; }
h4 { font-size: 1.4rem; }
h5 { font-size: 1.3rem; }
h6 { font-size: 1.1rem; }
pre {
background-color: $color-off-white;
padding: 10px;
border: 1px solid $color-border;
@include border-radius(3px);
}
.code-mirror {
background-color: none;
padding: 10px;
border: none;
@include border-radius(0px);
}
.wysiwyg-table {
border: none;
border-collapse: collapse;
empty-cells: show;
max-width: 100% !important;
margin: 0 !important;
.fr-dashed-borders td,
.fr-dashed-borders th {
border-style: dashed;
}
.fr-alternate-rows tbody tr:nth-child(2n) {
background: #f5f5f5;
}
td,
th {
border: 1px solid #f3f5f8;
padding: 5px 7px !important;
}
td:empty,
th:empty {
height: 20px;
}
td.fr-highlighted,
th.fr-highlighted {
border: 1px double red;
}
td.fr-thick,
th.fr-thick {
border-width: 2px;
}
th {
background: #f7f6f6;
}
}
}