diff options
-rw-r--r-- | ext/bg/js/templates.js | 33 | ||||
-rw-r--r-- | ext/fg/css/frame.css | 40 | ||||
-rw-r--r-- | util/tmpl/kanji.html | 44 |
3 files changed, 70 insertions, 47 deletions
diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js index 092d4e64..bbab099c 100644 --- a/ext/bg/js/templates.js +++ b/ext/bg/js/templates.js @@ -19,37 +19,42 @@ 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 " <dl class=\"kanji-info\">\n <dt>Meanings</dt>\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 : "") - + " </dl>\n"; + + " </dd>\n"; },"2":function(container,depth0,helpers,partials,data) { - return " <dd>" + var stack1; + + return " " + container.escapeExpression(container.lambda(depth0, depth0)) - + "</dd>\n"; -},"4":function(container,depth0,helpers,partials,data) { + + ((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"; +},"3":function(container,depth0,helpers,partials,data) { + return ", "; +},"5":function(container,depth0,helpers,partials,data) { var stack1; - return " <dl class=\"kanji-info\">\n <dt>Kun</dt>\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 : "") - + " </dl>\n"; -},"6":function(container,depth0,helpers,partials,data) { + + " </dd>\n"; +},"7":function(container,depth0,helpers,partials,data) { var stack1; - return " <dl class=\"kanji-info\">\n <dt>On</dt>\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 : "") - + " </dl>\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\">" + 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" + + "</div>\n\n <dl class=\"kanji-info\">\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(4, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") + + ((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(6, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "") - + "</div>\n</div>\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"; },"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 832e189a..dae244fa 100644 --- a/ext/fg/css/frame.css +++ b/ext/fg/css/frame.css @@ -43,18 +43,6 @@ body { display: inline-block; } -.kanji-glyph { - font-family: "KanjiStrokeOrders"; - font-size: 140px; - line-height: 140px; - vertical-align: top; -} - -.kanji-info { - float: left; - display: inline-block; -} - .tag { border-radius: 0.25em; color: #fff; @@ -85,6 +73,17 @@ 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; } @@ -97,6 +96,23 @@ li span { color: #000; } +dl { + padding: 0.5em; +} + dt { + float: left; + clear: left; + width: 100px; + text-align: right; font-weight: bold; } + +dt:after { + content: ":"; +} + +dd { + margin: 0 0 0 110px; + padding: 0 0 0.5em 0; +} diff --git a/util/tmpl/kanji.html b/util/tmpl/kanji.html index 603872ae..b52f29f5 100644 --- a/util/tmpl/kanji.html +++ b/util/tmpl/kanji.html @@ -1,31 +1,33 @@ <div class="definition"> <div class="kanji-info kanji-glyph">{{character}}</div> - {{#if glossary}} <dl class="kanji-info"> + {{#if glossary}} <dt>Meanings</dt> - {{#each glossary}} - <dd>{{.}}</dd> - {{/each}} - </dl> - {{/if}} + <dd> + {{#each glossary}} + {{.}}{{#unless @last}}, {{/unless}} + {{/each}} + </dd> + {{/if}} - {{#if kunyomi}} - <dl class="kanji-info"> - <dt>Kun</dt> - {{#each kunyomi}} - <dd>{{.}}</dd> - {{/each}} - </dl> - {{/if}} + {{#if kunyomi}} + <dt>Kunyomi</dt> + <dd> + {{#each kunyomi}} + {{.}}{{#unless @last}}, {{/unless}} + {{/each}} + </dd> + {{/if}} - {{#if onyomi}} - <dl class="kanji-info"> - <dt>On</dt> - {{#each onyomi}} - <dd>{{.}}</dd> - {{/each}} + {{#if onyomi}} + <dt>Onyomi</dt> + <dd> + {{#each onyomi}} + {{.}}{{#unless @last}}, {{/unless}} + {{/each}} + </dd> + {{/if}} </dl> - {{/if}} </div> </div> |