cc: alternate stylesheets
authorMischa POSLAWSKY <perl@shiar.org>
Tue, 13 Oct 2009 03:53:35 +0000 (03:53 +0000)
committerMischa POSLAWSKY <perl@shiar.org>
Tue, 13 Oct 2009 22:38:42 +0000 (22:38 +0000)
cc.plp
dark.css
mono.css
red.css

diff --git a/cc.plp b/cc.plp
index 08a2341b2dc67434b827155f4b499b585c56c482..21626688ce0673c32135297ad68ffa578acce53a 100644 (file)
--- a/cc.plp
+++ b/cc.plp
@@ -15,7 +15,13 @@ $header{content_type} = 'text/html; charset=utf-8';
 <head>
 <meta http-equiv="content-type" content="<:= $header{content_type} :>">
 <title>country code cheat sheet</title>
-<link rel="stylesheet" type="text/css" media="all" href="/base.css">
+<link rel="stylesheet" type="text/css" media="all" href="/base.css"><:
+       my %styles = map {$_ => $_} qw(dark mono red);
+       our $style = exists $get{style} && $styles{$get{style}} || 'light';
+       printf(qq{\n<link rel="%s" type="text/css" media="all" href="%s" title="%s">},
+               $_ eq $style ? 'stylesheet' : 'alternate stylesheet', "/$_.css", $_
+       ) for keys %styles;
+:>
 </head>
 
 <body>
@@ -34,7 +40,7 @@ sub quote {
 
 {
        printf '<table class="mcmap">';
-       print '<col>';
+       print '<col><colgroup span="26">';
        for my $section (qw{thead}) {
                print "<$section><tr><th>↱";
                print '<th>', $_ for 'a' .. 'z';
@@ -89,11 +95,11 @@ sub quote {
        <td class="X c-af">africa
        <td class="X c-eu">europe
        <td class="X c-as">asia
-       <td class="X c-oc">oceania
        <td class="X c-aa">antarctica
+       <td class="X c-oc">oceania
        <td class="X c-sa">south america
        <td class="X c-na">north america
-       <td class="X Xi">reserved
+       <td class="">reserved
        <td class="X Co">user-assigned
        </table>
 </div>
index 732a5633c4a7cf3b1607137730c09ada7160a014..878c560b92ebbd215d336381c256a7c952c982bc 100644 (file)
--- a/dark.css
+++ b/dark.css
@@ -70,6 +70,7 @@ th, td {
 
 td.X  {background: #000} /* unidentified */
 td.Xr {background: #111} /* reverse */
+td.Co {background: #181111} /* private */
 
 /* implementation-based alternatives */
 td.di-b       {background: #411} /* bmp */
@@ -79,6 +80,15 @@ td.di-a       {background: #131} /* ascii */
 td.di-rare    {background: #181818} /* disfavoured */
 td.di-invalid {background: #222} /* impossible */
 
+/* continents */
+td.c-af       {background: #1C1C00}
+td.c-eu       {background: #221400}
+td.c-as       {background: #200}
+td.c-oc       {background: #102}
+td.c-aa       {background: #012}
+td.c-sa       {background: #001A1A}
+td.c-na       {background: #001800}
+
 .glyphs tbody td:hover {color: #000}
 .glyphs tbody td:hover small {color: #FFF}
 
index 30f878a835d2349f13d81c4b074985ebeecb6167..432b12b5540ca19dbe8a362f41077840d847dc97 100644 (file)
--- a/mono.css
+++ b/mono.css
@@ -21,6 +21,8 @@ body ul.keys li.new {
        border-color: #888;
 }
 
+td.Co {background: #FFF} /* private */
+
 /* code syntax */
 #source pre    { color: #444 }
 .sy-comment    { color: #888; text-shadow: #888 0 0 1em }
@@ -33,3 +35,12 @@ body ul.keys li.new {
 .sy-error      { font-weight: bold; background-color: #000; color: #FFF }
 .sy-todo       { background-color: #CCC }
 
+/* continents */
+td.c-af       {background: #000; color: #FFF}
+td.c-eu       {background: #333; color: #FFF}
+td.c-as       {background: #666; color: #FFF}
+td.c-aa       {background: #999; color: #FFF}
+td.c-oc       {background: #BBB}
+td.c-sa       {background: #999}
+td.c-na       {background: #666}
+
diff --git a/red.css b/red.css
index 85938a90f410cc0a2a6371d487d681d786bf0138..5f9c06cf96ef7c449d848906cda4448e0ae448f6 100644 (file)
--- a/red.css
+++ b/red.css
@@ -61,6 +61,32 @@ dt.pm, dt.mv,
        color: #FF0;
 } /* mode link */
 
+td.X { /* unidentified */
+       background: #000;
+       border-color: #800;
+       border-width: 1px;
+}
+th, td, td.Co {
+       background: #000;
+       border-color: #300;
+       border-width: 1px 0 0 1px; /* no precedence */
+}
+td.Co {background: #200 } /* private */
+tbody, colgroup, th {
+       background: #800 !important;
+       border: 1px solid #800;
+}
+
+/* continents */
+td.c-af       {background: #100; color: #FFF}
+td.c-eu       {background: #300; color: #FFF}
+td.c-as       {background: #500; color: #FFF}
+td.c-aa       {background: #400; color: #8BC}
+td.c-oc       {background: #100; color: #8BC}
+td.c-sa       {background: #100; color: #DD6}
+td.c-na       {background: #300; color: #DD6}
+td.X:hover    {background: #800; color: #FF0}
+
 /* code syntax */
 .sy-comment    { color: #888 }
 .sy-constant   { color: #C88 }