|
|
|
@ -965,6 +965,7 @@ h1.koreaderwikifrontpage, h5.koreaderwikifrontpage {
|
|
|
|
|
p.koreaderwikifrontpage {
|
|
|
|
|
font-style: italic;
|
|
|
|
|
font-size: 90%;
|
|
|
|
|
text-indent: 0;
|
|
|
|
|
margin: 1em 2em 1em 2em;
|
|
|
|
|
}
|
|
|
|
|
hr.koreaderwikifrontpage {
|
|
|
|
@ -1036,19 +1037,44 @@ body > div > div.thumb img {
|
|
|
|
|
height: 100% !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Style gallery and the galleryboxes it contains */
|
|
|
|
|
.gallery {
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin-top: 1em;
|
|
|
|
|
/* Some other (usually wide) thumbnails are wrapped in a DIV.center:
|
|
|
|
|
* avoid having them overflowing in web mode (no issue in other modes).
|
|
|
|
|
* (Use "width: auto", as crengine does not support "max-width:") */
|
|
|
|
|
body > div > div.center > div.thumb * {
|
|
|
|
|
-cr-only-if: allow-style-w-h-absolute-units;
|
|
|
|
|
width: auto !important;
|
|
|
|
|
}
|
|
|
|
|
/* galleryboxes about the same topic may be in multiple gallery containers,
|
|
|
|
|
* make the floating galleryboxes continuous */
|
|
|
|
|
.gallery + .gallery {
|
|
|
|
|
clear: none;
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
|
|
|
|
|
/* Style gallery and the galleryboxes it contains.
|
|
|
|
|
/* LI.galleryboxes about the same topic may be in multiple UL.gallery
|
|
|
|
|
* containers, and Wikipedia may group them by 3 or 4 in each container.
|
|
|
|
|
* We'd rather want them in a single group, so they can be laid out
|
|
|
|
|
* taking the full width depending on render mode and screen dpi.
|
|
|
|
|
* So, make UL.gallery inline, and all its children inline-block.
|
|
|
|
|
* The consecutive inline UL.gallery will be wrapped by crengine
|
|
|
|
|
* in a single autoBoxing element, that we style a bit, hoping
|
|
|
|
|
* Wikipedia properly have all its 1st level elements "display:block"
|
|
|
|
|
* and we do not style other autoBoxed inlines at this level. */
|
|
|
|
|
body > div > ul.gallery,
|
|
|
|
|
body > div > autoBoxing > ul.gallery {
|
|
|
|
|
display: inline; /* keep them inline once autoBoxed */
|
|
|
|
|
}
|
|
|
|
|
.gallery + * {
|
|
|
|
|
body > div > autoBoxing { /* created by previous style */
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin-top: 1em;
|
|
|
|
|
margin-bottom: 1em;
|
|
|
|
|
clear: both;
|
|
|
|
|
/* Have non-full-width inline-blocks laid out centered */
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
body > div > ul.gallery > *,
|
|
|
|
|
body > div > autoBoxing > ul.gallery > * {
|
|
|
|
|
/* Make all ul.gallery children inline-block and taking 100% width
|
|
|
|
|
* so they feel like classically stacked display:block */
|
|
|
|
|
display: inline-block;
|
|
|
|
|
width: 100%;
|
|
|
|
|
/* Have gallerycaption and galleryboxes content centered */
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
.gallerycaption {
|
|
|
|
|
font-weight: bold;
|
|
|
|
@ -1059,31 +1085,29 @@ li.gallerybox {
|
|
|
|
|
/* Style gallerybox just as main thumbs */
|
|
|
|
|
list-style-type: none;
|
|
|
|
|
border: dotted 1px black;
|
|
|
|
|
margin: 0.5em 2.5em 0.5em 2.5em;
|
|
|
|
|
padding: 0.5em 0.5em 0.2em 0.5em;
|
|
|
|
|
padding-top: ]].. (include_images and "0.5em" or "0.15em") .. [[;
|
|
|
|
|
text-align: center;
|
|
|
|
|
margin: 0.5em 2.5em 0.5em 2.5em !important;
|
|
|
|
|
padding: 0.5em 0.5em 0.2em 0.5em !important;
|
|
|
|
|
padding-top: ]].. (include_images and "0.5em" or "0.15em") .. [[ !important;
|
|
|
|
|
text-indent: 0;
|
|
|
|
|
font-size: 90%;
|
|
|
|
|
page-break-inside: avoid;
|
|
|
|
|
/* Allow them to float (even if "display: inline-block" would be nicer) */
|
|
|
|
|
float: left;
|
|
|
|
|
vertical-align: top; /* align them all to their top */
|
|
|
|
|
/* No float here, but use these to distinguish flat/book/web modes */
|
|
|
|
|
-cr-only-if: -float-floatboxes;
|
|
|
|
|
width: 100% !important; /* flat mode: force full width */
|
|
|
|
|
-cr-only-if: float-floatboxes;
|
|
|
|
|
/* Remove our wide horizontal margins if floating */
|
|
|
|
|
/* Remove our wide horizontal margins in book/web modes */
|
|
|
|
|
margin: 0.5em 0.5em 0.5em 0.5em !important;
|
|
|
|
|
-cr-only-if: float-floatboxes -allow-style-w-h-absolute-units;
|
|
|
|
|
/* Set a fixed width when not in "web" mode */
|
|
|
|
|
width: 25% !important;
|
|
|
|
|
}
|
|
|
|
|
li:dir(rtl).gallerybox {
|
|
|
|
|
float: right;
|
|
|
|
|
width: 25% !important; /* will allow rows of 3 */
|
|
|
|
|
/* In web mode, allow the specified widths in HTML style attributes */
|
|
|
|
|
}
|
|
|
|
|
li.gallerybox p {
|
|
|
|
|
/* Reset indent as we have everything centered */
|
|
|
|
|
text-indent: 0;
|
|
|
|
|
}
|
|
|
|
|
li.gallerybox div.thumb {
|
|
|
|
|
/* Remove thumb styling, which we set on the gallerybox */
|
|
|
|
|
/* Remove thumb styling, which we have set on the gallerybox */
|
|
|
|
|
border: solid 1px white;
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
@ -1098,7 +1122,7 @@ li.gallerybox * {
|
|
|
|
|
width: 100% !important;
|
|
|
|
|
}
|
|
|
|
|
li.gallerybox div.thumb img {
|
|
|
|
|
/* Make float's inner images 100% of their container's width
|
|
|
|
|
/* Make inline-block's inner images 100% of their container's width
|
|
|
|
|
* when not in "web" mode (same as previous, but with height */
|
|
|
|
|
-cr-only-if: float-floatboxes -allow-style-w-h-absolute-units;
|
|
|
|
|
width: 100% !important;
|
|
|
|
@ -1212,32 +1236,9 @@ table {
|
|
|
|
|
-- external link for us, so let's remove this link.
|
|
|
|
|
html = html:gsub("<a[^>]*>%s*(<%s*img [^>]*>)%s*</a>", "%1")
|
|
|
|
|
|
|
|
|
|
--- @todo do something for <li class="gallerybox"...> so they are no more
|
|
|
|
|
-- a <li> (crengine displays them one above the other) and can be displayed
|
|
|
|
|
-- side by side
|
|
|
|
|
|
|
|
|
|
-- For some <div class="thumb tright"> , which include nested divs, although
|
|
|
|
|
-- perfectly balanced, crengine seems to miss some closing </div> and we
|
|
|
|
|
-- end up having our image bordered box including the remaining main wiki text.
|
|
|
|
|
-- It looks like this code is supposed to deal with class= containing multiple
|
|
|
|
|
-- class names :
|
|
|
|
|
-- https://github.com/koreader/crengine/commit/0930ec7230e720c148fd6f231d69558832b4d53a
|
|
|
|
|
-- and that it may stumble on some cases.
|
|
|
|
|
-- It's all perfectly fine if we make all these div with a single class name
|
|
|
|
|
-- html = html:gsub([[<div class="thumb [^"]*">]], [[<div class="thumb">]])
|
|
|
|
|
--
|
|
|
|
|
-- But we may as well make all class= have a single name to avoid other problems
|
|
|
|
|
-- (no real risk with that, as we don't define any style for wikipedia class names,
|
|
|
|
|
-- except div.thumb that always appears first).
|
|
|
|
|
html = html:gsub([[(<[^>]* class="[^ "]+)%s+[^"]*"]], [[%1"]])
|
|
|
|
|
|
|
|
|
|
-- crengine seems to consider unknown tag as 'block' elements, so we may
|
|
|
|
|
-- want to remove or replace those that should be considered 'inline' elements
|
|
|
|
|
html = html:gsub("</?time[^>]*>", "")
|
|
|
|
|
|
|
|
|
|
-- crengine does not support the <math> family of tags for displaying formulas,
|
|
|
|
|
-- which results in lots of space taken by individual character in the formula, each
|
|
|
|
|
-- on a single line...
|
|
|
|
|
-- which results in lots of space taken by individual character in the formula,
|
|
|
|
|
-- each on a single line...
|
|
|
|
|
-- Also, usally, these <math> tags are followed by a <img> tag pointing to a
|
|
|
|
|
-- SVG version of the formula, that we took care earlier to change the url to
|
|
|
|
|
-- point to a PNG version of the formula (which is still not perfect, as it does
|
|
|
|
@ -1264,27 +1265,14 @@ table {
|
|
|
|
|
html = html:gsub([[href="/wiki/([^"]*)"]], cleanWikiPageTitle)
|
|
|
|
|
|
|
|
|
|
-- Remove href from links to non existant wiki page so they are not clickable :
|
|
|
|
|
-- <a href="/w/index.php?title=PageTitle&action=edit&redlink=1" class="new" title="PageTitle">PageTitle____on</a>
|
|
|
|
|
-- <a href="/w/index.php?title=PageTitle&action=edit&redlink=1" class="new"
|
|
|
|
|
-- title="PageTitle">PageTitle____on</a>
|
|
|
|
|
-- (removal of the href="" will make them non clickable)
|
|
|
|
|
html = html:gsub([[<a[^>]* class="new"[^>]*>]], [[<a class="newwikinonexistent">]])
|
|
|
|
|
|
|
|
|
|
-- Fix some other protocol-less links to wikipedia (href="//fr.wikipedia.org/w/index.php..)
|
|
|
|
|
html = html:gsub([[href="//]], [[href="https://]])
|
|
|
|
|
|
|
|
|
|
-- crengine does not return link if multiple class names in <a> (<a class="external text" href="">)
|
|
|
|
|
-- it would be no problem as we can't follow them, but when the user tap
|
|
|
|
|
-- on it, the tap is propagated to other widgets and page change happen...
|
|
|
|
|
-- html = html:gsub([[<a rel="nofollow" class="external text"]], [[<a rel="nofollow" class="externaltext"]])
|
|
|
|
|
-- html = html:gsub([[<a class="external text"]], [[<a class="externaltext"]])
|
|
|
|
|
-- Solved by our multiple class names suppression above
|
|
|
|
|
|
|
|
|
|
-- Avoid link being clickable before <a> (if it starts a line) or after </a> (if it
|
|
|
|
|
-- ends a line or a block) by wrapping it with U+200B ZERO WIDTH SPACE which will
|
|
|
|
|
-- make the DOM tree walking code to find a link stop at it.
|
|
|
|
|
-- html = html:gsub("(<[aA])", "\xE2\x80\x8B%1")
|
|
|
|
|
-- html = html:gsub("(</[aA]>)", "%1\xE2\x80\x8B")
|
|
|
|
|
-- Fixed in crengine lvtinydom.
|
|
|
|
|
|
|
|
|
|
if self.wiki_prettify then
|
|
|
|
|
-- Prepend some symbols to section titles for a better visual feeling of hierarchy
|
|
|
|
|
html = html:gsub("<h1>", "<h1> "..h1_sym.." ")
|
|
|
|
|