X-Git-Url: http://git.shiar.net/sheet.git/blobdiff_plain/fd049eb294bf4536e0507a7591fd9be3a0567d9c..e327cdf7ff4bb2ce54fead5b7fcc480d4a3cec3e:/writing-latn.inc.pl

diff --git a/writing-latn.inc.pl b/writing-latn.inc.pl
index 42a680c..76b2f6c 100644
--- a/writing-latn.inc.pl
+++ b/writing-latn.inc.pl
@@ -15,10 +15,10 @@ my @wrapstyle = (
 	'td { white-space: normal; word-spacing: 10em }',
 		# force line break between words
 	'.sample { word-spacing: 0 }',
-	'.sample span { margin-right: 1ex; white-space: nowrap; display: inline-block }',
+	'.sample svg { margin-right: 1ex; white-space: nowrap; display: inline-block }',
 		# larger space between letters
 );
-my $spacestyle = '.sample span { margin-right: 0.5ex }';  # separate letters
+my $spacestyle = '.sample svg { margin-right: 0.5ex }';  # separate letters
 my @tapstyle = (
 	@wrapstyle,
 	'{ line-height: 1ex }',
@@ -81,10 +81,15 @@ sub dispblock {
 		v 45,50%  i 165,50%  o 165,0%
 	);
 	s/\z(?<!%)/,100%/ for values %col;
+	my @gaps = (grep $_,
+		$code =~ /[Ii]$|T[23]|L3?$|S1|Z$|J1|v3?$/ ? 'gapl1' : (),
+		$code =~ /T$|L2|Z$/ ? 'gapr1' : (),
+	);
 	return sprintf(
-		'<svg height="24" viewBox="-.5 -.5 %s 4">'
+		'<svg height="24" viewBox="-.5 -.5 %s 4"%s>'
 		. '<path d="%s" stroke="%s" fill="none"%s /></svg>',
 		$code eq 'I' ? 4 : $code =~ /T3|[LJO]$|[Iio]1/ ? 2 : 3,
+		@gaps ? qq( class="@gaps") : '',
 		$path{$shape}, "hsl($col{$shape},50%)", join('',
 			$rotate && sprintf(' transform="rotate(%s 1 1)"', $rotate * 90),
 			$prefix && ' style="opacity:.5"',
@@ -153,7 +158,7 @@ roman => {
 	name => 'Old Roman Cursive',
 	style => [
 		'svg path { stroke-linecap: round; stroke-linejoin: round }',
-		'.sample span { margin-right: -10px }',
+		'.sample svg { margin-right: -10px }',
 	],
 	list => [
 		map {
@@ -369,6 +374,7 @@ domino => {
 tetromino => {
 	style => [
 		'svg path { stroke-linecap: square }',
+		'.sample .gapl1 + .gapr1 { margin-left: -6.3px }',
 	],
 	name => 'Tetrominos',
 	list => [map { dispblock($_) } qw{
@@ -643,7 +649,7 @@ dni => {
 	name => "D'ni",
 	style => [
 		'svg { border: 1px solid currentColor }',
-		'.sample span + span svg { border-left: 0 }',
+		'.sample svg + svg { border-left: 0 }',
 	],
 	list => [
 		map {
@@ -726,7 +732,10 @@ nyctographs => {
 },
 chromacons => {
 	title => 'Colour Alphabet by Paul Green-Armytage (2010)',
-#	style => '.sample { word-break: break-all }',
+	style => [
+		#'.sample { word-break: break-all }',
+		'.sample { background: white }',
+	],
 	list => [
 		map {
 			sprintf('<span%s>%s</span>',