From: Marek Stępniowski <marek@stepniowski.com>
Date: Sun, 14 Sep 2008 22:18:35 +0000 (+0200)
Subject: Added fragment anchors.
X-Git-Url: https://git.mdrn.pl/wolnelektury.git/commitdiff_plain/c4afb7a5bb7e48bd79cc14a403f78c0e3645db7c

Added fragment anchors.
---

diff --git a/lib/librarian/bin/master.css b/lib/librarian/bin/master.css
index 5c665f869..7cb4290f7 100644
--- a/lib/librarian/bin/master.css
+++ b/lib/librarian/bin/master.css
@@ -51,14 +51,14 @@ p {
 /* ======================== */
 .theme-begin {
     border-left: 0.1em solid #DDDDDD;
-    color: #666;
-    float: right;
-    margin: 0 -9.5em 0 0;
+    color: #777;
     padding: 0 0.5em;
     width: 7.5em;
     font-style: normal;
     font-weight: normal;
     font-size: 16px;
+    position: absolute;
+    left: 40em;
 }
 
 .annotation {
diff --git a/lib/librarian/html.py b/lib/librarian/html.py
index ae5efa644..c75dd6b56 100644
--- a/lib/librarian/html.py
+++ b/lib/librarian/html.py
@@ -53,6 +53,7 @@ def transform(input_filename, output_filename):
     doc = etree.parse(doc_file, parser)
 
     result = doc.xslt(style)
+    add_anchors(result.getroot())
     result.write(output_filename, xml_declaration=True, pretty_print=True, encoding='utf-8')
 
 
@@ -155,3 +156,34 @@ def extract_fragments(input_filename):
 
     return closed_fragments, open_fragments
 
+
+def add_anchor(element, number):
+    anchor = etree.Element('a', href='#f%d' % number)
+    anchor.set('class', 'anchor')
+    anchor.text = str(number)
+    if element.text:
+        anchor.tail = element.text
+        element.text = u''
+    element.insert(0, anchor)
+    
+    anchor_target = etree.Element('a', name='f%d' % number)
+    element.insert(0, anchor_target)
+
+
+def add_anchors(root):
+    counter = 1
+    for element in root.iterdescendants():
+        if element.getparent().tag in 'div' and 'note' in element.getparent().get('class', ''):
+            continue
+        if element.getparent().tag in 'blockquote':
+            continue
+        
+        if element.tag == 'p' and 'verse' in element.get('class', ''):
+            if counter == 1 or counter % 5 == 0:
+                add_anchor(element, counter)
+            counter += 1
+        elif 'paragraph' in element.get('class', ''):
+            add_anchor(element, counter)
+            counter += 1
+
+
diff --git a/wolnelektury/media/css/master.css b/wolnelektury/media/css/master.css
index 860a2dd50..b29f81c93 100644
--- a/wolnelektury/media/css/master.css
+++ b/wolnelektury/media/css/master.css
@@ -1,547 +1,204 @@
 body {
-    margin: 0 2em 2em 2em;
-    font: 70% Verdana, Arial, Helvetica, sans-serif;
+    font-size: 16px;
+    font: Georgia, "Times New Roman", serif;
     line-height: 1.5em;
-    background: #FFF url(/media/img/bg.png) repeat-x;
-    color: #2F4110;
-}
-
-img {
-    border: none;
+    margin: 3em;
+    max-width: 36em;
 }
 
 a {
-    color: #295158;
+    color: blue;
     text-decoration: none;
 }
 
-a:hover, a:active {
-    text-decoration: underline;
-}
-
-input {
-    font: 1em Verdana, Arial, Helvetica, sans-serif; 
-}
-
+/* =================================================== */
+/* = Common elements: headings, paragraphs and lines = */
+/* =================================================== */
 h1 {
-    font: normal normal bold 1.75em Arial, sans-serif;
-    color: #2F4110;
-    margin: 0.55em 0 0 0;
+    font-size: 3em;
+    margin: 1.5em 0;
+    text-align: center;
+    line-height: 1.5em;
+    font-weight: bold;
 }
 
 h2 {
-    font-size: 1.2em;
+    font-size: 2em;
+    margin: 1.5em 0 0;
     font-weight: bold;
-    color: #2F4110;
-    margin: 0;
+    line-height: 1.5em;
 }
 
 h3 {
-    font-size: 1.3em;
-    font-weight: bold;
-    margin: 0.2em 0 0 0;
-    color: #333;
-}
-
-em {
-    font-style: normal;
-    background-color: #F5DC7D;
-}
-
-.clearboth {
-    clear: both;
-}
-
-.blur {
-    color: #777;
-}
-
-/* ================================== */
-/* = Header with logo and user-info = */
-/* ================================== */
-#header {
-    position: relative;
-    margin-top: 1.5em;
-}
-
-#header #logo {
-    float: left;
+    font-size: 1.5em;
+    margin: 1.5em 0 0;
+    font-weight: normal;
+    line-height: 1.5em;
 }
 
-#header #user-info {
-    margin: 0 0 0 auto;
-    width: 40em;
-    text-align: right;
+h4 {
+    font-size: 1em;
+    margin: 1.5em 0 0;
+    line-height: 1.5em;
 }
 
-#site-description {
-    margin-top: -1.5em;
-    height:4.5em;
-    overflow: hidden;
-    float: right;
-    width: 42em;
-    text-align: right;
-    color: #777;
+p {
+    margin: 0;
 }
 
 /* ======================== */
-/* = Footer with sponsors = */
+/* = Footnotes and themes = */
 /* ======================== */
-#footer {
-    border-top: 0.1em solid #999;
-    color: #777;
-    font-size: 0.8em;
-    padding-top: 0.5em;
-    margin: 2em 0 0 0;
-}
-
-#footer p {
-    margin: 0;
-}
-
-#footer a {
-    color: #999;
-    text-decoration: underline;
-}
-
-
-/* =============== */
-/* = Search form = */
-/* =============== */
-#search-form {
-    margin: 0.5em 0;
-    padding: 0.5em;
-    background-color: rgb(132, 191, 42);
-    -moz-border-radius: 4px;
-    -webkit-border-radius: 4px;
-    border-radius: 4px;
-    border-bottom: 0.15em solid #7B9C2D;
-    border-right: 0.15em solid #7B9C2D;
-}
-
-#search-form p {
-    margin: 0em 0 0 0;
-}
-
-#search-form ol {
-    margin: 0;
-    padding: 0;
-}
-
-#search-form li {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-    display: inline;
-}
-
-#search-form li.category, #search-form li.book-title {
-    padding: 0.2em 0.5em 0.2em 0.5em;
-    background-color: rgb(242, 163, 15);
-    border: 1px solid #BA8722;
-    border-right: 1px solid #555;
-    border-bottom: 1px solid #555;
-    -moz-border-radius: 3px;
-    -webkit-border-radius: 3px;
-    border-radius: 3px;
+.theme-begin {
+    border-left: 0.1em solid #DDDDDD;
+    color: #666;
+    float: right;
+    margin: 0 -9.5em 0 0;
+    padding: 0 0.5em;
+    width: 7.5em;
+    font-style: normal;
+    font-weight: normal;
+    font-size: 16px;
 }
 
-#search-form li.book-title {
-    background-color: #DDD;
-    border: 1px solid #999;
-    border-right: 1px solid #555;
-    border-bottom: 1px solid #555;
+.annotation {
+    font-style: normal;
+    font-weight: normal;
+    font-size: 12px;
 }
 
-#search-form input[type=submit] {
-    color: #444;
+#footnotes .annotation {
+    display: block;
+    float: left;
+    width: 2.5em;
+    clear: both;
 }
 
-.ac_input {
-    width: 18em;
+#footnotes div {
+    margin: 1.5em 0 0 0;
 }
 
-p .ac_input {
-    width: 28em;
+#footnotes p {
+    margin-left: 2.5em;
 }
 
 
 /* ============= */
-/* = Tags list = */
+/* = Numbering = */
 /* ============= */
-#intro {
-    margin: 0 0 2.5em 0;
-}
-
-#tags-description {
-    color: #777;
-    margin: 0 0.5em -0.75em 0.5em;
-}
-
-#main-page #tags-list {
-    margin-right: 33%;
-}
-
-#categories-list ul, #themes-list ul {
-    -moz-column-width: 12em;
-    -webkit-column-width: 12em;
-    column-width: 12em;
-}
-
-#tags-list {
-    margin-top: 1em;
-    padding: 1em;
-    background-color: #FBEF90;
-    -moz-border-radius: 4px;
-    -webkit-border-radius: 4px;
-    border-radius: 4px;
-    border-bottom: 0.15em solid #E3D888;
-    border-right: 0.15em solid #E3D888;
-}
-
-#tagged-object-list #tags-list, #book-detail #tags-list {
-    margin-left: 39em;
-}
-
-#book-info, #categories-list {
+.anchor {
     float: left;
-    width: 47.5%;
-}
-
-#themes-list {
-    margin-left: 52.5%;
-}
-
-#tagged-object-list #categories-list, #book-detail #book-info {
-    width: 12em;
-}
-
-#tagged-object-list #themes-list, #book-detail #themes-list {
-    margin-left: 14em;
-}
-
-#tags-list ol, #tags-list ul {
-    padding: 0;
-    margin: 0.3em 0 1.2em 0;
-}
-
-#tags-list li {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-}
-
-#books-list {
-    width: 38em;
-    float: left;
-}
-
-.all-tags {
-    display: none;
-}
-
-div.shown-tags p {
-    margin: -1em 0 1em 0;
-    text-align: right;
-}
-
-.show-all-tags {
-    text-decoration: underline;
-    padding-right: 1em;
-}
-
-.subcategories {
-    display: block;
-    padding-left: 2em;
-    padding-bottom: 0.5em;
-}
-
-
-/* ============== */
-/* = Propaganda = */
-/* ============== */
-#propaganda {
-    float: right;
-    width: 30%;
-    margin: 0;
-    padding: 2em 0.5em 0.5em;
-}
-
-
-/* ===================== */
-/* = Other info        = */
-/* ===================== */
-#latest-blog-posts {
-    padding: 0.5em;
-    float: left;
-    width: 30%;
-}
-
-#latest-blog-posts ol {
-    padding: 0 0 0 1.5em;
-    margin: 1em 0 0 0;
-    list-style-type: square;
-    color: #D13628;
-}
-
-#you-can-help {
-    float: right;
-    padding: 0.5em;
-    width: 30%;
-}
-
-#about-us {
-    padding: 0.5em;
-    margin-left: 35%;
-    margin-right: 35%;
-}
-
-/* =============== */
-/* = Description = */
-/* =============== */
-#description {
-    margin-top: 0.5em;
-    text-align: justify;
-}
-
-#toggle-description, #tagged-object-list .pagination {
-    width: 100%;
-    height: 1.5em;
-    background-color: #EEE;
-    margin-top: 0.5em;
-    -moz-border-radius: 4px;
-    -webkit-border-radius: 4px;
-    border-radius: 4px;
+    margin: -0.2em -0.5em -0.2em -3.5em;
+    color: #777;
+    font-size: 12px;
+    width: 2em;
     text-align: center;
+    padding: 0.2em 0.5em;
 }
 
-#toggle-description p {
-    margin: 0;
-    padding: 0;
-    color: #999;
+.anchor:hover, .anchor:active {
+    color: #FFF;
+    background-color: #CCC;
 }
 
-#download-shelf {
+/* =================== */
+/* = Custom elements = */
+/* =================== */
+span.author {
+    font-size: 0.75em;
     display: block;
-    width: 100%;
-    height: 1.5em;
-    background-color: #EEE;
-    margin-top: 0.5em;
-    padding: 0.5em 0;
-    -moz-border-radius: 4px;
-    -webkit-border-radius: 4px;
-    border-radius: 4px;
-    text-align: center;    
-}
-
-/* ============================ */
-/* = Books and fragments list = */
-/* ============================ */
-#books-list {
-    margin: 0;
-}
-
-#books-list ol {
-    list-style: none;
-    padding: 0;
-    margin: 1.5em 0;
-}
-
-.book {
-    padding: 0.5em;
-    background-color: #FFF;
-    -moz-border-radius: 3px;
-    -webkit-border-radius: 3px;
-    border-radius: 3px;
-}
-
-.fragment {
-    border-bottom: 0.1em solid #EEE;
-    margin-top: 0.5em;
+    line-height: 1.5em;
+    margin-bottom: 0.25em;
 }
 
-.fragment-text, .fragment-short-text {
-    padding: 0.5em;
-    background-color: #FFF;
-    -moz-border-radius: 3px;
-    -webkit-border-radius: 3px;
-    border-radius: 3px;
+span.collection {
+    font-size: 0.75em;
+    display: block;
+    line-height: 1.5em;
+    margin-bottom: -0.25em;
 }
 
-.fragment-metadata {
-    padding: 0.5em 0.5em 1.5em 0.5em;
-    float: right;
+span.subtitle {
+    font-size: 0.75em;
+    display: block;
+    line-height: 1.5em;
+    margin-top: -0.25em;
 }
 
-.change-sets {
-    float: right;
+div.didaskalia {
+    font-style: italic;
+    margin: 0.5em 0 0;
 }
 
-.book-description {
-    margin-left: 3.5em;
+div.kwestia {
+    margin: 0.5em 0 0;
 }
 
-.book-thumbnail {
-    background: transparent url(/media/img/book.png) no-repeat 0 0;
-    width: 3em;
-    height: 3em;
-    float: left;
+div.stanza {
+    margin: 1.5em 0 0;
 }
 
-/* =============== */
-/* = Simple form = */
-/* =============== */
-.cuteform ol, .cuteform ul {
-    padding: 0;
+div.kwestia div.stanza {
     margin: 0;
-    list-style: none;
-}
-
-.cuteform ol li, .cuteform ul li {
-    margin-top: 0.7em;
-}
-
-.cuteform label {
-    display: block;
 }
 
-.cuteform span.help-text {
-    display: block;
-    font-size: 0.8em;
-    color: #999;
+p.paragraph {
+    text-align: justify;
+    margin: 1.5em 0 0;
 }
 
-.cuteform .error {
-    color: #BF3024;
+p.motto {
+    text-align: justify;
+    font-style: italic;
+    margin: 1.5em 0 0;
 }
 
-/* ================ */
-/* = Modal Window = */
-/* ================ */
-.jqmOverlay { background-color: #000; }
-
-#set-window {
-    position: absolute;
-    display: none;
-    width: 32em;
-    background-color: transparent;
-    margin-top: -0.5em;
-    margin-left: -1em;
+p.motto_podpis {
+    font-size: 0.875em;
 }
 
-#set-window div.header {
-    background-color: #FFF;
-    border-right: 0.25em solid #DDD;
-    width: 4em;
-    padding: 0.5em 1em 0.5em 1em;
+div.fragment {
+    border-bottom: 0.1em solid #999;
+    padding-bottom: 1.5em;
 }
 
-#set-window div.target {
-    background-color: #FFF;
-    border-right: 0.3em solid #DDD;
-    border-bottom: 0.3em solid #DDD;
-    padding: 1em;
+div.note p, div.dedication p, div.note p.paragraph, div.dedication p.paragraph {
+    text-align: right;
+    font-style: italic;
 }
 
-#login-register-window {
-    position: absolute;
-    display: none;
-    width: 24em;
-    background-color: transparent;
-    margin-top: -0.5em;
-    margin-left: 1em;
+hr.spacer {
+    height: 3em;
+    visibility: hidden;
 }
 
-#login-register-window div.header {
-    background-color: #FFF;
-    border-right: 0.3em solid #DDD;
-    width: 4em;
-    right: 0;
-    left: auto;
-    padding: 0.5em 1em 0.5em 1em;
-    float: right;
-    text-align: center;
+hr.spacer-line {
+    margin: 1.5em 0;
+    border: none;
+    border-bottom: 0.1em solid #000;
 }
 
-#login-register-window div.target {
-    clear: both;
-    background-color: #FFF;
-    border-right: 0.3em solid #DDD;
-    border-bottom: 0.3em solid #DDD;
-    padding: 1em;
-}
-
-#user-shelves-window {
-    position: absolute;
-    display: none;
-    width: 28em;
-    background-color: transparent;
-    margin-top: -0.5em;
-    margin-left: 1em;
-}
-
-#user-shelves-window div.header {
-    background-color: #FFF;
-    border-right: 0.3em solid #DDD;
-    width: 4em;
-    right: 0;
-    left: auto;
-    padding: 0.5em 1em 0.5em 1em;
-    float: right;
+p.spacer-asterisk {
+    padding: 0;
+    margin: 1.5em 0;
     text-align: center;
 }
 
-#user-shelves-window div.target {
-    clear: both;
-    background-color: #FFF;
-    border-right: 0.3em solid #DDD;
-    border-bottom: 0.3em solid #DDD;
-    padding: 1em;
-}
-
-.shelf-list {
+div.person-list ol {
     list-style: none;
-    padding: 0;
-}
-
-.shelf-list li {
-    padding: 0.25em;
-    margin: 0 -0.25em;
-}
-
-.shelf-list a.delete-shelf {
-    color: #900;
-    float: right;
-    padding: 0.25em 0.25em 0.25em 1em;
-    margin: -0.25em;
+    padding: 0 0 0 1.5em;
 }
 
-.shelf-list a.delete-shelf:active, .shelf-list a.delete-shelf:hover {
-    color: #FFF;
-    background-color: #900;
-    text-decoration: none;
+p.place-and-time {
+    font-style: italic;
 }
 
-/* ======================== */
-/* = Alphabetic book list = */
-/* ======================== */
-#book-a-list #book-list {
-    -moz-column-width: 24em;
-    -webkit-column-width: 24em;
-    column-width: 24em;
+em.math, em.foreign-word, em.book-title, em.didaskalia, em.author-emphasis {
+    font-style: italic;
 }
 
-#book-a-list #book-list ol {
-    padding: 0;
-    margin: 0.3em 0 1.2em 0;
-    list-style: none;
-}
-
-#top-message {
-    background-color: #2F4110;
-    color: #FFF;
-    margin: 0 -2em;
-    padding: 0 2em;
-    line-height: 2em;
+em.person {
+    font-style: normal;
+    font-variant: small-caps;
 }