View Single Post
Old 09-10-2019, 09:10 AM   #58
thiago.eec
Guru
thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.thiago.eec ought to be getting tired of karma fortunes by now.
 
Posts: 946
Karma: 1183425
Join Date: Dec 2016
Location: Goiânia - Brazil
Device: iPad, Kindle Paperwhite
Viewer

The new viewer looks great. Really clean. Kind of a chock on the first glance... but very nice.

Now, my observations:

1) I really miss the scroll bar on the right side. Maybe it could be hidden? I really miss being able to fast scan the book.

2) There are some inconsistencies with SVG covers:

This is my cover:
Spoiler:
Code:
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="pt-BR" xml:lang="pt-BR">
	<head>
		<title>Capa</title>
		<link href="css/Frontmatter.css" rel="stylesheet" type="text/css"/>
	</head>
	<body id="idParaDest-a">
    <section epub:type="cover" role="doc-cover" aria-label="Capa">
      <div class="Cover">
        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="100%" height="100%" preserveAspectRatio="xMidYMid meet" viewBox="0 0 451 720">
          <image height="720" width="451" xlink:href="image/cover.jpg"/>
        </svg>
      </div>
    </section>
	</body>
</html>
Code:
/*Cover*/
@page {
  padding: 0;
  margin: 0;
  }
body {
  padding: 0;
  margin: 0;
}
div.Cover {
  text-align: center;
  padding: 0;
  margin: 0;
  height: 100vh;
}

2.1) Looks like the cover shown on the viewer is actually the IMAGE set as cover. It does not show the XHTML cover, even if it is marked as linear on my opf. This way, I have no control on how the cover is displayed. Small images are shown centered at the top. Bigger images behaves like it has a SVG wrapper with 'preserveAspectRatio=xMidYMid meet' and fills the whole page.
(See the image attached, old viewer and new viewer rendering the same book).

2.2) On another case, my XHTML cover has a SVG with title and desc elements. This one does show on the viewer. But now I have two covers: one of the image file, other of the XHTML file. Nonetheless, the preserveAspectRatio property is still ignored on the rendered image. At least it does seem to use "xMidYMid meet" as default.

Spoiler:

Code:
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="pt-BR" xml:lang="pt-BR">
	<head>
		<title>Capa</title>
		<link href="../Styles/Frontmatter.css" rel="stylesheet" type="text/css"/>
	</head>
	<body lang="pt-BR" xml:lang="pt-BR">
    <section epub:type="frontmatter cover" aria-labelledby="capa_do_livro" aria-describedby="desc_capa" id="id-a">
      <div class="Cover">
        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="100%" height="100%" preserveAspectRatio="xMidYMid meet" viewBox="0 0 811 1200" role="img">
          <title id="capa_do_livro">Capa do livro A Viagem de Théo</title>
          <desc id="desc_capa">Fundo preto com faixa amarela no topo com vários desenhos de templos religiosos um ao lado do outro.</desc>
          <image width="811" height="1200" xlink:href="../Images/cover.jpg"/>
        </svg>
      </div>
    </section>
	</body>
</html>
Attached Thumbnails
Click image for larger version

Name:	Covers.png
Views:	122
Size:	551.7 KB
ID:	173368  

Last edited by thiago.eec; 09-10-2019 at 09:13 AM.
thiago.eec is offline