mirror of
https://github.com/documize/community.git
synced 2025-07-24 23:59:47 +02:00
Improve Print & PDF rendering
Tweaked CSS for more compact format utilizing print real estate.
This commit is contained in:
parent
3e1ee64e6f
commit
c3c4e9820e
5 changed files with 712 additions and 679 deletions
File diff suppressed because one or more lines are too long
2
gui/app/styles/bootstrap.scss
vendored
2
gui/app/styles/bootstrap.scss
vendored
|
@ -77,7 +77,6 @@ $link-decoration: none;
|
||||||
$link-hover-color: darken($link-color, 15%) !default;
|
$link-hover-color: darken($link-color, 15%) !default;
|
||||||
$link-hover-decoration: none;
|
$link-hover-decoration: none;
|
||||||
|
|
||||||
|
|
||||||
//
|
//
|
||||||
// Bootstrap includes
|
// Bootstrap includes
|
||||||
//
|
//
|
||||||
|
@ -102,6 +101,7 @@ $link-hover-decoration: none;
|
||||||
@import "node_modules/bootstrap/scss/tables";
|
@import "node_modules/bootstrap/scss/tables";
|
||||||
@import "node_modules/bootstrap/scss/badge";
|
@import "node_modules/bootstrap/scss/badge";
|
||||||
|
|
||||||
|
// Boostrap overrides
|
||||||
|
|
||||||
.modal-80 {
|
.modal-80 {
|
||||||
max-width: 80% !important;
|
max-width: 80% !important;
|
||||||
|
|
|
@ -41,6 +41,9 @@
|
||||||
min-height: initial !important;
|
min-height: initial !important;
|
||||||
-webkit-print-color-adjust: exact;
|
-webkit-print-color-adjust: exact;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
margin: 0 !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
min-width: 768px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.non-printable,
|
.non-printable,
|
||||||
|
@ -66,21 +69,51 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.document-heading {
|
.document-heading {
|
||||||
text-align: center !important;
|
text-align: left !important;
|
||||||
padding: 20px 20px 20px 20px !important;
|
padding: 0 !important;
|
||||||
margin-bottom: 40px !important;
|
margin-bottom: 40px !important;
|
||||||
border: 3px solid #eeeeee !important;
|
color: #000000;
|
||||||
background-color: $color-off-white !important;
|
|
||||||
}
|
}
|
||||||
.doc-title {
|
.doc-title {
|
||||||
margin: 20px 0 10px 0 !important;
|
margin: 0 !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
font-size: 18px !important;
|
||||||
|
color: #000000 !important;
|
||||||
}
|
}
|
||||||
.doc-excerpt {
|
.doc-excerpt {
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
color: #464545 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wysiwyg {
|
.wysiwyg {
|
||||||
font-size: 15px;
|
font-size: 15px !important;
|
||||||
line-height: 25px;
|
line-height: 22px !important;
|
||||||
color: #000000;
|
color: #000000 !important;
|
||||||
|
|
||||||
|
h1 { font-size: 22px; color: #000000 !important; }
|
||||||
|
h2 { font-size: 20px; color: #000000 !important; }
|
||||||
|
h3 { font-size: 18px; color: #000000 !important; }
|
||||||
|
h4 { font-size: 17px; color: #000000 !important; }
|
||||||
|
h5 { font-size: 16px; color: #000000 !important; }
|
||||||
|
h6 { font-size: 16px; color: #000000 !important; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-title {
|
||||||
|
font-size: 20px !important;
|
||||||
|
color: #000000 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: auto !important;
|
||||||
|
min-width: 100% !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
[class*="col-"] {
|
||||||
|
float: left !important;
|
||||||
|
width: 100% !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<div class="view-document">
|
<div class="view-document">
|
||||||
<div class="document-customfields">
|
<div class="document-customfields">
|
||||||
|
|
||||||
<div class="row">
|
<div class="row {{if (eq selectedCategories.length 0) 'd-print-none'}}">
|
||||||
<div class="col-12 col-sm-3 heading">Categories</div>
|
<div class="col-12 col-sm-3 heading">Categories</div>
|
||||||
<div class="col-12 col-sm-9 value">
|
<div class="col-12 col-sm-9 value">
|
||||||
{{#each selectedCategories as |cat|}}
|
{{#each selectedCategories as |cat|}}
|
||||||
|
@ -12,21 +12,21 @@
|
||||||
{{else}}
|
{{else}}
|
||||||
{{#if canAddCategory}}
|
{{#if canAddCategory}}
|
||||||
{{#if canSelectCategory}}
|
{{#if canSelectCategory}}
|
||||||
<a href="#" {{action 'onShowCategoryModal'}}><select></a>
|
<a href="#" class="d-print-none" {{action 'onShowCategoryModal'}}><select></a>
|
||||||
{{else}}
|
{{else}}
|
||||||
{{#link-to 'folder.category' folder.id folder.slug class='non-printable'}}<manage>{{/link-to}}
|
{{#link-to 'folder.category' folder.id folder.slug class='d-print-none'}}<manage>{{/link-to}}
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{/each}}
|
{{/each}}
|
||||||
{{#if canSelectCategory}}
|
{{#if canSelectCategory}}
|
||||||
<div class="action-button button-icon-gray button-icon-small align-middle" {{action 'onShowCategoryModal'}}>
|
<div class="action-button button-icon-gray button-icon-small align-middle d-print-none" {{action 'onShowCategoryModal'}}>
|
||||||
<i class="material-icons align-middle">edit</i>
|
<i class="material-icons align-middle">edit</i>
|
||||||
</div>
|
</div>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row {{if (eq tagz.length 0) 'd-print-none'}}">
|
||||||
<div class="col-12 col-sm-3 heading">Tags</div>
|
<div class="col-12 col-sm-3 heading">Tags</div>
|
||||||
<div class="col-12 col-sm-9 value">
|
<div class="col-12 col-sm-9 value">
|
||||||
{{#each tagz as |t index|}}
|
{{#each tagz as |t index|}}
|
||||||
|
@ -35,7 +35,7 @@
|
||||||
{{/link-to}}
|
{{/link-to}}
|
||||||
{{/each}}
|
{{/each}}
|
||||||
{{#if permissions.documentEdit}}
|
{{#if permissions.documentEdit}}
|
||||||
<div class="action-button button-icon-gray button-icon-small align-middle" data-toggle="modal" data-target="#document-tags-modal" data-backdrop="static">
|
<div class="action-button button-icon-gray button-icon-small align-middle d-print-none" data-toggle="modal" data-target="#document-tags-modal" data-backdrop="static">
|
||||||
<i class="material-icons align-middle">edit</i>
|
<i class="material-icons align-middle">edit</i>
|
||||||
</div>
|
</div>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{{#unless emptyState}}
|
{{#unless emptyState}}
|
||||||
<div id="doc-toc" class="document-toc {{if isDesktop 'document-toc-desktop'}}">
|
<div id="doc-toc" class="document-toc {{if isDesktop 'document-toc-desktop'}}">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<div class="title">Table of contents</div>
|
<div class="title">Contents</div>
|
||||||
{{#if canEdit}}
|
{{#if canEdit}}
|
||||||
<div id="tocToolbar" class="toc-controls {{if state.actionablePage 'current-page'}}">
|
<div id="tocToolbar" class="toc-controls {{if state.actionablePage 'current-page'}}">
|
||||||
<div id="toc-up-button" class="button-icon-green button-icon-small {{if state.upDisabled 'disabled'}}" {{action 'pageUp'}}>
|
<div id="toc-up-button" class="button-icon-green button-icon-small {{if state.upDisabled 'disabled'}}" {{action 'pageUp'}}>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue