<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>
{
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';
<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>
td.X {background: #000} /* unidentified */
td.Xr {background: #111} /* reverse */
+td.Co {background: #181111} /* private */
/* implementation-based alternatives */
td.di-b {background: #411} /* bmp */
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}
border-color: #888;
}
+td.Co {background: #FFF} /* private */
+
/* code syntax */
#source pre { color: #444 }
.sy-comment { color: #888; text-shadow: #888 0 0 1em }
.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}
+
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 }