style fixes

This commit is contained in:
Alex Yatskov 2017-03-03 20:25:14 -08:00
parent faf13d696c
commit acb0bc2e9e
6 changed files with 136 additions and 186 deletions

View File

@ -284,19 +284,19 @@ templates['fields.html'] = template({"1":function(container,depth0,helpers,parti
templates['kanji.html'] = template({"1":function(container,depth0,helpers,partials,data) {
var stack1, helper, alias1=depth0 != null ? depth0 : {};
return "<div class=\"kanji-definition\">\n <div class=\"action-bar\">\n"
return "<p>\n <div class=\"actions\">\n"
+ ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.addable : depth0),{"name":"if","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </div>\n\n <div class=\"kanji-glyph\">"
+ " </div>\n\n <div class=\"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 class=\"kanji-reading\">\n <table>\n <tr>\n <th>Kunyomi:</th>\n <td>\n"
+ "</div>\n\n <div class=\"reading\">\n <table>\n <tr>\n <th>Kunyomi:</th>\n <td>\n"
+ ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.kunyomi : depth0),{"name":"each","hash":{},"fn":container.program(4, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </td>\n </tr>\n <tr>\n <th>Onyomi:</th>\n <td>\n"
+ ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.onyomi : depth0),{"name":"each","hash":{},"fn":container.program(4, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </td>\n </tr>\n </table>\n </div>\n\n <div class=\"kanji-tags\">\n"
+ " </td>\n </tr>\n </table>\n </div>\n\n <div>\n"
+ ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.tags : depth0),{"name":"each","hash":{},"fn":container.program(7, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </div>\n\n <div class=\"kanji-glossary\">\n"
+ " </div>\n\n <div class=\"glossary\">\n"
+ ((stack1 = helpers["if"].call(alias1,((stack1 = (depth0 != null ? depth0.glossary : depth0)) != null ? stack1["1"] : stack1),{"name":"if","hash":{},"fn":container.program(9, data, 0),"inverse":container.program(13, data, 0),"data":data})) != null ? stack1 : "")
+ " </div>\n</div>\n";
+ " </div>\n</p>\n";
},"2":function(container,depth0,helpers,partials,data) {
var helper;
@ -315,7 +315,7 @@ templates['kanji.html'] = template({"1":function(container,depth0,helpers,partia
},"7":function(container,depth0,helpers,partials,data) {
var helper, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression;
return " <span class=\"tag tag-"
return " <span class=\"label label-default tag-"
+ alias4(((helper = (helper = helpers.category || (depth0 != null ? depth0.category : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"category","hash":{},"data":data}) : helper)))
+ "\" title=\""
+ alias4(((helper = (helper = helpers.notes || (depth0 != null ? depth0.notes : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"notes","hash":{},"data":data}) : helper)))
@ -325,12 +325,12 @@ templates['kanji.html'] = template({"1":function(container,depth0,helpers,partia
},"9":function(container,depth0,helpers,partials,data) {
var stack1;
return " <ol \"kanji-glossary-group\">\n"
return " <ol>\n"
+ ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.glossary : depth0),{"name":"each","hash":{},"fn":container.program(10, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </ol>\n";
},"10":function(container,depth0,helpers,partials,data) {
var stack1, helper, options, buffer =
" <li><span class=\"kanji-glossary-item\">";
" <li><span class=\"glossary-item\">";
stack1 = ((helper = (helper = helpers.multiLine || (depth0 != null ? depth0.multiLine : depth0)) != null ? helper : helpers.helperMissing),(options={"name":"multiLine","hash":{},"fn":container.program(11, data, 0),"inverse":container.noop,"data":data}),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},options) : helper));
if (!helpers.multiLine) { stack1 = helpers.blockHelperMissing.call(depth0,stack1,options)}
if (stack1 != null) { buffer += stack1; }
@ -339,7 +339,7 @@ templates['kanji.html'] = template({"1":function(container,depth0,helpers,partia
return container.escapeExpression(container.lambda(depth0, depth0));
},"13":function(container,depth0,helpers,partials,data) {
var stack1, helper, options, buffer =
" <div class=\"kanji-glossary-group kanji-glossary-item\">";
" <div class=\"glossary-item\">";
stack1 = ((helper = (helper = helpers.multiLine || (depth0 != null ? depth0.multiLine : depth0)) != null ? helper : helpers.helperMissing),(options={"name":"multiLine","hash":{},"fn":container.program(14, data, 0),"inverse":container.noop,"data":data}),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},options) : helper));
if (!helpers.multiLine) { stack1 = helpers.blockHelperMissing.call(depth0,stack1,options)}
if (stack1 != null) { buffer += stack1; }
@ -402,13 +402,13 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
},"2":function(container,depth0,helpers,partials,data) {
var stack1;
return " <div class=\"term-tags\">\n"
return " <div>\n"
+ ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.tags : depth0),{"name":"each","hash":{},"fn":container.program(3, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </div>\n";
},"3":function(container,depth0,helpers,partials,data) {
var helper, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression;
return " <span class=\"tag tag-"
return " <span class=\"label label-default tag-"
+ alias4(((helper = (helper = helpers.category || (depth0 != null ? depth0.category : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"category","hash":{},"data":data}) : helper)))
+ "\" title=\""
+ alias4(((helper = (helper = helpers.notes || (depth0 != null ? depth0.notes : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"notes","hash":{},"data":data}) : helper)))
@ -418,12 +418,12 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
},"5":function(container,depth0,helpers,partials,data) {
var stack1;
return " <ul class=\"term-glossary-group\">\n"
return " <ul>\n"
+ ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.glossary : depth0),{"name":"each","hash":{},"fn":container.program(6, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </ul>\n";
},"6":function(container,depth0,helpers,partials,data) {
var stack1, helper, options, buffer =
" <li><span class=\"term-glossary-item\">";
" <li><span class=\"glossary-item\">";
stack1 = ((helper = (helper = helpers.multiLine || (depth0 != null ? depth0.multiLine : depth0)) != null ? helper : helpers.helperMissing),(options={"name":"multiLine","hash":{},"fn":container.program(7, data, 0),"inverse":container.noop,"data":data}),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},options) : helper));
if (!helpers.multiLine) { stack1 = helpers.blockHelperMissing.call(depth0,stack1,options)}
if (stack1 != null) { buffer += stack1; }
@ -432,7 +432,7 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
return container.escapeExpression(container.lambda(depth0, depth0));
},"9":function(container,depth0,helpers,partials,data) {
var stack1, helper, options, buffer =
" <div class=\"term-glossary-group term-glossary-item\">";
" <div class=\"glossary-item\">";
stack1 = ((helper = (helper = helpers.multiLine || (depth0 != null ? depth0.multiLine : depth0)) != null ? helper : helpers.helperMissing),(options={"name":"multiLine","hash":{},"fn":container.program(10, data, 0),"inverse":container.noop,"data":data}),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},options) : helper));
if (!helpers.multiLine) { stack1 = helpers.blockHelperMissing.call(depth0,stack1,options)}
if (stack1 != null) { buffer += stack1; }
@ -444,16 +444,16 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
},"12":function(container,depth0,helpers,partials,data) {
var stack1, alias1=depth0 != null ? depth0 : {};
return "<div class=\"term-definition\">\n <div class=\"action-bar\">\n"
return "<p>\n <div class=\"actions\">\n"
+ ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.addable : depth0),{"name":"if","hash":{},"fn":container.program(13, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.playback : depth0),{"name":"if","hash":{},"fn":container.program(15, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </div>\n\n"
+ ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.reading : depth0),{"name":"if","hash":{},"fn":container.program(17, data, 0),"inverse":container.program(20, data, 0),"data":data})) != null ? stack1 : "")
+ "\n"
+ ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.reasons : depth0),{"name":"if","hash":{},"fn":container.program(22, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ "\n <div class=\"term-glossary\">\n"
+ "\n <div class=\"glossary\">\n"
+ ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.grouped : depth0),{"name":"if","hash":{},"fn":container.program(26, data, 0),"inverse":container.program(32, data, 0),"data":data})) != null ? stack1 : "")
+ " </div>\n</div>\n";
+ " </div>\n</p>\n";
},"13":function(container,depth0,helpers,partials,data) {
var helper, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression;
@ -470,7 +470,7 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
+ "\"><img src=\"img/play_audio.png\"></a>\n";
},"17":function(container,depth0,helpers,partials,data) {
var stack1, helper, options, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", buffer =
" <div class=\"term-expression\"><ruby>";
" <div class=\"expression\"><ruby>";
stack1 = ((helper = (helper = helpers.kanjiLinks || (depth0 != null ? depth0.kanjiLinks : depth0)) != null ? helper : alias2),(options={"name":"kanjiLinks","hash":{},"fn":container.program(18, data, 0),"inverse":container.noop,"data":data}),(typeof helper === alias3 ? helper.call(alias1,options) : helper));
if (!helpers.kanjiLinks) { stack1 = helpers.blockHelperMissing.call(depth0,stack1,options)}
if (stack1 != null) { buffer += stack1; }
@ -483,7 +483,7 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
return container.escapeExpression(((helper = (helper = helpers.expression || (depth0 != null ? depth0.expression : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},{"name":"expression","hash":{},"data":data}) : helper)));
},"20":function(container,depth0,helpers,partials,data) {
var stack1, helper, options, buffer =
" <div class=\"term-expression\">";
" <div class=\"expression\">";
stack1 = ((helper = (helper = helpers.kanjiLinks || (depth0 != null ? depth0.kanjiLinks : depth0)) != null ? helper : helpers.helperMissing),(options={"name":"kanjiLinks","hash":{},"fn":container.program(18, data, 0),"inverse":container.noop,"data":data}),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},options) : helper));
if (!helpers.kanjiLinks) { stack1 = helpers.blockHelperMissing.call(depth0,stack1,options)}
if (stack1 != null) { buffer += stack1; }
@ -491,7 +491,7 @@ templates['terms.html'] = template({"1":function(container,depth0,helpers,partia
},"22":function(container,depth0,helpers,partials,data) {
var stack1;
return " <div class=\"term-reasons\">\n"
return " <div class=\"reasons\">\n"
+ ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.reasons : depth0),{"name":"each","hash":{},"fn":container.program(23, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ " </div>\n";
},"23":function(container,depth0,helpers,partials,data) {

View File

@ -16,6 +16,7 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
iframe#yomichan-popup {
all: initial;
background-color: #fff;

View File

@ -3,7 +3,7 @@
* Author: Alex Yatskov <alex@foosoft.net>
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* it under the entrys of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
@ -16,41 +16,47 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
/* common styles */
/*
* Fonts
*/
@font-face {
font-family: kanji-stroke-orders;
src: url('../ttf/kanji-stroke-orders.ttf');
}
@font-face {
font-family: vl-gothic-regular;
src: url('../ttf/vl-gothic-regular.ttf');
}
body {
background-color: #fff;
color: #333;
font-family: helvetica neue, helvetica, arial, sans-serif;
font-size: 14px;
line-height: 1.42857143;
overflow-y: auto;
padding: 5px;
/*
* General
*/
hr {
margin-top: 0.8em;
margin-bottom: 0.8em;
}
.tag {
border-radius: 0.25em;
color: #fff;
cursor: default;
display: inline;
font-size: 75%;
font-weight: 700;
line-height: 1;
padding: 0.2em 0.6em 0.3em;
text-align: center;
vertical-align: baseline;
white-space: nowrap;
.spinner {
bottom: 5px;
display: none;
position: fixed;
right: 5px;
}
#orphan {
display: none;
}
/*
* Entries
*/
.tag-default {
background-color: #8a8a91;
}
@ -79,126 +85,64 @@ body {
background-color: #aa66cc;
}
.action-bar {
.actions .disabled {
pointer-events: none;
cursor: default;
}
.actions .disabled img {
-webkit-filter: grayscale(100%);
opacity: 0.25;
}
.actions .pending {
visibility: hidden;
}
.actions {
display: inline-block;
float: right;
}
.action-bar:after {
.actions:after {
clear: both;
content: '';
display: block;
}
.action-bar .disabled {
pointer-events: none;
cursor: default;
}
.action-bar .disabled img {
-webkit-filter: grayscale(100%);
opacity: 0.25;
}
.action-bar .pending {
visibility: hidden;
}
.spinner {
bottom: 5px;
display: none;
position: fixed;
right: 5px;
}
hr {
background-color: #fff;
border: none;
border-top: 1px dotted #ccc;
margin-top: 0.8em;
margin-bottom: 0.8em;
height: 1px;
}
#orphan {
display: none;
}
/* term styles */
.term-expression {
.expression {
display: inline-block;
font-family: vl-gothic-regular;
font-size: 24px;
}
.term-expression a {
.expression a {
border-bottom: 1px #777 dashed;
color: #333;
text-decoration: none;
}
.term-reasons {
.reasons {
color: #777;
display: inline-block;
}
.term-glossary ol, .term-glossary ul {
.glossary ol, .glossary ul {
padding-left: 1.4em;
}
.term-glossary li {
.glossary li {
color: #777;
}
.term-glossary-group {
margin-top: 0.4em;
margin-bottom: 0.4em;
}
.term-glossary-item {
.glossary-item {
color: #000;
font-family: vl-gothic-regular;
}
/* kanji styles */
.kanji-glyph {
.glyph {
font-family: kanji-stroke-orders;
font-size: 120px;
line-height: 120px;
padding: 0.01em;
vertical-align: top;
}
.kanji-reading table {
padding: 0.3em, 0.3em;
}
.kanji-reading th {
color: #777;
font-weight: bold;
text-align: right;
vertical-align: top;
}
.kanji-reading td {
font-family: vl-gothic-regular;
}
.kanji-glossary ol {
padding-left: 1.4em;
}
.kanji-glossary li {
color: #777;
}
.kanji-glossary-group {
padding-bottom: 0.7em;
padding-top: 0.7em;
}
.kanji-glossary-item {
color: #000;
font-family: vl-gothic-regular;
}

View File

@ -3,14 +3,18 @@
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="../lib/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<link rel="stylesheet" href="../lib/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/frame.css">
</head>
<body>
<div class="container-fluid">
<div class="spinner">
<img src="img/spinner.gif">
</div>
<div id="content"></div>
<div id="orphan">
<h1>Yomichan Updated!</h1>
<p>The Yomichan extension has been updated to a new version! In order to continue viewing definitions on this page you must reload this tab or restart your browser.</p>
@ -20,5 +24,6 @@
<script src="../lib/wanakana.min.js"></script>
<script src="js/util.js"></script>
<script src="js/frame.js"></script>
</div>
</body>
</html>

View File

@ -1,14 +1,14 @@
{{#*inline "kanji"}}
<div class="kanji-definition">
<div class="action-bar">
<p>
<div class="actions">
{{#if addable}}
<a href="#" title="Add Kanji" class="action-add-note pending disabled" data-mode="kanji" data-index="{{@index}}"><img src="img/add_kanji.png"></a>
{{/if}}
</div>
<div class="kanji-glyph">{{character}}</div>
<div class="glyph">{{character}}</div>
<div class="kanji-reading">
<div class="reading">
<table>
<tr>
<th>Kunyomi:</th>
@ -29,24 +29,24 @@
</table>
</div>
<div class="kanji-tags">
<div>
{{#each tags}}
<span class="tag tag-{{category}}" title="{{notes}}">{{name}}</span>
<span class="label label-default tag-{{category}}" title="{{notes}}">{{name}}</span>
{{/each}}
</div>
<div class="kanji-glossary">
<div class="glossary">
{{#if glossary.[1]}}
<ol "kanji-glossary-group">
<ol>
{{#each glossary}}
<li><span class="kanji-glossary-item">{{#multiLine}}{{.}}{{/multiLine}}</span></li>
<li><span class="glossary-item">{{#multiLine}}{{.}}{{/multiLine}}</span></li>
{{/each}}
</ol>
{{else}}
<div class="kanji-glossary-group kanji-glossary-item">{{#multiLine}}{{glossary.[0]}}{{/multiLine}}</div>
<div class="glossary-item">{{#multiLine}}{{glossary.[0]}}{{/multiLine}}</div>
{{/if}}
</div>
</div>
</p>
{{/inline}}
{{#if definitions}}

View File

@ -1,25 +1,25 @@
{{#*inline "definition"}}
{{#if tags}}
<div class="term-tags">
<div>
{{#each tags}}
<span class="tag tag-{{category}}" title="{{notes}}">{{name}}</span>
<span class="label label-default tag-{{category}}" title="{{notes}}">{{name}}</span>
{{/each}}
</div>
{{/if}}
{{#if glossary.[1]}}
<ul class="term-glossary-group">
<ul>
{{#each glossary}}
<li><span class="term-glossary-item">{{#multiLine}}{{.}}{{/multiLine}}</span></li>
<li><span class="glossary-item">{{#multiLine}}{{.}}{{/multiLine}}</span></li>
{{/each}}
</ul>
{{else}}
<div class="term-glossary-group term-glossary-item">{{#multiLine}}{{glossary.[0]}}{{/multiLine}}</div>
<div class="glossary-item">{{#multiLine}}{{glossary.[0]}}{{/multiLine}}</div>
{{/if}}
{{/inline}}
{{#*inline "term"}}
<div class="term-definition">
<div class="action-bar">
<p>
<div class="actions">
{{#if addable}}
<a href="#" title="Add term as expression" class="action-add-note pending disabled" data-mode="term_kanji" data-index="{{@index}}"><img src="img/add_term_kanji.png"></a>
<a href="#" title="Add term as reading" class="action-add-note pending disabled" data-mode="term_kana" data-index="{{@index}}"><img src="img/add_term_kana.png"></a>
@ -30,20 +30,20 @@
</div>
{{#if reading}}
<div class="term-expression"><ruby>{{#kanjiLinks}}{{expression}}{{/kanjiLinks}}<rt>{{reading}}</rt></ruby></div>
<div class="expression"><ruby>{{#kanjiLinks}}{{expression}}{{/kanjiLinks}}<rt>{{reading}}</rt></ruby></div>
{{else}}
<div class="term-expression">{{#kanjiLinks}}{{expression}}{{/kanjiLinks}}</div>
<div class="expression">{{#kanjiLinks}}{{expression}}{{/kanjiLinks}}</div>
{{/if}}
{{#if reasons}}
<div class="term-reasons">
<div class="reasons">
{{#each reasons}}
<span class="reasons">{{.}}</span> {{#unless @last}}&laquo;{{/unless}}
{{/each}}
</div>
{{/if}}
<div class="term-glossary">
<div class="glossary">
{{#if grouped}}
{{#if definitions.[1]}}
<ol>
@ -58,7 +58,7 @@
{{> definition}}
{{/if}}
</div>
</div>
</p>
{{/inline}}
{{#if definitions}}