Kanji page cleanup

3 files changed, 55 insertions, 63 deletions

diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js
index bbab099c..f9f4e361 100644
--- a/ext/bg/js/templates.js
+++ b/ext/bg/js/templates.js
@@ -19,13 +19,13 @@ templates['header.html'] = template({"compiler":[7,">= 4.0.0"],"main":function(c
 templates['kanji.html'] = template({"1":function(container,depth0,helpers,partials,data) {
     var stack1;
 
-  return "        <dt>Meanings</dt>\n        <dd>\n"
+  return "            <dt>Meanings</dt>\n            <dd>\n"
     + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.glossary : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
-    + "        </dd>\n";
+    + "            </dd>\n";
 },"2":function(container,depth0,helpers,partials,data) {
     var stack1;
 
-  return "            "
+  return "                "
     + container.escapeExpression(container.lambda(depth0, depth0))
     + ((stack1 = helpers.unless.call(depth0 != null ? depth0 : {},(data && data.last),{"name":"unless","hash":{},"fn":container.program(3, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
     + "\n";
@@ -34,27 +34,27 @@ templates['kanji.html'] = template({"1":function(container,depth0,helpers,partia
 },"5":function(container,depth0,helpers,partials,data) {
     var stack1;
 
-  return "        <dt>Kunyomi</dt>\n        <dd>\n"
+  return "            <dt>Kunyomi</dt>\n            <dd>\n"
     + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.kunyomi : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
-    + "        </dd>\n";
+    + "            </dd>\n";
 },"7":function(container,depth0,helpers,partials,data) {
     var stack1;
 
-  return "        <dt>Onyomi</dt>\n        <dd>\n"
+  return "            <dt>Onyomi</dt>\n            <dd>\n"
     + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.onyomi : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
-    + "        </dd>\n";
+    + "            </dd>\n";
 },"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) {
     var stack1, helper, alias1=depth0 != null ? depth0 : {};
 
-  return "<div class=\"definition\">\n    <div class=\"kanji-info kanji-glyph\">"
+  return "<div class=\"kanji-definition\">\n    <div class=\"kanji-glyph\">"
     + container.escapeExpression(((helper = (helper = helpers.character || (depth0 != null ? depth0.character : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(alias1,{"name":"character","hash":{},"data":data}) : helper)))
-    + "</div>\n\n    <dl class=\"kanji-info\">\n"
+    + "</div>\n    <div class=\"kanji-info\">\n        <dl>\n"
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.glossary : depth0),{"name":"if","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
     + "\n"
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.kunyomi : depth0),{"name":"if","hash":{},"fn":container.program(5, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
     + "\n"
     + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.onyomi : depth0),{"name":"if","hash":{},"fn":container.program(7, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
-    + "    </dl>\n</div>\n</div>\n";
+    + "        </dl>\n    </div>\n</div>\n</div>\n";
 },"useData":true});
 templates['kanji-link.html'] = template({"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) {
     var helper;
diff --git a/ext/fg/css/frame.css b/ext/fg/css/frame.css
index dae244fa..bb0b3abf 100644
--- a/ext/fg/css/frame.css
+++ b/ext/fg/css/frame.css
@@ -73,17 +73,6 @@ body {
     background-color: #0275d8;
 }
 
-.kanji-glyph {
-    font-family:      "KanjiStrokeOrders";
-    font-size:        140px;
-    line-height:      140px;
-    vertical-align:   top;
-}
-
-.kanji-info {
-    display: inline-block;
-}
-
 ol {
     padding-left: 1.2em;
 }
@@ -96,23 +85,25 @@ li span {
     color: #000;
 }
 
-dl {
-    padding: 0.5em;
+.kanji-glyph {
+    float:          left;
+    font-family:    "KanjiStrokeOrders";
+    font-size:      140px;
+    line-height:    140px;
+    padding:        0.01em;
+    vertical-align: top;
 }
 
-dt {
-    float: left;
-    clear: left;
-    width: 100px;
-    text-align: right;
-    font-weight: bold;
+.kanji-info {
+    display:  block;
+    overflow: hidden;
 }
 
-dt:after {
-    content: ":";
+.kanji-info dt {
+    font-weight: bold;
 }
 
-dd {
-    margin: 0 0 0 110px;
-    padding: 0 0 0.5em 0;
+.kanji-info dd {
+    margin-left: 1.2em;
 }
+
diff --git a/util/tmpl/kanji.html b/util/tmpl/kanji.html
index b52f29f5..c1883b19 100644
--- a/util/tmpl/kanji.html
+++ b/util/tmpl/kanji.html
@@ -1,33 +1,34 @@
-<div class="definition">
-    <div class="kanji-info kanji-glyph">{{character}}</div>
+<div class="kanji-definition">
+    <div class="kanji-glyph">{{character}}</div>
+    <div class="kanji-info">
+        <dl>
+            {{#if glossary}}
+            <dt>Meanings</dt>
+            <dd>
+                {{#each glossary}}
+                {{.}}{{#unless @last}}, {{/unless}}
+                {{/each}}
+            </dd>
+            {{/if}}
 
-    <dl class="kanji-info">
-        {{#if glossary}}
-        <dt>Meanings</dt>
-        <dd>
-            {{#each glossary}}
-            {{.}}{{#unless @last}}, {{/unless}}
-            {{/each}}
-        </dd>
-        {{/if}}
+            {{#if kunyomi}}
+            <dt>Kunyomi</dt>
+            <dd>
+                {{#each kunyomi}}
+                {{.}}{{#unless @last}}, {{/unless}}
+                {{/each}}
+            </dd>
+            {{/if}}
 
-        {{#if kunyomi}}
-        <dt>Kunyomi</dt>
-        <dd>
-            {{#each kunyomi}}
-            {{.}}{{#unless @last}}, {{/unless}}
-            {{/each}}
-        </dd>
-        {{/if}}
-
-        {{#if onyomi}}
-        <dt>Onyomi</dt>
-        <dd>
-            {{#each onyomi}}
-            {{.}}{{#unless @last}}, {{/unless}}
-            {{/each}}
-        </dd>
-        {{/if}}
-    </dl>
+            {{#if onyomi}}
+            <dt>Onyomi</dt>
+            <dd>
+                {{#each onyomi}}
+                {{.}}{{#unless @last}}, {{/unless}}
+                {{/each}}
+            </dd>
+            {{/if}}
+        </dl>
+    </div>
 </div>
 </div>