backups/Fantasy-Map-Generator
1
0
Fork 0
mirror of https://github.com/Azgaar/Fantasy-Map-Generator.git synced 2026-02-05 18:11:23 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Allowed to set letter-spacing for label groups from the Style tab.

Browse source
This commit is contained in:
Oriolowsky 2024-09-01 12:09:00 +02:00
parent 0ec5c5638f
commit e0e6112c73
2 changed files with 16 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

9
index.html
View file

@ -1181,6 +1181,15 @@
</tr> </tr>
</tbody> </tbody>
<tbody id="styleLetterSpacing">
<tr data-tip="Set letter spacing size">
<td>Letter spacing</td>
<td>
<slider-input id="styleLetterSpacingInput" min="0" max="80"></slider-input>
</td>
</tr>
</tbody>
<tbody id="styleStrokeDash"> <tbody id="styleStrokeDash">
<tr data-tip="Set stroke dash array (e.g. 5 2) and linecap"> <tr data-tip="Set stroke dash array (e.g. 5 2) and linecap">
<td>Stroke dash</td> <td>Stroke dash</td>

7
modules/ui/style.js
View file

@ -239,6 +239,7 @@ function selectStyleElement() {
styleFill.style.display = "block"; styleFill.style.display = "block";
styleStroke.style.display = "block"; styleStroke.style.display = "block";
styleStrokeWidth.style.display = "block"; styleStrokeWidth.style.display = "block";
styleLetterSpacing.style.display = "block";
styleShadow.style.display = "block"; styleShadow.style.display = "block";
styleSize.style.display = "block"; styleSize.style.display = "block";
@ -246,6 +247,7 @@ function selectStyleElement() {
styleFillInput.value = styleFillOutput.value = el.attr("fill") || "#3e3e4b"; styleFillInput.value = styleFillOutput.value = el.attr("fill") || "#3e3e4b";
styleStrokeInput.value = styleStrokeOutput.value = el.attr("stroke") || "#3a3a3a"; styleStrokeInput.value = styleStrokeOutput.value = el.attr("stroke") || "#3a3a3a";
styleStrokeWidthInput.value = el.attr("stroke-width") || 0; styleStrokeWidthInput.value = el.attr("stroke-width") || 0;
styleLetterSpacingInput.value = el.attr("letter-spacing")+"px" || "0px";
styleShadowInput.value = el.style("text-shadow") || "white 0 0 4px"; styleShadowInput.value = el.style("text-shadow") || "white 0 0 4px";
styleFont.style.display = "block"; styleFont.style.display = "block";
@ -432,6 +434,11 @@ styleStrokeWidthInput.addEventListener("input", e => {
if (styleElementSelect.value === "gridOverlay" && layerIsOn("toggleGrid")) drawGrid(); if (styleElementSelect.value === "gridOverlay" && layerIsOn("toggleGrid")) drawGrid();
}); });
styleLetterSpacingInput.addEventListener("input", e => {
getEl().attr("letter-spacing", e.target.value);
if (styleElementSelect.value === "gridOverlay" && layerIsOn("toggleGrid")) drawGrid();
});
styleStrokeDasharrayInput.addEventListener("input", function () { styleStrokeDasharrayInput.addEventListener("input", function () {
getEl().attr("stroke-dasharray", this.value); getEl().attr("stroke-dasharray", this.value);
if (styleElementSelect.value === "gridOverlay" && layerIsOn("toggleGrid")) drawGrid(); if (styleElementSelect.value === "gridOverlay" && layerIsOn("toggleGrid")) drawGrid();