use html5 elements (section, footer)
authorMischa POSLAWSKY <perl@shiar.org>
Fri, 18 Dec 2009 01:16:13 +0000 (01:16 +0000)
committerMischa POSLAWSKY <perl@shiar.org>
Fri, 18 Dec 2009 01:16:13 +0000 (01:16 +0000)
base.css
charset.plp
common.inc.plp
index.plp
red.css
termcol.plp
unicode.plp

index 139c94cce350e6cebc01e4ff58c15b54449a87e3..b22c0386117b096a17eea5f1064d2c1a62069b85 100644 (file)
--- a/base.css
+++ b/base.css
@@ -36,19 +36,22 @@ hr {
        margin: 0;
 }
 
-.section ul {
+section {
+       display: block;
+}
+section ul {
        margin-bottom: 1ex;
 }
-.section h2 {
+section h2 {
        margin: 0 1ex;
        clear: both;
 }
-.section table {
+section table {
        float: left;
        position: relative; /* prevents buggy hovering in table if caption present in gecko */
        margin: 1ex 1ex 2ex;
 }
-#charset .section table {
+#charset section table {
        margin: -0.5ex 0 1ex; /* headers provide sufficient spacing already */
 }
 
@@ -58,10 +61,10 @@ p {
 p.aside {
        font-size: 80%;
 }
-p.footer {
+footer p {
        margin: 1em 0 0;
 }
-.help + .footer {
+.help + footer p {
        margin: 0;
 }
 
@@ -241,7 +244,7 @@ table.glyphs.dimap {
 .diinfo {
        -moz-column-width: 24em;
 }
-.diinfo > div {
+.diinfo > section {
        overflow: hidden;
 }
 
index e2b2e277725fa1bd6204c87d962880f7a88ffde9..e84ae8261b63cc22f957afc310dc801b68645b85 100644 (file)
@@ -99,7 +99,7 @@ for my $cp437 (grep {$request[$_]->{set} eq 'cp437'} 0 .. $#request) {
 
 my @nibble = (0..9, 'A'..'F');
 for my $row (@request) {
-       printf '<div class="section"><table class="glyphs%s">', !$row->{cell} && ' charmap';
+       printf '<section><table class="glyphs%s">', !$row->{cell} && ' charmap';
        printf '<caption>%s</caption>', $row->{set};
        print '<col>' x 17;
        for my $section (qw{thead}) {
@@ -144,7 +144,7 @@ for my $row (@request) {
                }
                print "\n";
        }
-       print "</table></div>\n";
+       print "</table></section>\n";
 }
 
 :>
index fb1d54ac32d00c0b4fa76ef80c5f4961b9a6d320..e48cd2ce22d012023e19e65f8b48800faa4144aa 100644 (file)
@@ -57,6 +57,7 @@ sub Html {
        ref $_ eq 'ARRAY' and $_ = join ' ',  @$_ for $meta->{description};
        ref $_ eq 'ARRAY' and $_ = join ', ', @$_ for $meta->{keywords};
        ref $_ eq 'ARRAY' and $_ = join "\n", @$_ for $meta->{rawstyle}, $meta->{raw};
+       ref $_ eq 'ARRAY' and $_ = stylesheet(@$_)."\n" for $meta->{stylesheet};
 
        # other vars
        my $sep = $meta->{charset} eq 'utf-8' ? '•' : ' -- ';
@@ -65,8 +66,7 @@ sub Html {
        # leading output
        $header{content_type} = "text/html; charset=$meta->{charset}";
        print <<"EOT";
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
+<!DOCTYPE HTML>
 <html lang="en">
 
 <head>
@@ -76,14 +76,14 @@ sub Html {
 <meta name="keywords" content="$meta->{keywords}">
 <link rel="icon" type="image/png" href="/clip.png">
 EOT
-       print stylesheet(@$_), "\n" for $meta->{stylesheet} || ();
+       print $_, "\n" for $meta->{stylesheet} || ();
        print $_, "\n" for $meta->{raw} || ();
        print qq{</head>\n\n<body id="$file">\n};
 
        # prepare trailing output
        PLP_END {
                print <<"EOT";
-<p class="footer">
+<footer><p>
        <a href="/" rel="home">sheet.shiar.nl</a>/$file.<a href="/source/$file.plp"
         rel="code" title="Written in Perl">plp</a>
        <a href="http://git.shiar.nl/sheet.git/history/HEAD:/$file.plp"
@@ -91,7 +91,7 @@ EOT
        created by <a href="http://shiar.nl/" rel="author">Shiar</a> $sep
        <a href="http://www.fsf.org/licensing/licenses/agpl-3.0.html" rel="copyright"
         title="Licensed under the GNU Affero General Public License, version 3">AGPLv3</a>
-</p>
+</p></footer>
 
 </html>
 EOT
index 839392dc35ed4d5336d5f7b8d51cbe3613474acd..1a48c15d1cbb50df7e3e12bd6bb60a7a158130d0 100644 (file)
--- a/index.plp
+++ b/index.plp
@@ -23,7 +23,7 @@ Originally created by Mischa <span style="font-variant:small-caps">Poslawsky</sp
 but you're free to use, print, alter, and redistribute under the AGPL license.
 </p>
 
-<div class="section">
+<section>
 <h2>Keyboard maps</h2>
 <ul>
 <li><a href="/readline">readline</a>
@@ -33,22 +33,22 @@ but you're free to use, print, alter, and redistribute under the AGPL license.
 <li><a href="/nethack">nethack</a>
 <li><a href="/mplayer">mplayer</a>
 </ul>
-</div>
+</section>
 
-<div class="section">
+<section>
 <h2>Unicode characters</h2>
 <ul>
 <li><a href="/charset">charsets</a>
 <li><a href="/unicode">common glyphs</a>
 <li><a href="/digraphs">digraphs</a>
 </ul>
-</div>
+</section>
 
-<div class="section">
+<section>
 <h2>Other references</h2>
 <ul>
 <li><a href="/countries">country codes</a>
 <li><a href="/termcol">terminal colours</a>
 </ul>
-</div>
+</section>
 
diff --git a/red.css b/red.css
index e953f5b8fcb87521eee5dd8f4d0e8b371205611d..fabe9a6659d7ca842b6a1f0477128f501c735357 100644 (file)
--- a/red.css
+++ b/red.css
@@ -20,7 +20,7 @@ h1 {
 h2, caption {
        text-shadow: #F00 0 0 1em, #F00 0 0 1ex;
 }
-p.footer {
+footer p {
        border: 1px dashed #600;
        border-width: 1px 0 0;
        margin-top: 1.5em;
index 4b9103288e5643c4910815c01b334c7948c37d37..ad6ae77836764c05b34f21c3241e2cf38c93fbe9 100644 (file)
@@ -18,7 +18,7 @@ use List::Util 'min';
 :>
 <h1>Terminal colours</h1>
 
-<div class="section">
+<section>
 <:
 sub luminance {
        # perceived brightness (using ITU-R recommendation 601 luma co-efficients)
@@ -83,11 +83,11 @@ for my $term (qw/html cga xterm tango/) {
        }
        print "</table>\n\n";
 }
-:></div>
+:></section>
 
 <hr>
 
-<div class="section">
+<section>
 <h2>88-colour space</h2>
 <:
 for my $r (0 .. 3) {
@@ -107,11 +107,11 @@ print '<table><tr>';
 print colcell(80+$_, (($_ + 2 + ($_>0)) * 255/11) x 3) for 0 .. 7;
 print "</table>\n\n";
 
-:></div>
+:></section>
 <: if ($ENV{PATH_INFO} =~ /256/) { :>
 <hr>
 
-<div class="section">
+<section>
 <h2>256-colour space</h2>
 <:
 for my $r (0 .. 5) {
@@ -134,7 +134,7 @@ for my $row (0, 12) {
 }
 print "\n";
 
-:></div>
+:></section>
 <: } :>
 <hr>
 
index 4a6856e817d84df1c22ba4a821726d74bebfd7be..a2e834a2fb24fbe3c543f9ba24f767b4f59c068b 100644 (file)
@@ -119,11 +119,11 @@ sub glyph_table {
 
 sub print_glyph_tables {
        while (@_) {
-               printf '<div class="section"><h2>%s</h2>'."\n\n", shift;
+               printf '<section><h2>%s</h2>'."\n\n", shift;
                while (ref $_[0] and $_ = shift) {
                        print glyph_table($_);
                }
-               print '</div>';
+               print '</section>';
        }
 }