improve style and cleanup

This commit is contained in:
Celogeek 2023-03-05 18:51:29 +01:00
parent 8a77bda99e
commit 9964f9b00c
Signed by: celogeek
GPG Key ID: E6B7BDCFC446233A
7 changed files with 184 additions and 88 deletions

View File

@ -1,14 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html> <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head> <head>
<title>Page {{ .Image.Id }} Space</title> <title>Page {{ .Image.Id }} Space</title>
<link href="style.css" type="text/css" rel="stylesheet"/> <link href="style.css" type="text/css" rel="stylesheet"/>
<meta name="viewport" content="width={{ .Info.ViewWidth }}, height={{ .Info.ViewHeight }}"/> <meta name="viewport" content="width={{ .Info.ViewWidth }}, height={{ .Info.ViewHeight }}"/>
</head> </head>
<body style=""> <body>
<div style="text-align:center;top:0.0%;"> <h1>{{ if .Info.Manga }}&#8592;{{ else }}&#8594;{{ end }}</h1>
<h1>{{ if .Info.Manga }}&#8592;{{ else }}&#8594;{{ end }}</h1> </body>
</div>
</body>
</html> </html>

View File

@ -1,20 +1,20 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html> <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head> <head>
<title>{{ .Info.Title }}</title> <title>{{ .Info.Title }}</title>
<meta charset="utf-8"/> <meta charset="utf-8"/>
</head> </head>
<body> <body>
<nav xmlns:epub="http://www.idpf.org/2007/ops" epub:type="toc" id="toc"> <nav xmlns:epub="http://www.idpf.org/2007/ops" epub:type="toc" id="toc">
<ol> <ol>
<li><a href="Text/part.xhtml">{{ .Info.Title }}</a></li> <li><a href="Text/part.xhtml">{{ .Info.Title }}</a></li>
</ol> </ol>
</nav> </nav>
<nav epub:type="page-list"> <nav epub:type="page-list">
<ol> <ol>
<li><a href="Text/part.xhtml">{{ .Info.Title }}</a></li> <li><a href="Text/part.xhtml">{{ .Info.Title }}</a></li>
</ol> </ol>
</nav> </nav>
</body> </body>
</html> </html>

View File

@ -1,3 +1,9 @@
a.app-amzn-magnify {
display: inline-block;
width: 100%;
height: 100%;
}
#PV { #PV {
position: absolute; position: absolute;
width: 100%; width: 100%;
@ -71,3 +77,27 @@
position: absolute; position: absolute;
display: none; display: none;
} }
div#PV-TL-P img {
position: absolute;
left: 0;
top: 0;
}
div#PV-TR-P img {
position: absolute;
right: 0;
top: 0;
}
div#PV-BL-P img {
position: absolute;
left: 0;
bottom: 0;
}
div#PV-BR-P img {
position: absolute;
right: 0;
bottom: 0;
}

View File

@ -1,15 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html> <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head> <head>
<title>Part {{ .Part }}</title> <title>Part {{ .Part }}</title>
<link href="style.css" type="text/css" rel="stylesheet"/> <link href="style.css" type="text/css" rel="stylesheet"/>
<meta name="viewport" content="width={{ .Info.ViewWidth }}, height={{ .Info.ViewHeight }}"/> <meta name="viewport" content="width={{ .Info.ViewWidth }}, height={{ .Info.ViewHeight }}"/>
</head> </head>
<body style=""> <body>
<div style="text-align:center;top:0.0%;"> <h1>{{ .Info.Title }}</h1>
<h1>{{ .Info.Title }}</h1> {{ if gt .Total 1 }}
<h1>Part {{ .Part }} / {{ .Total }}</h1> <h1>Part {{ .Part }} / {{ .Total }}</h1>
</div> {{ end }}
</body> </body>
</html> </html>

View File

@ -1,9 +1,77 @@
@page { @charset "UTF-8";
margin: 0;
html {
color: #000;
background: #FFF;
} }
body { body {
display: block; font-size: 16px;
margin: 0; text-align: center;
padding: 0; width: 100%;
height: 100%;
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
th,
td {
margin: 0;
padding: 0
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset,
img {
border: 0;
}
caption,
th,
var {
font-style: normal;
font-weight: normal;
}
li {
list-style: none;
}
caption,
th {
text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 150%;
font-weight: normal;
}
sup {
vertical-align: text-top;
}
sub {
vertical-align: text-bottom;
} }

View File

@ -1,41 +1,41 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html> <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head> <head>
<title>Page {{ .Image.Id }}_p{{ .Image.Part}}</title> <title>Page {{ .Image.Id }}_p{{ .Image.Part}}</title>
<link href="style.css" type="text/css" rel="stylesheet"/> <link href="style.css" type="text/css" rel="stylesheet"/>
<link href="panelview.css" type="text/css" rel="stylesheet"/> <link href="panelview.css" type="text/css" rel="stylesheet"/>
<meta name="viewport" content="width={{ .Image.Width }}, height={{ .Image.Height }}"/> <meta name="viewport" content="width={{ .Image.Width }}, height={{ .Image.Height }}"/>
</head> </head>
<body style=""> <body>
<div style="text-align:center;top:0.0%;"> <div>
<img width="{{ .Image.Width }}" height="{{ .Image.Height }}" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg"/> <img style="width:{{ .Image.Width }}px; height:{{ .Image.Height }}px" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg"/>
</div> </div>
<div id="PV"> <div id="PV">
<div id="PV-TL"> <div id="PV-TL">
<a style="display:inline-block;width:100%;height:100%;" class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-TL-P", "ordinal":{{ if .Manga }}2{{ else }}1{{ end }}}'></a> <a class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-TL-P", "ordinal":{{ if .Manga }}2{{ else }}1{{ end }}}'></a>
</div> </div>
<div id="PV-TR"> <div id="PV-TR">
<a style="display:inline-block;width:100%;height:100%;" class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-TR-P", "ordinal":{{ if .Manga }}1{{ else }}2{{ end }}}'></a> <a class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-TR-P", "ordinal":{{ if .Manga }}1{{ else }}2{{ end }}}'></a>
</div> </div>
<div id="PV-BL"> <div id="PV-BL">
<a style="display:inline-block;width:100%;height:100%;" class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-BL-P", "ordinal":{{ if .Manga }}4{{ else }}3{{ end }}}'></a> <a class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-BL-P", "ordinal":{{ if .Manga }}4{{ else }}3{{ end }}}'></a>
</div> </div>
<div id="PV-BR"> <div id="PV-BR">
<a style="display:inline-block;width:100%;height:100%;" class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-BR-P", "ordinal":{{ if .Manga }}3{{ else }}4{{ end }}}'></a> <a class="app-amzn-magnify" data-app-amzn-magnify='{"targetId":"PV-BR-P", "ordinal":{{ if .Manga }}3{{ else }}4{{ end }}}'></a>
</div> </div>
</div> </div>
<div class="PV-P" id="PV-TL-P" style=""> <div class="PV-P" id="PV-TL-P">
<img style="position:absolute;left:0;top:0;" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/> <img src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/>
</div> </div>
<div class="PV-P" id="PV-TR-P" style=""> <div class="PV-P" id="PV-TR-P">
<img style="position:absolute;right:0;top:0;" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/> <img src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/>
</div> </div>
<div class="PV-P" id="PV-BL-P" style=""> <div class="PV-P" id="PV-BL-P">
<img style="position:absolute;left:0;bottom:0;" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/> <img src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/>
</div> </div>
<div class="PV-P" id="PV-BR-P" style=""> <div class="PV-P" id="PV-BR-P">
<img style="position:absolute;right:0;bottom:0;" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/> <img src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg" width="{{ zoom .Image.Width 1.5 }}" height="{{ zoom .Image.Height 1.5 }}"/>
</div> </div>
</body> </body>
</html> </html>

View File

@ -1,14 +1,14 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html> <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
<head> <head>
<title>Page {{ .Image.Id }}_p{{ .Image.Part}}</title> <title>Page {{ .Image.Id }}_p{{ .Image.Part}}</title>
<link href="style.css" type="text/css" rel="stylesheet"/> <link href="style.css" type="text/css" rel="stylesheet"/>
<meta name="viewport" content="width={{ .Image.Width }}, height={{ .Image.Height }}"/> <meta name="viewport" content="width={{ .Image.Width }}, height={{ .Image.Height }}"/>
</head> </head>
<body style=""> <body>
<div style="text-align:center;top:0.0%;"> <div>
<img width="{{ .Image.Width }}" height="{{ .Image.Height }}" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg"/> <img style="width:{{ .Image.Width }}px; height:{{ .Image.Height }}px" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg"/>
</div> </div>
</body> </body>
</html> </html>