feat: letter-spacing - update style files

This commit is contained in:
Azgaar 2024-09-01 14:07:18 +02:00
parent dbe6ef1854
commit 2fea87344b
15 changed files with 81 additions and 15 deletions

View file

@ -1182,10 +1182,10 @@
</tbody>
<tbody id="styleLetterSpacing">
<tr data-tip="Set letter spacing size">
<tr data-tip="Set letter spacing">
<td>Letter spacing</td>
<td>
<slider-input id="styleLetterSpacingInput" min="0" max="80"></slider-input>
<slider-input id="styleLetterSpacingInput" min="0" max="20" step=".01"></slider-input>
</td>
</tr>
</tbody>

View file

@ -271,7 +271,15 @@ function addStylePreset() {
"data-columns"
],
"#legendBox": ["fill", "fill-opacity"],
"#burgLabels > #cities": ["opacity", "fill", "text-shadow", "data-size", "font-size", "font-family"],
"#burgLabels > #cities": [
"opacity",
"fill",
"text-shadow",
"letter-spacing",
"data-size",
"font-size",
"font-family"
],
"#burgIcons > #cities": [
"opacity",
"fill",
@ -283,7 +291,15 @@ function addStylePreset() {
"stroke-linecap"
],
"#anchors > #cities": ["opacity", "fill", "size", "stroke", "stroke-width"],
"#burgLabels > #towns": ["opacity", "fill", "text-shadow", "data-size", "font-size", "font-family"],
"#burgLabels > #towns": [
"opacity",
"fill",
"text-shadow",
"letter-spacing",
"data-size",
"font-size",
"font-family"
],
"#burgIcons > #towns": [
"opacity",
"fill",
@ -301,6 +317,7 @@ function addStylePreset() {
"stroke",
"stroke-width",
"text-shadow",
"letter-spacing",
"data-size",
"font-size",
"font-family",
@ -312,6 +329,7 @@ function addStylePreset() {
"stroke",
"stroke-width",
"text-shadow",
"letter-spacing",
"data-size",
"font-size",
"font-family",

View file

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

View file

@ -332,6 +332,7 @@
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 12,
"font-size": 12,
"font-family": "Great Vibes"
@ -357,6 +358,7 @@
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 5,
"font-size": 5,
"font-family": "Great Vibes"
@ -384,6 +386,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 22,
"font-size": 22,
"font-family": "Great Vibes",
@ -395,6 +398,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Times New Roman",

View file

@ -332,6 +332,7 @@
"opacity": 1,
"fill": "#000000",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 5,
"font-size": 5,
"font-family": "Amarante"
@ -357,6 +358,7 @@
"opacity": 1,
"fill": "#000000",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 4,
"font-size": 4,
"font-family": "Amarante"
@ -384,6 +386,7 @@
"stroke": "#000000",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 21,
"font-size": 21,
"font-family": "Amarante",
@ -395,6 +398,7 @@
"stroke": "#000000",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Amarante",

View file

@ -319,22 +319,22 @@
"mask": "url(#land)"
},
"#legend": {
"data-size": 12.74,
"font-size": 12.74,
"data-size": 12,
"font-size": 12,
"font-family": "Arial",
"stroke": "#909090",
"stroke-width": 1.13,
"stroke-width": 1,
"stroke-dasharray": 0,
"stroke-linecap": "round",
"data-x": 98.39,
"data-y": 12.67,
"data-columns": null
"data-x": 99,
"data-y": 93,
"data-columns": 8
},
"#legendBox": {},
"#burgLabels > #cities": {
"opacity": 1,
"fill": "#414141",
"text-shadow": "white 0 0 4px",
"letter-spacing": 0,
"data-size": 7,
"font-size": 7,
"font-family": "Arial"
@ -359,6 +359,8 @@
"#burgLabels > #towns": {
"opacity": 1,
"fill": "#414141",
"text-shadow": "none",
"letter-spacing": 0,
"data-size": 3,
"font-size": 3,
"font-family": "Arial"
@ -386,6 +388,7 @@
"stroke": "#303030",
"stroke-width": 0,
"text-shadow": "white 0 0 2px",
"letter-spacing": 0,
"data-size": 10,
"font-size": 10,
"font-family": "Arial",
@ -397,6 +400,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0 0 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Arial",

View file

@ -332,6 +332,7 @@
"opacity": 1,
"fill": "#ffffff",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 8,
"font-size": 8,
"font-family": "Orbitron"
@ -357,6 +358,7 @@
"opacity": 1,
"fill": "#ffffff",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 3,
"font-size": 3,
"font-family": "Orbitron"
@ -384,6 +386,7 @@
"stroke": "#000000",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Orbitron",
@ -395,6 +398,7 @@
"stroke": "#000000",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Almendra SC",

View file

@ -321,6 +321,7 @@
"opacity": 1,
"fill": "#000000",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 7,
"font-size": 7,
"font-family": "Lugrasimo"
@ -345,6 +346,7 @@
"opacity": 1,
"fill": "#000000",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 5,
"font-size": 5,
"font-family": "Lugrasimo"
@ -371,6 +373,7 @@
"stroke": "#000000",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 21,
"font-size": 21,
"font-family": "Eagle Lake",
@ -382,6 +385,7 @@
"stroke": "#000000",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Eagle Lake",

View file

@ -332,6 +332,7 @@
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 7,
"font-size": 7,
"font-family": "Almendra SC"
@ -357,6 +358,7 @@
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 4,
"font-size": 4,
"font-family": "Almendra SC"
@ -384,6 +386,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 22,
"font-size": 22,
"font-family": "Almendra SC",
@ -395,6 +398,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Almendra SC",

View file

@ -335,6 +335,7 @@
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "white 0 0 2px",
"letter-spacing": 0,
"data-size": 8,
"font-size": 8,
"font-family": "Underdog"
@ -359,6 +360,8 @@
"#burgLabels > #towns": {
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "none",
"letter-spacing": 0,
"data-size": 4,
"font-size": 4,
"font-family": "Underdog"
@ -386,6 +389,7 @@
"stroke": "#b5b5b5",
"stroke-width": 0,
"text-shadow": "white 0 0 2px",
"letter-spacing": 0,
"data-size": 20,
"font-size": 20,
"font-family": "Underdog",
@ -397,6 +401,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0 0 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Underdog",

View file

@ -332,6 +332,7 @@
"opacity": 1,
"fill": "#3a3a3a",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 8,
"font-size": 8,
"font-family": "IM Fell English"
@ -357,6 +358,7 @@
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 4,
"font-size": 4,
"font-family": "IM Fell English"
@ -384,6 +386,7 @@
"stroke": "#000000",
"stroke-width": 0.3,
"text-shadow": "white 0px 0px 6px",
"letter-spacing": 0,
"data-size": 14,
"font-size": 14,
"font-family": "IM Fell English",
@ -395,6 +398,7 @@
"stroke": "#701b05",
"stroke-width": 0.1,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 6,
"font-size": 6,
"font-family": "IM Fell English",

View file

@ -328,6 +328,7 @@
"opacity": 1,
"fill": "#000000",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 7,
"font-size": 7,
"font-family": "Courier New"
@ -353,6 +354,7 @@
"opacity": 1,
"fill": "#000000",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 4,
"font-size": 4,
"font-family": "Courier New"
@ -380,6 +382,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Courier New",
@ -390,7 +393,8 @@
"fill": "#3e3e4b",
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0 0 4px",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Courier New",

View file

@ -332,6 +332,7 @@
"opacity": 1,
"fill": "#dbdbe1",
"text-shadow": "black 0px 0px 4px",
"letter-spacing": 0,
"data-size": 8,
"font-size": 8,
"font-family": "Courier New"
@ -357,6 +358,7 @@
"opacity": 1,
"fill": "#ffffff",
"text-shadow": "black 0px 0px 4px",
"letter-spacing": 0,
"data-size": 4.28,
"font-size": 4.28,
"font-family": "Courier New"
@ -384,6 +386,7 @@
"stroke": "#7a83ae",
"stroke-width": 0.3,
"text-shadow": "black 0px 0px 0.1px",
"letter-spacing": 0,
"data-size": 14,
"font-size": 14,
"font-family": "Courier New",
@ -394,7 +397,8 @@
"fill": "#3e3e4b",
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"text-shadow": "black 0px 0px 4px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Almendra SC",

View file

@ -332,6 +332,7 @@
"opacity": 0.8,
"fill": "#3a3a3a",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 7,
"font-size": 7,
"font-family": "Arima Madurai"
@ -357,6 +358,7 @@
"opacity": 0.8,
"fill": "#3e3e4b",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 4,
"font-size": 4,
"font-family": "Arima Madurai"
@ -384,6 +386,7 @@
"stroke": "#000000",
"stroke-width": 0,
"text-shadow": "white 0px 0px 6px",
"letter-spacing": 0,
"data-size": 14,
"font-size": 14,
"font-family": "Arima Madurai",
@ -395,6 +398,7 @@
"stroke": "#701b05",
"stroke-width": 0.1,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 6,
"font-size": 6,
"font-family": "Arima Madurai",

View file

@ -332,6 +332,7 @@
"opacity": 1,
"fill": "#043449",
"text-shadow": "white 0px 0px 2px",
"letter-spacing": 0,
"data-size": 5,
"font-size": 5,
"font-family": "Comfortaa"
@ -357,6 +358,7 @@
"opacity": 1,
"fill": "#3e3e4b",
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 3,
"font-size": 3,
"font-family": "Comfortaa"
@ -384,6 +386,7 @@
"stroke": "#000000",
"stroke-width": 0.15,
"text-shadow": "black 1px 1px 3px",
"letter-spacing": 0,
"data-size": 18,
"font-size": 18,
"font-family": "Gloria Hallelujah",
@ -395,6 +398,7 @@
"stroke": "#3a3a3a",
"stroke-width": 0,
"text-shadow": "white 0px 0px 4px",
"letter-spacing": 0,
"data-size": 16,
"font-size": 16,
"font-family": "Comfortaa",