New theme, updated to HTML5
New style.css to reflect the update to html5 several changes in index.php as the html has been updated. Had to delete icons support in base.php as they where conflicting with the new theme.
This commit is contained in:
Thomas Severinsen
parent
02c25705cf
commit
6a58a81b21
19
base.php
19
base.php
|
|
@ -165,15 +165,6 @@ class Entry
|
|||
public $localUpdated;
|
||||
private static $updated = NULL;
|
||||
|
||||
public static $icons = array(
|
||||
Author::ALL_AUTHORS_ID => 'images/author.png',
|
||||
Serie::ALL_SERIES_ID => 'images/serie.png',
|
||||
Book::ALL_RECENT_BOOKS_ID => 'images/recent.png',
|
||||
Tag::ALL_TAGS_ID => 'images/tag.png',
|
||||
CustomColumn::ALL_CUSTOMS_ID => 'images/tag.png',
|
||||
"calibre:books$" => 'images/allbook.png',
|
||||
"calibre:books:letter" => 'images/allbook.png'
|
||||
);
|
||||
|
||||
public function getUpdatedTime () {
|
||||
if (!is_null ($this->localUpdated)) {
|
||||
|
|
@ -193,16 +184,6 @@ class Entry
|
|||
$this->contentType = $pcontentType;
|
||||
$this->linkArray = $plinkArray;
|
||||
|
||||
if ($config['cops_show_icons'] == 1)
|
||||
{
|
||||
foreach (self::$icons as $reg => $image)
|
||||
{
|
||||
if (preg_match ("/" . $reg . "/", $pid)) {
|
||||
array_push ($this->linkArray, new Link (getUrlWithVersion ($image), "image/png", Link::OPDS_THUMBNAIL_TYPE));
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
100
index.php
100
index.php
|
|
@ -45,10 +45,9 @@
|
|||
|
||||
|
||||
?>
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
|
||||
<!DOCTYPE html>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta http-equiv="imagetoolbar" content="no" />
|
||||
<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no" />
|
||||
<title><?php echo htmlspecialchars ($currentPage->title) ?></title>
|
||||
|
|
@ -59,6 +58,7 @@
|
|||
<link rel="icon" type="image/vnd.microsoft.icon" href="<?php echo $currentPage->favicon ?>" />
|
||||
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css?v=2.1.3" media="screen" />
|
||||
<link rel="stylesheet" type="text/css" href="<?php echo getUrlWithVersion("style.css") ?>" media="screen" />
|
||||
<link rel="stylesheet" href="//normalize-css.googlecode.com/svn/trunk/normalize.css" />
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
// Handler for .ready() called.
|
||||
|
|
@ -147,21 +147,14 @@
|
|||
<p><img src="images/ajax-loader.gif" alt="waiting" /> Please Wait</p>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="head">
|
||||
<div class="headleft">
|
||||
<a href="<?php echo $_SERVER["SCRIPT_NAME"] ?>">
|
||||
<header>
|
||||
<a class="headleft" href="<?php echo $_SERVER["SCRIPT_NAME"] ?>">
|
||||
<img src="<?php echo getUrlWithVersion("images/home.png") ?>" alt="Home" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="headright">
|
||||
<img id="searchImage" src="<?php echo getUrlWithVersion("images/setting64.png") ?>" alt="Settings and menu" />
|
||||
</div>
|
||||
<div class="headcenter">
|
||||
<p><?php echo htmlspecialchars ($currentPage->title) ?></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearer" />
|
||||
<div class="menu">
|
||||
</a>
|
||||
<img class="headright" id="searchImage" src="<?php echo getUrlWithVersion("images/setting64.png") ?>" alt="Settings and menu" />
|
||||
<h1><?php echo htmlspecialchars ($currentPage->title) ?></h1>
|
||||
</header>
|
||||
<aside>
|
||||
<div id="search" class="search">
|
||||
<form action="index.php?page=9" method="get">
|
||||
<input type="text" name="query" />
|
||||
|
|
@ -182,10 +175,10 @@
|
|||
<img id="sort" src="images/sort32.png" alt="Sort" />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearer" />
|
||||
<div id="content" style="display: none;"></div>
|
||||
<div class="entries">
|
||||
</aside>
|
||||
|
||||
<div id="content" style="display: none;"></div>
|
||||
<section>
|
||||
<?php
|
||||
if ($page == Base::PAGE_BOOK_DETAIL)
|
||||
{
|
||||
|
|
@ -194,33 +187,29 @@
|
|||
foreach ($currentPage->entryArray as $entry) {
|
||||
if (get_class ($entry) != "EntryBook") {
|
||||
?>
|
||||
<div class="entry">
|
||||
<div class="entryTitle"><?php echo htmlspecialchars ($entry->title) ?></div>
|
||||
<div class="entryContent"><?php echo htmlspecialchars ($entry->content) ?></div>
|
||||
<?php
|
||||
foreach ($entry->linkArray as $link) {
|
||||
?>
|
||||
<a href="<?php echo $link->hrefXhtml () ?>" class="navigation">nav</a>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<article>
|
||||
<div class="frontpage">
|
||||
<?php foreach ($entry->linkArray as $link) {?> <a href="<?php echo $link->hrefXhtml () ?>">
|
||||
<h2><?php echo htmlspecialchars ($entry->title) ?></h2>
|
||||
<?php } ?>
|
||||
<h4><?php echo htmlspecialchars ($entry->content) ?></h4>
|
||||
</a>
|
||||
</div>
|
||||
</article>
|
||||
<?php
|
||||
}
|
||||
else
|
||||
{
|
||||
?>
|
||||
<div class="book">
|
||||
<div class="cover">
|
||||
<article>
|
||||
<div class="books">
|
||||
<?php
|
||||
if ($entry->book->hasCover) {
|
||||
?>
|
||||
<a rel="group" class="fancycover" href="<?php echo $entry->getCover () ?>"><img src="<?php echo $entry->getCoverThumbnail () ?>" alt="<?php echo localize("i18n.coversection") ?>" /></a>
|
||||
<span class="cover"><a rel="group" class="fancycover" href="<?php echo $entry->getCover () ?>"><img src="<?php echo $entry->getCoverThumbnail () ?>" alt="<?php echo localize("i18n.coversection") ?>" /></a></span>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<div class="download">
|
||||
<?php
|
||||
$i = 0;
|
||||
foreach ($config['cops_prefered_format'] as $format)
|
||||
|
|
@ -229,49 +218,44 @@
|
|||
if ($data = $entry->book->getDataFormat ($format)) {
|
||||
$i++;
|
||||
?>
|
||||
<div class="button buttonEffect"><a href="<?php echo $data->getHtmlLink () ?>"><?php echo $format ?></a></div>
|
||||
<?php
|
||||
<h2 class="download"><a href="<?php echo $data->getHtmlLink () ?>"><?php echo $format ?></a></h2>
|
||||
<?php
|
||||
}
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<div class="bookdetail">
|
||||
<a class="navigation" href="<?php echo $entry->book->getDetailUrl () ?>" />
|
||||
<div class="entryTitle st"><?php echo htmlspecialchars ($entry->title) ?>
|
||||
|
||||
<a class="navigation" href="<?php echo $entry->book->getDetailUrl () ?>" />
|
||||
<h2><?php echo htmlspecialchars ($entry->title) ?>
|
||||
<?php
|
||||
if ($entry->book->getPubDate() != "")
|
||||
{
|
||||
?>
|
||||
<span class="sp">(<?php echo $entry->book->getPubDate() ?>)</span>
|
||||
(<?php echo $entry->book->getPubDate() ?>)
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
<span class="sr"><?php echo $entry->book->getRating () ?></span>
|
||||
</div>
|
||||
<div class="entryContent sa"><?php echo localize("authors.title") . " : " . htmlspecialchars ($entry->book->getAuthorsName ()) ?></div>
|
||||
<div class="entryContent"><?php echo localize("tags.title") . " : " . htmlspecialchars ($entry->book->getTagsName ()) ?></div>
|
||||
<?php echo $entry->book->getRating () ?></h2>
|
||||
<h4><?php echo localize("authors.title") . " : </h4>" . htmlspecialchars ($entry->book->getAuthorsName ()) ?><br />
|
||||
<h4><?php echo localize("tags.title") . " : </h4>" . htmlspecialchars ($entry->book->getTagsName ()) ?><br />
|
||||
<?php
|
||||
$serie = $entry->book->getSerie ();
|
||||
if (!is_null ($serie)) {
|
||||
?>
|
||||
<div class="entryContent ss"><?php echo localize("series.title") . " : " . htmlspecialchars ($serie->name) . " (" . $entry->book->seriesIndex . ")" ?></div>
|
||||
<h4><?php echo localize("series.title") . " :</h4> " . htmlspecialchars ($serie->name) . " (" . $entry->book->seriesIndex . ")" ?><br />
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
<div class="clearer" />
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<div class="foot">
|
||||
<div class="footright">
|
||||
<a class="fancyabout" href="about.xml"><img src="<?php echo getUrlWithVersion("images/info.png") ?>" alt="Home" /></a>
|
||||
</div>
|
||||
</section>
|
||||
<footer>
|
||||
<a href="about.xml"><img src="<?php echo getUrlWithVersion("images/info.png") ?>" alt="Home" /></a>
|
||||
<?php
|
||||
if ($currentPage->isPaginated ()) {
|
||||
?>
|
||||
|
|
@ -296,7 +280,7 @@
|
|||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
366
style.css
366
style.css
|
|
@ -1,225 +1,159 @@
|
|||
html
|
||||
{
|
||||
font-family: sans-serif;
|
||||
font-size: 1em;
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
background-color:lightgray;
|
||||
/* Global Box Sizing and Font-Smoothing */
|
||||
*, *:after, *:before {
|
||||
box-sizing:border-box;
|
||||
-webkit-box-sizing:border-box;
|
||||
-moz-box-sizing:border-box;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
-moz-font-smoothing:antialiased;
|
||||
-o-font-smoothing:antialiased;
|
||||
font-smoothing:antialiased;
|
||||
text-rendering:optimizeLegibility;
|
||||
}
|
||||
|
||||
body
|
||||
{
|
||||
margin-top:0px;
|
||||
html { font-size: 100%; -webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%; }
|
||||
|
||||
body {
|
||||
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; /* Serve Helvetica Neue, with Helvetica fallbacks to Arial */
|
||||
font-size: 0.75em;/*12px/16px */
|
||||
font-weight:300; /* Better supported than 'lighter' attribute */
|
||||
line-height:18px;
|
||||
color: #1c1c1c; /* Lighter on the eyes than #000 Black */
|
||||
margin: 0px; background: #cccccc; background-size: cover;
|
||||
}
|
||||
|
||||
.container
|
||||
{
|
||||
margin:auto;
|
||||
width:100%;
|
||||
max-width:800px;
|
||||
img {
|
||||
border: 0px;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto\9; /* ie8 */
|
||||
}
|
||||
|
||||
.head
|
||||
{
|
||||
color:white;
|
||||
background-color:black;
|
||||
width:100%;
|
||||
height:64px;
|
||||
/* ==========================================================================
|
||||
Typography stuff goes here
|
||||
========================================================================== */
|
||||
h1,h2,h3,h4,h5,h6 { font-weight: bold; margin:0; padding:0;}
|
||||
/*h1 see mediaqueries*/
|
||||
h2 {font-size: 1.2em;}
|
||||
h3 {font-size: 1.1em;}
|
||||
h4 {font-size: 1.0em; }
|
||||
h5 {font-size: 0.83em;}
|
||||
h6 {font-size: 0.75em;}
|
||||
|
||||
a:hover, a:active { outline: none; }
|
||||
a { color: #2f4f4f ; text-decoration: none;}
|
||||
a:visited { color:#414141 ; }
|
||||
a:hover { color: black; text-decoration: underline; }
|
||||
.frontpage a:hover { display:inline-block; width: 100%; background-color: #778899;}
|
||||
|
||||
/* =============================================================================
|
||||
Main container stuff goes here
|
||||
========================================================================== */
|
||||
.container{
|
||||
background: #414141; border:1px solid #000; border-radius:10px;
|
||||
max-width:800px;width:95%;margin:0 auto;position:relative; }
|
||||
|
||||
/* =============================================================================
|
||||
Header stuff goes here
|
||||
========================================================================== */
|
||||
header {
|
||||
clear:both;
|
||||
color:white;
|
||||
text-align:center;
|
||||
text-transform:uppercase;
|
||||
display:block;
|
||||
box-shadow:inset 0px -5px 8px #000000;
|
||||
min-height:70px;
|
||||
border-radius: 10px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.foot
|
||||
{
|
||||
color:white;
|
||||
background-color:black;
|
||||
width:100%;
|
||||
height:32px;
|
||||
.headleft {
|
||||
float: left;
|
||||
}
|
||||
|
||||
img
|
||||
{
|
||||
margin:0;
|
||||
padding:0;
|
||||
border:0;
|
||||
header h1{
|
||||
float:none;
|
||||
padding-top:25px;
|
||||
}
|
||||
|
||||
.headleft
|
||||
{
|
||||
float:left;
|
||||
height:64px;
|
||||
.headright {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.headright
|
||||
{
|
||||
float:right;
|
||||
height:64px;
|
||||
cursor:pointer;
|
||||
/* =============================================================================
|
||||
Section and Article stuff goes here
|
||||
========================================================================== */
|
||||
section {
|
||||
clear:both;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.footright
|
||||
{
|
||||
float:right;
|
||||
height:32px;
|
||||
article {
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
|
||||
/*-------------frontpage article-------------*/
|
||||
|
||||
.headcenter
|
||||
{
|
||||
margin:auto;
|
||||
text-align:center;
|
||||
font-size: 1.5em;
|
||||
font-weight:bold;
|
||||
height:64px;
|
||||
display:table;
|
||||
.frontpage h2 {
|
||||
padding: 5px 0 0 5px;
|
||||
}
|
||||
|
||||
.footcenter
|
||||
{
|
||||
margin:auto;
|
||||
text-align:center;
|
||||
font-size: 1.3em;
|
||||
font-weight:bold;
|
||||
height:32px;
|
||||
display:table;
|
||||
.frontpage h4 {
|
||||
padding: 5px 0 5px 20px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
|
||||
.headcenter p, .footcenter p, .footcenter a
|
||||
{
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
line-height: 100%;
|
||||
/*-------------books article-------------*/
|
||||
.books {
|
||||
clear: both;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.clearer
|
||||
.cover {
|
||||
float:left;
|
||||
padding: 0 10px 0 0;
|
||||
min-width: 56px;
|
||||
min-height: 70px;
|
||||
}
|
||||
|
||||
.download {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.download a {
|
||||
border-radius: 6px;
|
||||
box-shadow:0 0 10px #000;
|
||||
background: darkgray;
|
||||
background: radial-gradient(#666, black);
|
||||
color: #EEE;
|
||||
text-decoration : none;
|
||||
font-weight: bold;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.books h4{
|
||||
display: inline;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* =============================================================================
|
||||
Footer stuff goes here
|
||||
========================================================================== */
|
||||
footer
|
||||
{
|
||||
clear:both;
|
||||
box-shadow:inset 0px 5px 8px #000000;
|
||||
border-radius: 0px 0px 10px 10px;
|
||||
height:32px;
|
||||
}
|
||||
|
||||
.entries
|
||||
{
|
||||
background-color:lightgray;
|
||||
margin-top: 5px;
|
||||
footer a{
|
||||
float: right;
|
||||
}
|
||||
|
||||
.entry
|
||||
{
|
||||
background-color:white;
|
||||
border-bottom:1px double black;
|
||||
display:block;
|
||||
padding:2px;
|
||||
cursor: pointer;
|
||||
margin-bottom:5px;
|
||||
}
|
||||
|
||||
.book
|
||||
{
|
||||
background-color:white;
|
||||
border-bottom:1px double black;
|
||||
min-height:80px;
|
||||
margin-bottom:5px;
|
||||
}
|
||||
|
||||
.navigation
|
||||
{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.entryTitle
|
||||
{
|
||||
font-weight:bold;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.entryContent
|
||||
{
|
||||
font-style:italic;
|
||||
font-size: 0.9em;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.cover
|
||||
{
|
||||
float:left;
|
||||
padding:5px 10px;
|
||||
min-width: 56px;
|
||||
min-height: 70px;
|
||||
}
|
||||
|
||||
.download
|
||||
{
|
||||
float:right;
|
||||
}
|
||||
|
||||
.button
|
||||
{
|
||||
height:36px;
|
||||
display: table;
|
||||
width:80px;
|
||||
margin:2px;
|
||||
}
|
||||
|
||||
|
||||
.button p, .button a
|
||||
{
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#loading
|
||||
{
|
||||
display:none;
|
||||
position:fixed;
|
||||
left:0;
|
||||
top:0;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-color: #ccc;
|
||||
filter: alpha(opacity=70);
|
||||
opacity: 0.70;
|
||||
text-align: center;
|
||||
padding-top: 120px;
|
||||
}
|
||||
|
||||
.entrySection
|
||||
{
|
||||
margin-top: 8px;
|
||||
margin-bottom: 18px;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.entrySection span
|
||||
{
|
||||
font-style:italic;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
|
||||
.buttonEffect a
|
||||
{
|
||||
border-radius: 6px;
|
||||
background: darkgray;
|
||||
background: -moz-radial-gradient(#666, black);
|
||||
background: -webkit-radial-gradient(#666, black);
|
||||
background: -ms-radial-gradient(#666, black);
|
||||
background: radial-gradient(#666, black);
|
||||
color: #EEE;
|
||||
text-decoration : none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.pad6 a
|
||||
{
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.pad6
|
||||
{
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.menu
|
||||
/* =============================================================================
|
||||
Aside stuff goes here
|
||||
========================================================================== */
|
||||
aside
|
||||
{
|
||||
float: right;
|
||||
width : 250px;
|
||||
|
|
@ -233,6 +167,7 @@ position: absolute;
|
|||
background: white;
|
||||
}
|
||||
|
||||
/*-------------Search Aside-------------*/
|
||||
.search form
|
||||
{
|
||||
background-color: black;
|
||||
|
|
@ -253,26 +188,43 @@ float:right;
|
|||
padding: 3px 2px;
|
||||
}
|
||||
|
||||
.bookdetail
|
||||
#loading
|
||||
{
|
||||
color:black;
|
||||
display:none;
|
||||
position:fixed;
|
||||
left:0;
|
||||
top:0;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-color: #ccc;
|
||||
filter: alpha(opacity=70);
|
||||
opacity: 0.70;
|
||||
text-align: center;
|
||||
padding-top: 120px;
|
||||
}
|
||||
|
||||
|
||||
.bookpopup
|
||||
{
|
||||
min-width: 400px;
|
||||
color:black;
|
||||
/* =============================================================================
|
||||
Mediaquerie stuff goes here
|
||||
========================================================================== */
|
||||
/* 100px and greater */
|
||||
@media only screen and (min-width: 100px) {
|
||||
h1 {font-size: 1em;}
|
||||
.container { width:100%; }
|
||||
}
|
||||
|
||||
.entries > .bookpopup, .entries > .bookdetail
|
||||
{
|
||||
background-color: white;
|
||||
margin-bottom: 5px;
|
||||
padding: 6px;
|
||||
/* 320px and greater */
|
||||
@media only screen and (min-width: 320px) {
|
||||
h1 {font-size: 1.2em;}
|
||||
}
|
||||
|
||||
.content
|
||||
{
|
||||
line-height: 110%;
|
||||
/* 480px and greater */
|
||||
@media only screen and (min-width: 480px) {
|
||||
h1 {font-size: 1.5em;}
|
||||
}
|
||||
|
||||
/* 810px and greater */
|
||||
@media only screen and (min-width: 768px) {
|
||||
h1 {font-size: 2em;}
|
||||
.container { box-shadow:0 0 20px #000; }
|
||||
body { margin: 5px; }
|
||||
}
|
||||
Loading…
Reference in a new issue