Merge pull request #385 from toasted-nutbread/pitch-accents

Pitch accents

3 files changed, 240 insertions, 4 deletions

diff --git a/ext/mixed/css/display-dark.css b/ext/mixed/css/display-dark.css
index c9cd9f90..550dff3e 100644
--- a/ext/mixed/css/display-dark.css
+++ b/ext/mixed/css/display-dark.css
@@ -19,6 +19,8 @@
 
 body { background-color: #1e1e1e; color: #d4d4d4; }
 
+h2 { border-bottom-color: #2f2f2f; }
+
 .navigation-header {
     background-color: #1e1e1e;
     border-bottom-color: #2f2f2f;
@@ -39,6 +41,7 @@ body { background-color: #1e1e1e; color: #d4d4d4; }
 .tag[data-category=frequency]    { background-color: #489148; }
 .tag[data-category=partOfSpeech] { background-color: #565656; }
 .tag[data-category=search]       { background-color: #69696e; }
+.tag[data-category=pitch-accent-dictionary] { background-color: #6640be; }
 
 .term-reasons { color: #888888; }
 
@@ -57,12 +60,15 @@ body { background-color: #1e1e1e; color: #d4d4d4; }
     color: #666666;
 }
 
-.term-definition-container,
-.kanji-glossary-container {
+.term-definition-list,
+.term-pitch-accent-group-list,
+.term-pitch-accent-disambiguation-list,
+.kanji-glossary-list {
     color: #888888;
 }
 
 .term-glossary,
+.term-pitch-accent,
 .kanji-glossary {
     color: #d4d4d4;
 }
@@ -72,3 +78,20 @@ body { background-color: #1e1e1e; color: #d4d4d4; }
     background-color: #d4d4d4;
     color: #1e1e1e;
 }
+
+.term-pitch-accent-container { border-bottom-color: #2f2f2f; }
+
+.term-pitch-accent-character:before { border-color: #ffffff; }
+
+.term-pitch-accent-graph-line,
+.term-pitch-accent-graph-line-tail,
+#term-pitch-accent-graph-dot,
+#term-pitch-accent-graph-dot-downstep,
+#term-pitch-accent-graph-triangle {
+    stroke: #ffffff;
+}
+
+#term-pitch-accent-graph-dot,
+#term-pitch-accent-graph-dot-downstep>circle:last-of-type {
+    fill: #ffffff;
+}
diff --git a/ext/mixed/css/display-default.css b/ext/mixed/css/display-default.css
index 6eee43c4..487b8cb8 100644
--- a/ext/mixed/css/display-default.css
+++ b/ext/mixed/css/display-default.css
@@ -19,6 +19,8 @@
 
 body { background-color: #ffffff; color: #333333; }
 
+h2 { border-bottom-color: #eeeeee; }
+
 .navigation-header {
     background-color: #ffffff;
     border-bottom-color: #eeeeee;
@@ -39,6 +41,7 @@ body { background-color: #ffffff; color: #333333; }
 .tag[data-category=frequency]    { background-color: #5cb85c; }
 .tag[data-category=partOfSpeech] { background-color: #565656; }
 .tag[data-category=search]       { background-color: #8a8a91; }
+.tag[data-category=pitch-accent-dictionary] { background-color: #6640be; }
 
 .term-reasons { color: #777777; }
 
@@ -57,12 +60,15 @@ body { background-color: #ffffff; color: #333333; }
     color: #999999;
 }
 
-.term-definition-container,
-.kanji-glossary-container {
+.term-definition-list,
+.term-pitch-accent-group-list,
+.term-pitch-accent-disambiguation-list,
+.kanji-glossary-list {
     color: #777777;
 }
 
 .term-glossary,
+.term-pitch-accent,
 .kanji-glossary {
     color: #000000;
 }
@@ -72,3 +78,20 @@ body { background-color: #ffffff; color: #333333; }
     background-color: #333333;
     color: #ffffff;
 }
+
+.term-pitch-accent-container { border-bottom-color: #eeeeee; }
+
+.term-pitch-accent-character:before { border-color: #000000; }
+
+.term-pitch-accent-graph-line,
+.term-pitch-accent-graph-line-tail,
+#term-pitch-accent-graph-dot,
+#term-pitch-accent-graph-dot-downstep,
+#term-pitch-accent-graph-triangle {
+    stroke: #000000;
+}
+
+#term-pitch-accent-graph-dot,
+#term-pitch-accent-graph-dot-downstep>circle:last-of-type {
+    fill: #000000;
+}
diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css
index 688a357c..a4432016 100644
--- a/ext/mixed/css/display.css
+++ b/ext/mixed/css/display.css
@@ -65,6 +65,14 @@ ol, ul {
     height: 2.28571428em; /* 14px => 32px */
 }
 
+h2 {
+    font-size: 1.25em;
+    font-weight: normal;
+    margin: 0.25em 0 0;
+    border-bottom-width: 0.05714285714285714em; /* 14px * 1.25em => 1px */
+    border-bottom-style: solid;
+}
+
 /*
  * Navigation
  */
@@ -302,6 +310,7 @@ button.action-button {
     width: 0;
     height: 0;
     visibility: hidden;
+    z-index: 1;
 }
 
 .term-expression-list[data-multi=true] .term-expression:hover .term-expression-details {
@@ -422,6 +431,187 @@ button.action-button {
     display: inline;
 }
 
+.term-entry-body[data-section-count="0"] .term-entry-body-section-header,
+.term-entry-body[data-section-count="1"] .term-entry-body-section-header {
+    display: none;
+}
+
+
+/*
+ * Pitch accent styles
+ */
+
+.entry[data-pitch-accent-count='0'] .term-pitch-accent-container {
+    display: none;
+}
+
+.term-pitch-accent-container {
+    border-bottom-width: 0.05714285714285714em; /* 14px * 1.25em => 1px */
+    border-bottom-style: solid;
+    padding-bottom: 0.25em;
+    margin-bottom: 0.25em;
+}
+
+.term-pitch-accent-group-list {
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+}
+
+.term-pitch-accent-group-list:not([data-count="0"]):not([data-count="1"]) {
+    padding-left: 1.4em;
+    list-style-type: decimal;
+}
+
+.term-pitch-accent-list {
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+    display: inline;
+}
+
+.term-pitch-accent-list:not([data-count="0"]):not([data-count="1"]) {
+    padding-left: 1.4em;
+    list-style-type: circle;
+    display: block;
+}
+
+.term-pitch-accent {
+    display: inline;
+    line-height: 1.5em;
+}
+
+.term-pitch-accent-list:not([data-count="0"]):not([data-count="1"])>.term-pitch-accent {
+    display: list-item;
+}
+
+.term-pitch-accent-group-tag-list {
+    margin-right: 0.375em;
+}
+
+.term-pitch-accent-disambiguation-list {
+    padding-right: 0.25em;
+}
+
+.term-pitch-accent-disambiguation-list:before {
+    content: "(";
+}
+
+.term-pitch-accent-disambiguation-list:after {
+    content: " only)";
+}
+
+.term-pitch-accent-disambiguation+.term-pitch-accent-disambiguation:before {
+    content: ", ";
+}
+
+.term-pitch-accent-disambiguation-list[data-count="0"],
+:root[data-show-pitch-accent-downstep-notation=true] .term-pitch-accent-disambiguation-list[data-expression-count="0"],
+:root[data-show-pitch-accent-downstep-notation=true] .term-pitch-accent-disambiguation[data-type=reading] {
+    display: none;
+}
+
+.term-pitch-accent-tag-list:not([data-count="0"]) {
+    margin-right: 0.375em;
+}
+
+.term-special-tags>.pitches {
+    display: inline;
+}
+
+.term-pitch-accent-character {
+    display: inline-block;
+    position: relative;
+}
+.term-pitch-accent-character[data-pitch='high']:before {
+    content: "";
+    display: block;
+    user-select: none;
+    pointer-events: none;
+    position: absolute;
+    top: 0.1em;
+    left: 0;
+    right: 0;
+    height: 0;
+    border-top-width: 0.1em;
+    border-top-style: solid;
+}
+.term-pitch-accent-character[data-pitch='high'][data-pitch-next='low']:before {
+    right: -0.1em;
+    height: 0.4em;
+    border-right-width: 0.1em;
+    border-right-style: solid;
+}
+.term-pitch-accent-character[data-pitch='high'][data-pitch-next='low'] {
+    padding-right: 0.1em;
+    margin-right: 0.1em;
+}
+
+.term-pitch-accent-position:before {
+    content: " [";
+}
+.term-pitch-accent-position:after {
+    content: "]";
+}
+
+.term-pitch-accent-details {
+    display: inline-block;
+    height: 0;
+    padding: 0 0.25em;
+    vertical-align: middle;
+}
+
+
+:root[data-show-pitch-accent-downstep-notation=false] .term-pitch-accent-characters {
+    display: none;
+}
+
+:root[data-show-pitch-accent-position-notation=false] .term-pitch-accent-position {
+    display: none;
+}
+
+:root[data-show-pitch-accent-graph=false] .term-pitch-accent-details {
+    display: none;
+}
+
+
+/*
+ * Pitch accent graph styles
+ */
+
+.term-pitch-accent-graph {
+    display: block;
+    height: 1.5em;
+    transform: translateY(-0.875em);
+}
+.term-pitch-accent-graph-line,
+.term-pitch-accent-graph-line-tail {
+    fill: none;
+    stroke: #000000;
+    stroke-width: 5;
+}
+.term-pitch-accent-graph-line-tail {
+    stroke-dasharray: 5 5;
+}
+#term-pitch-accent-graph-dot {
+    fill: #000000;
+    stroke: #000000;
+    stroke-width: 5;
+}
+#term-pitch-accent-graph-dot-downstep {
+    fill: none;
+    stroke: #000000;
+    stroke-width: 5;
+}
+#term-pitch-accent-graph-dot-downstep>circle:last-of-type {
+    fill: #000000;
+}
+#term-pitch-accent-graph-triangle {
+    fill: none;
+    stroke: #000000;
+    stroke-width: 5;
+}
+
 
 /*
  * Kanji