Code cosmetics

This commit is contained in:
Ozzie Isaacs 2021-03-14 15:18:45 +01:00
parent 22c93e2389
commit 3c35f02cac
2 changed files with 85 additions and 86 deletions

View File

@ -72,6 +72,21 @@ body {
padding: 3px; padding: 3px;
} }
.list_item.currentChapter > a,
.list_item a:hover {
color: #f1f1f1;
}
#panels a {
visibility: hidden;
width: 18px;
height: 20px;
overflow: hidden;
display: inline-block;
color: #ccc;
margin-left: 6px;
}
#titlebar a:active { #titlebar a:active {
opacity: 1; opacity: 1;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
@ -189,19 +204,14 @@ body {
#title-controls { float: right; } #title-controls { float: right; }
#panels a {
visibility: hidden;
width: 18px;
height: 20px;
overflow: hidden;
display: inline-block;
color: #ccc;
margin-left: 6px;
}
#panels a::before { visibility: visible; } #panels a::before { visibility: visible; }
#panels a:hover { color: #aaa; } #panels a:hover { color: #aaa; }
.list_item a {
color: #aaa;
text-decoration: none;
}
#panels a:active { #panels a:active {
color: #aaa; color: #aaa;
margin: 1px 0 -1px 6px; margin: 1px 0 -1px 6px;
@ -296,11 +306,6 @@ input:-moz-placeholder { color: #454545; }
list-style: none; list-style: none;
} }
.list_item a {
color: #aaa;
text-decoration: none;
}
.list_item a.chapter { .list_item a.chapter {
font-size: 1em; font-size: 1em;
} }
@ -309,11 +314,6 @@ input:-moz-placeholder { color: #454545; }
font-size: 0.8em; font-size: 0.8em;
} }
.list_item.currentChapter > a,
.list_item a:hover {
color: #f1f1f1;
}
/* #tocView li.openChapter > a, */ /* #tocView li.openChapter > a, */
.list_item a:hover { .list_item a:hover {
color: #e2e2e2; color: #e2e2e2;
@ -350,8 +350,8 @@ input:-moz-placeholder { color: #454545; }
margin-right: -4px; margin-right: -4px;
} }
.currentChapter > .toc_toggle:before, .currentChapter > .toc_toggle::before,
.openChapter > .toc_toggle:before { .openChapter > .toc_toggle::before {
content: '▾'; content: '▾';
} }
@ -619,7 +619,7 @@ input:-moz-placeholder { color: #454545; }
} }
@media only screen and (max-width: 550px) { @media only screen and (max-width: 550px) {
#viewer{ #viewer {
width: 80%; width: 80%;
margin-left: 10%; margin-left: 10%;
} }
@ -654,11 +654,6 @@ input:-moz-placeholder { color: #454545; }
-ms-transform: translate(260px, 0); -ms-transform: translate(260px, 0);
} }
#titlebar {
/* font-size: 16px; */
/* margin: 0 50px 0 50px; */
}
#metainfo { #metainfo {
font-size: 10px; font-size: 10px;
} }
@ -678,21 +673,22 @@ input:-moz-placeholder { color: #454545; }
/* For iPad portrait layouts only */ /* For iPad portrait layouts only */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: portrait) { @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: portrait) {
#viewer iframe { #viewer iframe {
width: 460px; width: 460px;
height: 740px; height: 740px;
} }
} }
@media only screen @media only screen
and (min-device-width : 768px) and (min-device-width: 768px)
and (max-device-width : 1024px) and (max-device-width: 1024px)
and (orientation : landscape) and (orientation : landscape)
/*and (-webkit-min-device-pixel-ratio: 2)*/ { /*and (-webkit-min-device-pixel-ratio: 2)*/ {
#viewer { #viewer {
width: 80%; width: 80%;
margin-left: 10%; margin-left: 10%;
} }
#divider, #divider,
#divider.show { #divider.show {
display: none; display: none;
@ -701,71 +697,74 @@ and (orientation : landscape)
/*For iPad landscape layouts only */ /*For iPad landscape layouts only */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: landscape) { @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: landscape) {
#viewer iframe { #viewer iframe {
width: 960px; width: 960px;
height: 515px; height: 515px;
} }
} }
/* For iPhone 6\6s portrait layouts only */ /* For iPhone 6\6s portrait layouts only */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation: portrait) { @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
#viewer { #viewer {
width: 300px; width: 300px;
height: 480px; height: 480px;
} }
#viewer iframe {
width: 300px; #viewer iframe {
height: 480px; width: 300px;
} height: 480px;
}
} }
/* For iPhone 6\6s landscape layouts only */ /* For iPhone 6\6s landscape layouts only */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation: landscape) { @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
#viewer { #viewer {
width: 450px; width: 450px;
height: 300px; height: 300px;
} }
#viewer iframe {
width: 450px; #viewer iframe {
height: 300px; width: 450px;
} height: 300px;
}
} }
/* For iPhone portrait layouts only */ /* For iPhone portrait layouts only */
@media only screen and (max-device-width: 374px) and (orientation: portrait) { @media only screen and (max-device-width: 374px) and (orientation: portrait) {
#viewer { #viewer {
width: 256px; width: 256px;
height: 432px; height: 432px;
} }
#viewer iframe {
width: 256px; #viewer iframe {
height: 432px; width: 256px;
} height: 432px;
}
} }
/* For iPhone landscape layouts only */ /* For iPhone landscape layouts only */
@media only screen and (max-device-width: 374px) and (orientation: landscape) { @media only screen and (max-device-width: 374px) and (orientation: landscape) {
#viewer iframe { #viewer iframe {
width: 256px; width: 256px;
height: 124px; height: 124px;
} }
} }
[class^="icon-"]:before, [class*=" icon-"]:before { [class^="icon-"]::before, [class*=" icon-"]:before {
font-family: "fontello", serif; font-family: "fontello", serif;
font-style: normal; font-style: normal;
font-weight: normal; font-weight: normal;
speak: none; speak: none;
display: inline-block; display: inline-block;
text-decoration: inherit; text-decoration: inherit;
width: 1em; width: 1em;
margin-right: 0.2em; margin-right: 0.2em;
text-align: center; text-align: center;
/* For safety - reset parent styles, that can break glyph codes*/ /* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal; font-variant: normal;
text-transform: none; text-transform: none;
/* you can be more comfortable with increased icons size */ /* you can be more comfortable with increased icons size */
font-size: 112%; font-size: 112%;
} }
.icon-search:before { content: '\e807'; } /* '' */ .icon-search:before { content: '\e807'; } /* '' */

View File

@ -56,15 +56,15 @@ $("#asc").click(function() {
$("#all").click(function() { $("#all").click(function() {
// go through all elements and make them visible // go through all elements and make them visible
$list.isotope({ filter: function() { $list.isotope({ filter: function() {
return true; return true;
} }
}); });
}); });
$(".char").click(function() { $(".char").click(function() {
var character = this.innerText; var character = this.innerText;
$list.isotope({ filter: function() { $list.isotope({ filter: function() {
return this.attributes["data-id"].value.charAt(0).toUpperCase() == character; return this.attributes["data-id"].value.charAt(0).toUpperCase() == character;
} }
}); });
}); });