@hanology/cham-browser 0.4.58 → 0.4.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/package.json +1 -1
  2. package/template/src/components/PartBlock.vue +88 -10
  3. package/template/src/views/PieceView.vue +2 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hanology/cham-browser",
3
- "version": "0.4.58",
3
+ "version": "0.4.59",
4
4
  "description": "CHAM — browser-compatible parser, serializer, and site generator for Classical Han Annotated Markdown",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
package/template/src/components/PartBlock.vue CHANGED
@@ -127,17 +127,18 @@ const sourceLabel = (() => {
127
127
  :deep(.ann-target) {
128
128
  border-bottom: 2px solid var(--vermillion);
129
129
  cursor: help;
130
- transition: background 0.15s;
130
+ transition: background 0.2s ease, box-shadow 0.2s ease;
131
+ -webkit-box-decoration-break: clone;
132
+ box-decoration-break: clone;
131
133
  }
132
134
  :deep(.ann-target.ann-overlap) {
133
135
  border-bottom-width: 3px;
134
136
  border-bottom-style: double;
135
137
  }
136
-
137
138
  :deep(.ann-target:hover) {
138
- background: rgba(194, 58, 43, 0.08);
139
+ background: rgba(194, 58, 43, 0.1);
140
+ box-shadow: 0 2px 8px rgba(194, 58, 43, 0.08);
139
141
  }
140
-
141
142
  :deep(.ann-num) {
142
143
  font-size: 10px;
143
144
  color: var(--vermillion);
@@ -147,13 +148,47 @@ const sourceLabel = (() => {
147
148
  margin-right: 1px;
148
149
  letter-spacing: 0;
149
150
  }
150
-
151
151
  :deep(.ann-target.pronunciation) {
152
152
  border-bottom-color: var(--jade);
153
153
  }
154
-
155
154
  :deep(.ann-target.pronunciation:hover) {
156
- background: rgba(58, 107, 94, 0.08);
155
+ background: rgba(58, 107, 94, 0.1);
156
+ box-shadow: 0 2px 8px rgba(58, 107, 94, 0.08);
157
+ }
158
+ :deep(.ann-target.person) {
159
+ border-bottom-color: var(--ann-person);
160
+ }
161
+ :deep(.ann-target.place) {
162
+ border-bottom-color: var(--ann-place);
163
+ }
164
+ :deep(.ann-target.event) {
165
+ border-bottom-color: var(--ann-event);
166
+ }
167
+ :deep(.ann-target.date) {
168
+ border-bottom-color: var(--ann-date);
169
+ }
170
+ :deep(.ann-target.allusion) {
171
+ border-bottom-color: var(--ann-allusion);
172
+ }
173
+ :deep(.ann-target.person:hover) {
174
+ background: rgba(58, 90, 140, 0.1);
175
+ box-shadow: 0 2px 8px rgba(58, 90, 140, 0.08);
176
+ }
177
+ :deep(.ann-target.place:hover) {
178
+ background: rgba(139, 105, 20, 0.1);
179
+ box-shadow: 0 2px 8px rgba(139, 105, 20, 0.08);
180
+ }
181
+ :deep(.ann-target.event:hover) {
182
+ background: rgba(107, 76, 138, 0.1);
183
+ box-shadow: 0 2px 8px rgba(107, 76, 138, 0.08);
184
+ }
185
+ :deep(.ann-target.date:hover) {
186
+ background: rgba(42, 122, 122, 0.1);
187
+ box-shadow: 0 2px 8px rgba(42, 122, 122, 0.08);
188
+ }
189
+ :deep(.ann-target.allusion:hover) {
190
+ background: rgba(181, 101, 29, 0.1);
191
+ box-shadow: 0 2px 8px rgba(181, 101, 29, 0.08);
157
192
  }
158
193
 
159
194
  .part-block--vertical :deep(.ann-target) {
@@ -166,14 +201,57 @@ const sourceLabel = (() => {
166
201
  border-left-style: double;
167
202
  padding-left: 3px;
168
203
  }
169
-
170
204
  .part-block--vertical :deep(.ann-target.pronunciation) {
171
205
  border-left-color: var(--jade);
172
206
  }
173
-
207
+ .part-block--vertical :deep(.ann-target.pronunciation.semantic) {
208
+ border-left-color: var(--gold);
209
+ }
210
+ .part-block--vertical :deep(.ann-target.person) {
211
+ border-left-color: var(--ann-person);
212
+ }
213
+ .part-block--vertical :deep(.ann-target.place) {
214
+ border-left-color: var(--ann-place);
215
+ }
216
+ .part-block--vertical :deep(.ann-target.event) {
217
+ border-left-color: var(--ann-event);
218
+ }
219
+ .part-block--vertical :deep(.ann-target.date) {
220
+ border-left-color: var(--ann-date);
221
+ }
222
+ .part-block--vertical :deep(.ann-target.allusion) {
223
+ border-left-color: var(--ann-allusion);
224
+ }
225
+ .part-block--vertical :deep(.ann-target:hover) {
226
+ background: rgba(194, 58, 43, 0.1);
227
+ box-shadow: 0 -2px 8px rgba(194, 58, 43, 0.08);
228
+ }
229
+ .part-block--vertical :deep(.ann-target.pronunciation:hover) {
230
+ background: rgba(58, 107, 94, 0.1);
231
+ box-shadow: 0 -2px 8px rgba(58, 107, 94, 0.08);
232
+ }
233
+ .part-block--vertical :deep(.ann-target.person:hover) {
234
+ background: rgba(58, 90, 140, 0.1);
235
+ box-shadow: 0 -2px 8px rgba(58, 90, 140, 0.08);
236
+ }
237
+ .part-block--vertical :deep(.ann-target.place:hover) {
238
+ background: rgba(139, 105, 20, 0.1);
239
+ box-shadow: 0 -2px 8px rgba(139, 105, 20, 0.08);
240
+ }
241
+ .part-block--vertical :deep(.ann-target.event:hover) {
242
+ background: rgba(107, 76, 138, 0.1);
243
+ box-shadow: 0 -2px 8px rgba(107, 76, 138, 0.08);
244
+ }
245
+ .part-block--vertical :deep(.ann-target.date:hover) {
246
+ background: rgba(42, 122, 122, 0.1);
247
+ box-shadow: 0 -2px 8px rgba(42, 122, 122, 0.08);
248
+ }
249
+ .part-block--vertical :deep(.ann-target.allusion:hover) {
250
+ background: rgba(181, 101, 29, 0.1);
251
+ box-shadow: 0 -2px 8px rgba(181, 101, 29, 0.08);
252
+ }
174
253
  .part-block--vertical :deep(.ann-num) {
175
254
  font-size: 0.45em;
176
- text-combine-upright: all;
177
255
  text-align: end;
178
256
  letter-spacing: 0;
179
257
  vertical-align: baseline;
package/template/src/views/PieceView.vue CHANGED
@@ -789,7 +789,8 @@ function tcy(n: number): string {
789
789
  flex-direction: row-reverse;
790
790
  align-items: flex-start;
791
791
  gap: 0;
792
- max-height: calc(100vh - 100px);
792
+ height: 100vh;
793
+ box-sizing: border-box;
793
794
  overflow-x: auto;
794
795
  overflow-y: hidden;
795
796
  padding: 20px 16px;