implement dark styling for digraphs
authorMischa POSLAWSKY <perl@shiar.org>
Wed, 4 Feb 2009 23:57:20 +0000 (23:57 +0000)
committerMischa POSLAWSKY <perl@shiar.org>
Wed, 22 Apr 2009 00:01:11 +0000 (00:01 +0000)
base.css
dark.css
digraphs.plp
unicode.plp

index 918d8242cf1c1ef30205d6f3bbe7f4389af81937..0922dc47bbc50e0c698d032c8a4869dd6adc5ea8 100644 (file)
--- a/base.css
+++ b/base.css
@@ -152,7 +152,7 @@ table.glyphs {
 .glyphs th,
 .glyphs thead td {
        border: 0;
 .glyphs th,
 .glyphs thead td {
        border: 0;
-       background: transparent;
+       background: transparent !important;
 }
 .glyphs thead td {
        width: auto; /* no glyph cells in header */
 }
 .glyphs thead td {
        width: auto; /* no glyph cells in header */
index e230e1a863e2e69bcb177121521c56cde2329937..dd54f48d0de613ce5578bc0c4f936079b790ad47 100644 (file)
--- a/dark.css
+++ b/dark.css
@@ -36,3 +36,38 @@ dl.legend-options dt {background: #333}
        color: #000; /* on default (light) background hover */
 } /* mode link */
 
        color: #000; /* on default (light) background hover */
 } /* mode link */
 
+/* character properties */
+
+.glyphs th, .glyphs td {
+       border-color: #333;
+       background: #181818;
+}
+.glyphs.dimap tbody, .glyphs.dimap colgroup {
+       border-color: #555;
+}
+
+.glyphs small.digraph {
+       background: #444;
+       color: #000;
+       opacity: 0.5;
+}
+.glyphs small.value {
+       background: #633;
+       color: #000;
+       opacity: 0.4;
+}
+
+td.X  {background: #000} /* unidentified */
+td.Xr {background: #111} /* reverse */
+
+/* implementation-based alternatives */
+td.di-b       {background: #411} /* bmp */
+td.di-d       {background: #330} /* rfc-1345 digraph */
+td.di-prop    {background: #420} /* proposed digraph */
+td.di-a       {background: #131} /* ascii */
+td.di-rare    {background: #181818} /* disfavoured */
+td.di-invalid {background: #222} /* impossible */
+
+.glyphs tbody td:hover {color: #000}
+.glyphs tbody td:hover small {color: #FFF}
+
index 98fba89ae9acdec63b9d9f4158e68d17a4d7f367..73189c9d0522ae66f162bacf27e4ba13a1a1d0d0 100644 (file)
@@ -16,7 +16,13 @@ $header{content_type} = 'text/html; charset=utf-8';
 <head>
 <title>digraph cheat sheet</title>
 <meta http-equiv="content-type" content="utf-8">
 <head>
 <title>digraph cheat sheet</title>
 <meta http-equiv="content-type" content="utf-8">
-<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 circus mono red terse);
+       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 id="digraphs">
 </head>
 
 <body id="digraphs">
index cc133d534442b1b1c07cc7d87dcfdfde26f203cc..25f89de638afb27cdbe212c52b7cea65eb9e5d63 100644 (file)
@@ -16,7 +16,13 @@ $header{content_type} = 'text/html; charset=utf-8';
 <head>
 <title>digraph cheat sheet</title>
 <meta http-equiv="content-type" content="utf-8">
 <head>
 <title>digraph cheat sheet</title>
 <meta http-equiv="content-type" content="utf-8">
-<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 circus mono red terse);
+       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 id="unicode">
 </head>
 
 <body id="unicode">