Commit bc291885 authored by svilayphiou's avatar svilayphiou

Fixed print view.

parent 566c0eb9
......@@ -7,7 +7,7 @@
--crop-length: 7mm;
--crop-offset: 5mm;
--crop: calc(var(--crop-length) + var(--crop-offset)); // Based on Scribus cropmarks with 5mm of bleed -> 7mm of marks + 5mm of offset
--crop: calc(var(--crop-length) + var(--crop-offset)); /* Based on Scribus cropmarks with 5mm of bleed -> 7mm of marks + 5mm of offset */
--page-width-crop: calc(var(--page-width) + calc(var(--crop)*2));
--page-height-crop: calc(var(--page-height) + calc(var(--crop)*2));
......@@ -16,8 +16,8 @@
--page-margin-top: 10mm;
--page-margin-bottom: 15mm;
--header-height: 10mm;
--header-text: "f-u-t-u-r-e.org";
--header-height: 20mm;
--header-text: "ethertoff";
--footer-height: 10mm;
--footer-text: counter(page-counter);
}
......@@ -25,32 +25,32 @@
/* __________________________________ DEBUG __________________________________ */
.debug {
/*outline: 1pt solid purple;*/
}
.page {
outline: 1pt solid blue;
}
.header {
outline: 1pt solid pink;
}
.debug .page {
outline: 1pt solid blue;
}
.main-section {
outline: 1pt solid cyan;
}
.debug .header {
outline: 1pt solid pink;
}
.footer {
outline: 1pt solid pink;
}
.debug .main-section {
outline: 1pt solid cyan;
}
.middle {
/*outline: 1pt solid red;*/
}
.region-break {
border-top: 1pt dashed blue;
}
.moveable {
outline: 1pt solid yellow;
}
.debug .footer {
outline: 1pt solid pink;
}
.debug .middle {
/*outline: 1pt solid red;*/
}
.debug .region-break {
border-top: 1pt dashed blue;
}
.debug .moveable {
outline: 1pt solid yellow;
}
/* __________________________________ INTERFACE CLASSES __________________________________ */
......@@ -78,11 +78,11 @@ nav,
cursor: pointer;
border: 0;
&:hover {
background-color: white;
color: black;
outline: 1pt solid black;
}
}
#print-interface button:hover {
background-color: white;
color: black;
outline: 1pt solid black;
}
#print-interface .button-active {
background-color: white;
......@@ -104,42 +104,39 @@ div#print-interface {
bottom: 10pt;
right: 10pt;
z-index: 20000;
}
a {
text-decoration: none;
position: static;
}
div#print-interface a {
text-decoration: none;
position: static;
}
div.dropdown {
display: inline-block;
position: relative;
ul {
padding: 0.5em 0;
display: none;
background-color: black;
position: absolute;
right: 0;
bottom: 2em;
height: 200pt;
width: 80pt;
overflow: auto;
a {
padding: 0 1em;
color: white;
display: block;
&:hover {
background-color: white;
color: black;
}
}
}
button {
width: 80pt;
}
}
div#print-interface div.dropdown {
display: inline-block;
position: relative;
}
div#print-interface div.dropdown ul {
padding: 0.5em 0;
display: none;
background-color: black;
position: absolute;
right: 0;
bottom: 2em;
height: 200pt;
width: 80pt;
overflow: auto;
}
div#print-interface div.dropdown ul a {
padding: 0 1em;
color: white;
display: block;
}
div#print-interface div.dropdown ul a:hover {
background-color: white;
color: black;
}
div#print-interface div.dropdown button {
width: 80pt;
}
......@@ -156,28 +153,26 @@ div#print-interface {
}
@page {
//size: var(--page-width) var(--page-height); // format coupé
size: var(--page-width-crop) var(--page-height-crop); // format avec cropmarks
/*size: var(--page-width) var(--page-height); */ /* format coupé*/
size: var(--page-width-crop) var(--page-height-crop); /* format avec cropmarks */
margin: 0;
orphans: 2;
widows: 2;
}
html.spread {
.page {
outline: 1px solid black;
float: left;
&:nth-child(odd) {
margin-left: -calc(var(--crop) * 2);
left: 1px;
}
}
#page-1 {
margin-left: var(--page-width) !important;
}
/*-- SPREADS ---------------------------------*/
html.spread .page {
outline: 1px solid black;
float: left;
}
html.spread .page:nth-child(odd) {
margin-left: -calc(var(--crop) * 2);
left: 1px;
}
html.spread #page-1 {
margin-left: var(--page-width) !important;
}
html {
width: var(--page-width-crop);
......@@ -220,23 +215,29 @@ div.print-marks {
page-break-inside: avoid;
page-break-after: always;
overflow: visible;
}
#master-page:nth-child(odd) .header,
.page:nth-child(odd) .header {
text-align: right;
}
&:nth-child(odd) .header {
text-align: right;
}
&:nth-child(odd) .header,
&:nth-child(odd) .main-section,
&:nth-child(odd) .footer {
padding-left: var(--page-margin-inside);
padding-right: var(--page-margin-outside);
}
&:nth-child(even) .header,
&:nth-child(even) .main-section,
&:nth-child(even) .footer {
padding-left: var(--page-margin-outside);
padding-right: var(--page-margin-inside);
}
#master-page:nth-child(odd) .header,
#master-page:nth-child(odd) .main-section,
#master-page:nth-child(odd) .footer,
.page:nth-child(odd) .header,
.page:nth-child(odd) .main-section,
.page:nth-child(odd) .footer {
padding-left: var(--page-margin-inside);
padding-right: var(--page-margin-outside);
}
#master-page:nth-child(even) .header,
#master-page:nth-child(even) .main-section,
#master-page:nth-child(even) .footer,
.page:nth-child(even) .header,
.page:nth-child(even) .main-section,
.page:nth-child(even) .footer {
padding-left: var(--page-margin-outside);
padding-right: var(--page-margin-inside);
}
......@@ -297,10 +298,9 @@ section.header {
padding-top: var(--page-margin-top);
height: var(--header-height);
text-align: left;
&:after {
content: var(--header-text);
}
}
section.header:after {
content: var(--header-text);
}
/* __________________________________ MAIN SECTION __________________________________ */
......@@ -318,7 +318,7 @@ section.main-section {
}
div.column {
//-webkit-flow-from: myFlow;
/*-webkit-flow-from: myFlow;*/
flow-from: myFlow;
height: 100%;
float: left;
......@@ -326,13 +326,13 @@ div.column {
}
#content,
div.footnote {
//-webkit-flow-into: myFlow;
/*-webkit-flow-into: myFlow;*/
flow-into: myFlow;
width: 100%;
}
.include #content,
.include div.footnote {
//-webkit-flow-into: none;
/*-webkit-flow-into: none;*/
flow-into: none;
}
......@@ -345,10 +345,10 @@ section.footer {
right: var(--crop);
height: var(--footer-height);
text-align: center;
}
&:after {
content: var(--footer-text);
}
section.footer:after {
content: var(--footer-text);
}
/* __________________________________ CONTENT __________________________________ */
......
{% extends "base.html" %}
{% load wikify ethertoff_tags %}
{% load wikify ethertoff_tags static %}
{% block extra_styles %}
<link rel="stylesheet" href="{% url 'css-print' %}" type="text/css" media="print">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment