Change: change main template to HTML5

- semantic HTML5-elements in the main template
- matching selectors for screen.css and print.css (no change of rules)
This commit is contained in:
Heiko August 2020-04-27 11:16:16 +02:00
parent ca31135c36
commit b13bfd52bb
3 changed files with 53 additions and 48 deletions

View file

@ -3,7 +3,7 @@
*/ */
/* -- hide -- */ /* -- hide -- */
#subnav, .skip, .entryform, .hidecomments, #entryform, hr { display: none; } aside, #subnav, .skip, .entryform, .hidecomments, #entryform, hr { display: none; }
/* -- main settings -- */ /* -- main settings -- */
body { font-family: Georgia, "Times New Roman", Times, serif; } body { font-family: Georgia, "Times New Roman", Times, serif; }
@ -12,8 +12,8 @@
/* -- links -- */ /* -- links -- */
a { text-decoration: none; } a { text-decoration: none; }
#main a:after { font-size: 70%; content:" <"attr(href)">"; } main a:after { font-size: 70%; content:" <"attr(href)">"; }
#main .meta a:after, #main h2 a:after { content:""; } main .meta a:after, main h2 a:after { content:""; }
/* -- comments -- */ /* -- comments -- */
ul#commentslist { list-style-type: none; } ul#commentslist { list-style-type: none; }

View file

@ -26,7 +26,7 @@
border-top: 0; border-top: 0;
position: relative; position: relative;
} }
#main { main {
margin: 0 0 0 25px; margin: 0 0 0 25px;
padding: 190px 0 2em 0; padding: 190px 0 2em 0;
width: 64.5%; width: 64.5%;
@ -34,7 +34,7 @@
} }
/* Clearfix-Hack */ /* Clearfix-Hack */
#main:after { main:after {
content: "."; content: ".";
display: block; display: block;
height: 0; height: 0;
@ -42,11 +42,11 @@
visibility: hidden; visibility: hidden;
} }
#main {display: inline-table;} main {display: inline-table;}
/* Hides from IE-mac \*/ /* Hides from IE-mac \*/
* html #main {height: 1%;} * html main {height: 1%;}
#main {display: block;} main {display: block;}
/* End hide from IE-mac */ /* End hide from IE-mac */
/* -- logo -- */ /* -- logo -- */
@ -98,7 +98,7 @@
.rss img { vertical-align: middle; border: 0; width: 94px; height: 15px; } .rss img { vertical-align: middle; border: 0; width: 94px; height: 15px; }
/* -- footer -- */ /* -- footer -- */
#footer { footer {
clear: both; clear: both;
height: 60px; height: 60px;
background: url(img/footer.png) no-repeat top center; background: url(img/footer.png) no-repeat top center;
@ -132,13 +132,13 @@
/* -- pictures -- */ /* -- pictures -- */
.fl { float: left; margin: 0 1em 1em 0; } .fl { float: left; margin: 0 1em 1em 0; }
.fr { float: right; margin: 0 0 1em 1em; } .fr { float: right; margin: 0 0 1em 1em; }
#main img, dl.img { main img, dl.img {
border: 1px solid #aaa; border: 1px solid #aaa;
padding: 2px; padding: 2px;
max-width: 95%; max-width: 95%;
} }
dl.img dt { padding: 0; margin: 0;} dl.img dt { padding: 0; margin: 0;}
#main dl.img dt img { margin: 0; padding: 0; max-width: 100%; border: none; } main dl.img dt img { margin: 0; padding: 0; max-width: 100%; border: none; }
dl.img dd { margin: 0; padding: 0 0.3em; font-size: 90%; } dl.img dd { margin: 0; padding: 0 0.3em; font-size: 90%; }
.teaser { clear: both; } .teaser { clear: both; }

View file

@ -1,23 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html>
<head> <html lang="<jlog:html-language />">
<head>
<title><jlog:title /> - <jlog:website /></title> <title><jlog:title /> - <jlog:website /></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<jlog:aditional-header /> <jlog:aditional-header />
<link rel="stylesheet" href="<jlog:homelink />/personal/css/print.css" type="text/css" media="print" /> <link rel="stylesheet" href="<jlog:homelink />/personal/css/print.css" type="text/css" media="print" />
<link rel="stylesheet" href="<jlog:homelink />/personal/css/screen.css" type="text/css" media="screen, projection" /> <link rel="stylesheet" href="<jlog:homelink />/personal/css/screen.css" type="text/css" media="screen, projection" />
<!--[if lte IE 6]><link rel="stylesheet" href="<jlog:homelink />/personal/css/ielte6.css" type="text/css" media="screen" /><![endif]--> </head>
</head> <body>
<body>
<p class="skip"><a href="#main"><jlog:skipcontent /></a></p> <p class="skip"><a href="#main"><jlog:skipcontent /></a></p>
<div id="container"><span id="pokal"></span> <div id="container">
<span id="pokal"></span>
<header>
<h1><a title="<jlog:home />" href="<jlog:homelink />/"><jlog:website /></a></h1> <h1><a title="<jlog:home />" href="<jlog:homelink />/"><jlog:website /></a></h1>
</header>
<aside>
<dl id="subnav"> <dl id="subnav">
<dt class="first"><jlog:slogan-h /></dt> <dt class="first"><jlog:slogan-h /></dt>
<dd><jlog:slogan /></dd> <dd><jlog:slogan /></dd>
<dt><jlog:search-h /></dt> <dt><jlog:search-h /></dt>
<dd> <dd>
<form action="<jlog:homelink />/search.php"> <form action="<jlog:homelink />/search.php">
<p><input class="userdata" type="text" name="q" size="15" value="" /> <p><input class="userdata" type="search" name="q" size="15" value="" />
<input class="send" type="submit" value="<jlog:search />" /></p> <button class="send" type="submit" value="<jlog:search />"><jlog:search /></button></p>
</form> </form>
</dd> </dd>
<dt><jlog:categorieslist-h /></dt> <dt><jlog:categorieslist-h /></dt>
@ -30,11 +35,11 @@
<dd><jlog:copyright /></dd> <dd><jlog:copyright /></dd>
<dd><jlog:powered /></dd> <dd><jlog:powered /></dd>
</dl> </dl>
<div id="main"> </aside>
<main id="main">
<jlog:content /> <jlog:content />
<html lang="<jlog:html-language />"> </main>
<footer>&nbsp;</footer>
</div> </div>
<div id="footer">&nbsp;</div> </body>
</div>
</body>
</html> </html>