This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
| font:wordconstuct [2026/01/17 14:40] – Fixed JS declaration order wikarai | font:wordconstuct [2026/03/24 22:28] (current) – external edit A User Not Logged in | ||
|---|---|---|---|
| Line 125: | Line 125: | ||
| @media (max-width: 600px) { | @media (max-width: 600px) { | ||
| .workflow-grid { | .workflow-grid { | ||
| - | | + | |
| - | | + | |
| - | overflow-x: auto; | + | gap: 6px; |
| - | | + | |
| - | gap: 8px; | + | |
| padding-bottom: | padding-bottom: | ||
| } | } | ||
| .workflow-card { | .workflow-card { | ||
| - | min-width: | + | min-width: |
| - | | + | |
| - | | + | |
| } | } | ||
| .workflow-label { | .workflow-label { | ||
| - | font-size: 0.75em; | + | font-size: 0.72em; |
| } | } | ||
| .workflow-example { | .workflow-example { | ||
| - | font-size: 0.9em; | + | font-size: 0.88em; |
| } | } | ||
| } | } | ||
| Line 232: | Line 230: | ||
| </ | </ | ||
| <div class=" | <div class=" | ||
| + | <div class=" | ||
| <div id=" | <div id=" | ||
| <div id=" | <div id=" | ||
| Line 245: | Line 244: | ||
| <div style=" | <div style=" | ||
| <div> | <div> | ||
| - | <div class=" | + | <div class=" |
| <div id=" | <div id=" | ||
| </ | </ | ||
| Line 259: | Line 258: | ||
| </ | </ | ||
| | | ||
| - | <div class=" | + | <div class=" |
| <div id=" | <div id=" | ||
| | | ||
| Line 466: | Line 465: | ||
| .catch(() => { glossSet = null; glossMap = null; }); | .catch(() => { glossSet = null; glossMap = null; }); | ||
| - | | + | |
| - | evt.preventDefault(); | + | |
| - | loadNextChunk(); | + | |
| - | }); | + | |
| Object.keys(data).forEach(init => { | Object.keys(data).forEach(init => { | ||
| Line 562: | Line 558: | ||
| } | } | ||
| | | ||
| - | // n ↔ m mapping | + | // n ↔ m mapping |
| - | if (modified.includes(' | + | |
| - | const toggled = modified.replace(/ | + | |
| - | if (toggled !== modified) | + | |
| - | } | + | |
| | | ||
| // f ↔ p mapping | // f ↔ p mapping | ||
| Line 716: | Line 708: | ||
| } | } | ||
| - | // Render | + | // Render a simple |
| - | const readingList = document.getElementById(' | + | |
| - | const maxLines = 4; | + | |
| const separator = ', '; | const separator = ', '; | ||
| - | + | | |
| - | // Create an offscreen measurement element with same width/ | + | |
| - | | + | |
| - | measure.style.position = ' | + | |
| - | measure.style.visibility = ' | + | |
| - | measure.style.whiteSpace = ' | + | |
| - | measure.style.boxSizing = ' | + | |
| - | measure.style.width = (readingList.clientWidth || readingList.offsetWidth) + ' | + | |
| - | const computed = window.getComputedStyle(readingItems); | + | |
| - | measure.style.fontFamily = computed.fontFamily; | + | |
| - | measure.style.fontSize = computed.fontSize; | + | |
| - | measure.style.lineHeight = computed.lineHeight; | + | |
| - | measure.style.padding = computed.padding; | + | |
| - | document.body.appendChild(measure); | + | |
| - | + | ||
| - | // Build preview by adding full items until height would exceed maxLines | + | |
| - | let previewText = ''; | + | |
| - | let lastGoodText = ''; | + | |
| - | for (let i = 0; i < shuffledCombos.length; | + | |
| - | const candidate = (lastGoodText ? lastGoodText + separator : '' | + | |
| - | measure.textContent = candidate; | + | |
| - | const lineHeightPx = parseFloat(window.getComputedStyle(measure).lineHeight) || (parseFloat(window.getComputedStyle(measure).fontSize) * 1.2); | + | |
| - | const maxHeightPx = lineHeightPx * maxLines; | + | |
| - | if (measure.scrollHeight > maxHeightPx) { | + | |
| - | break; | + | |
| - | } | + | |
| - | lastGoodText = candidate; | + | |
| - | } | + | |
| - | + | ||
| - | // Clean up measurement element | + | |
| - | document.body.removeChild(measure); | + | |
| let line = readingItems.querySelector(' | let line = readingItems.querySelector(' | ||
| Line 759: | Line 719: | ||
| } | } | ||
| - | | + | |
| - | // Fallback: nothing fit (very narrow); show a small stable preview | + | |
| - | const preview | + | |
| - | | + | if (shuffledCombos.length > previewCount) { |
| - | if (shuffledCombos.length > 20) { | + | moreLink.style.display = ' |
| - | moreLink.style.display = ' | + | moreLink.textContent = ' |
| - | moreLink.textContent = ' | + | moreLink.onclick = (e) => { e.preventDefault(); |
| - | moreLink.onclick = (e) => { e.preventDefault(); | + | |
| - | } else { | + | |
| - | moreLink.style.display = ' | + | |
| - | } | + | |
| } else { | } else { | ||
| - | | + | moreLink.style.display = ' |
| - | line.textContent = lastGoodText; | + | |
| - | if (lastGoodText.length < shuffledCombos.join(separator).length) { | + | |
| - | moreLink.style.display = ' | + | |
| - | moreLink.textContent = ' | + | |
| - | moreLink.onclick = (e) => { e.preventDefault(); | + | |
| - | } else { | + | |
| - | | + | |
| - | } | + | |
| } | } | ||
| } | } | ||
| Line 877: | Line 825: | ||
| ===== Linguistic Construction: | ===== Linguistic Construction: | ||
| - | In Yivalese, the transition from visual glyphs to spoken phonology is an interpretive process. Once you have selected a compound of glyphs to represent a concept - such as GxDl (desire+tell = song) - you may derive the pronunciation by extracting specific characters from those pairs. It is also fine to mix and match to keep the resulting pronunciation natural. | ||
| + | Writing Yivalese from the spoken form into its written one is an interpretive process. This is due to phonetic and semantic drift from its original source which was fairly consistent, until it wasn' | ||
| + | |||
| + | Once you have selected a compound of glyphs to represent a concept - such as GxDl (< | ||