Commit 3d305195 authored by Julie Blanc's avatar Julie Blanc
Browse files

[notes-float] clean folder and styles]

parent 03986903
{
"liveServer.settings.port": 5501
}
\ No newline at end of file
# Float notes
a script proposal using float for notes.
\ No newline at end of file
A script proposal using float for notes.
Re-write by Robin and Julie during paged.js hackathon (March #1
\ No newline at end of file
:root{
--pagedjs_notes-area-page-left-width: 100%;
--pagedjs_notes-area-page-right-width: 100%;
--pagedjs_notes-area-page-left-maxHeight: 100%;
--pagedjs_notes-area-page-right-maxHeight: 100%;
}
.pagedjs_left_page .pagedjs_area-notes {
width: var(--pagedjs_notes-area-page-left-width);
max-height: var(--pagedjs_notes-area-page-left-maxHeight);
}
.pagedjs_right_page .pagedjs_area-notes {
width: var(--pagedjs_notes-area-page-right-width);
width: var(--pagedjs_notes-area-page-right-maxHeight);
}
.pagedjs_area-notes::before{
content: "---";
}
body {
counter-reset: pagedjsMarkerNote pagedjsCallNote;
}
.pagedjs_note{
display: block;
counter-increment: pagedjsMarkerNote;
}
.pagedjs_callnote{
counter-increment: pagedjsCallNote;
vertical-align:super;
}
.pagedjs_callnote::after{ content: counter(pagedjsCallNote); }
.pagedjs_note::before{ content: counter(pagedjsMarkerNote) ". ";}
/*
Proposal about specs (spread declared)
-------------------------------------
@page:left{
@note {
float: bottom left;
width: 150px;
}
}
@page:right{
@note {
float: bottom right;
width: 150px;
}
}
.sidenote{ float: note; }
Proposal about specs (spread declared)
-------------------------------------
@page{
@note {
float: bottom outside;
}
}
*/
\ No newline at end of file
......@@ -11,26 +11,12 @@ note.pagedjs_note {
*/
.pagedjs_left_page .pagedjs_area-notes {
/* position: relative; */
/* left: -35mm; */
/* margin-right: -35mm; */
/* box-shadow: 0 0 0 1px #e6e6e6; */
padding-right: 6mm;
padding-left: 6mm;
/* border: 1px solid black; */
/* box-sizing: content-box!important; */
}
.pagedjs_right_page .pagedjs_area-notes {
/* width: 150px; */
/* position: relative;
right: -35mm;
margin-left: -35mm; */
padding-left: 12mm;
/* border: 1px solid black; */
/* box-sizing: content-box!important; */
}
......@@ -66,8 +52,14 @@ note.pagedjs_note {
margin-left: 20mm
}
@page:first{
margin: 10mm 30mm;
}
#cover-page{
/*break-after: right;*/
break-after: left;
}
......@@ -85,9 +77,10 @@ note.pagedjs_note {
.pagedjs_note{
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 14px;
font-size: 12px;
line-height: 16px;
margin-top: 16px;
margin-right: 16px;
}
/* .pagedjs_note + .pagedjs_note{ margin-top: 16px; } */
......@@ -97,18 +90,32 @@ note.pagedjs_note {
/* style callnote */
body {
counter-reset: pagedjsMarkerNote pagedjsCallNote;
}
.pagedjs_note{
display: block;
counter-increment: pagedjsMarkerNote;
}
.pagedjs_callnote{
counter-increment: pagedjsCallNote;
vertical-align:super;
}
.pagedjs_callnote::after{ content: counter(pagedjsCallNote); }
.pagedjs_note::before{ content: counter(pagedjsMarkerNote) ". ";}
.pagedjs_callnote::after, .pagedjs_note::before{
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 8px;
background-color: #333;
color: white;
color: white;
}
.pagedjs_note::before{
vertical-align: baseline;
width: 20px;
height: 15px;
......@@ -127,10 +134,6 @@ note.pagedjs_note {
.pagedjs_callnote::after{
padding: 3px 8px 2px 8px;
vertical-align: top;
/* display: inline-block;
position: relative;
left: -6px;
min-width: 20px; */
}
.pagedjs_note::before{
......@@ -144,9 +147,9 @@ note.pagedjs_note {
content: none;
}
@page:first{
margin: 10mm 30mm;
}
/* COVER */
#cover-page h1{
font-family: Georgia, 'Times New Roman', Times, serif;
......@@ -219,18 +222,5 @@ hr{
/**
* ADDED FROM style-pagedjs-default
*/
body {
counter-reset: pagedjsMarkerNote pagedjsCallNote;
}
.pagedjs_note{
display: block;
counter-increment: pagedjsMarkerNote;
}
.pagedjs_callnote{
counter-increment: pagedjsCallNote;
vertical-align:super;
}
.pagedjs_callnote::after{ content: counter(pagedjsCallNote); }
.pagedjs_note::before{ content: counter(pagedjsMarkerNote) ". ";}
......@@ -10,16 +10,12 @@
<!-- Styles -->
<link href="css/interface.css" rel="stylesheet" type='text/css'>
<!-- <link href="css/style-pagedjs-default.css" rel="stylesheet" type='text/css'> -->
<link href="css/style.css" rel="stylesheet" type='text/css'>
<!-- Paged js-->
<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>
<!-- <script src="http://localhost:9090/dist/paged.polyfill.js"></script> -->
<!-- <script async src="http://localhost:9090/dist/paged.polyfill.js"></script> -->
<script src="js/MoveNotesToInlinePosition.js" type="text/javascript"></script>
<script src="js/FloatNotes.js" type="text/javascript"></script>
<!-- <script src="js/inlinenotes.js" type="text/javascript"></script> -->
</head>
......
function inlinenotes(elem){
let notesCall = document.getElementsByClassName(elem);
for(let i = 0; i < notesCall.length; ++i){
console.log(notesCall);
let noteCall = notesCall[i];
// console.log(noteCall);
let idNote = noteCall.href.split("#")[1];
let span = document.createElement("span");
span.className = 'sidenote';
span.id = 'span-' + idNote;
noteCall.parentNode.insertBefore(span, noteCall);
noteCall.parentNode.removeChild(noteCall);
let noteMarker = document.getElementById(idNote);
let noteContent = noteMarker.parentNode.innerHTML;
span.innerHTML = noteContent;
let noteMarkerSpan = document.getElementById(idNote);
document.getElementById(idNote).parentNode.removeChild(noteMarkerSpan);
}
let listNote = document.getElementById('list-footnote');
listNote.parentNode.removeChild(listNote);
}
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