chore: optimize all embedded SVGs

pedrolamas · pedrolamas · commit d381e10427e3 · 2025-11-27T12:33:52.000Z
Signed-off-by: Pedro Lamas &lt;pedrolamas@gmail.com&gt;
diff --git a/src/App.vue b/src/App.vue
@@ -273,7 +273,7 @@ export default class App extends Mixins(StateMixin, FilesMixin, BrowserMixin) {
   }
 
   get defaultIconDataUrl () {
-    const logoWithColor = `<svg width="56" height="56" viewBox="0 0 56 56" xmlns="http://www.w3.org/2000/svg"><g><path fill="${this.primaryOffsetColor}" d="m 14.853368,33.756571 11.61619,9.661168 c 0.130777,0.111917 0.271485,0.207659 0.419213,0.286738 v 0 l 0.0018,9.59e-4 0.04421,0.02288 0.01682,0.0084 0.03004,0.01466 0.02772,0.01301 0.02085,0.0096 0.03643,0.01614 0.0112,0.0048 c 0.261834,0.111457 0.538454,0.172946 0.816165,0.185089 v 0 l 0.0094,4.66e-4 0.04421,0.0014 0.01743,3.11e-4 0.03579,1.57e-4 0.03113,-1.57e-4 0.01976,-3.11e-4 0.04638,-0.0016 0.0066,-1.57e-4 c 0.278332,-0.01219 0.555886,-0.07379 0.818498,-0.185864 v 0 l 0.0076,-0.0031 0.04141,-0.01836 0.01581,-0.0072 0.03019,-0.01433 0.03192,-0.01548 0.01367,-0.0071 0.04375,-0.02273 0.0048,-0.0023 c 0.147428,-0.07893 0.287828,-0.174502 0.418278,-0.28627 v 0 L 40.390591,34.385713 46.037415,38.112852 27.999766,56 9.242502,37.397936 Z m 0.408314,-14.451202 11.425655,7.349201 c 0.406292,0.266969 0.859439,0.40053 1.312586,0.400687 0.452679,0 0.90536,-0.133247 1.311963,-0.400064 v 0 l 11.426278,-7.349045 8.736349,4.462197 -21.47459,17.859067 -21.47459,-17.86031 z M 27.999923,0 52.420045,8.9925786 27.999923,24.698769 3.579955,8.9913323 Z" /><path fill="${this.primaryColor}" d="m 28,0 -0.134766,0.05078125 h 0.150391 V 24.689453 L 52.419922,8.9921875 Z m 12.738281,19.306641 -11.425781,7.347656 -0.05859,0.03906 c -0.386465,0.238992 -0.812514,0.358329 -1.238281,0.361329 v 14.558595 l 21.45898,-17.845703 z m -0.347656,15.080078 -10.859375,9.03125 c -0.13045,0.111767 -0.270596,0.206206 -0.417969,0.285156 l -0.0059,0.002 -0.04297,0.02344 -0.01367,0.0078 -0.0332,0.01563 -0.0293,0.01367 -0.01563,0.0078 -0.04102,0.01758 -0.0078,0.0039 c -0.26261,0.112075 -0.540027,0.173357 -0.818359,0.185547 h -0.0078 l -0.04492,0.002 h -0.02148 -0.01563 V 55.984375 L 46.037109,38.113281 Z" /></g></svg>`
+    const logoWithColor = `<svg width="56" height="56" viewBox="0 0 56 56" xmlns="http://www.w3.org/2000/svg"><g><path fill="${this.primaryOffsetColor}" d="m14.853 33.757 11.617 9.66q.196.169.419.287l.002.001.044.023.017.009.03.014.027.013.021.01.037.016.01.005c.263.111.54.173.817.185h.01l.044.002h.104l.046-.002h.007a2.3 2.3 0 0 0 .818-.186l.008-.003.041-.018.016-.007.03-.015.032-.015.014-.007.044-.023.004-.002a2.3 2.3 0 0 0 .419-.287l10.86-9.031 5.646 3.727L28 56 9.243 37.398Zm.409-14.452 11.425 7.35c.407.267.86.4 1.313.4s.905-.133 1.312-.4l11.426-7.349 8.737 4.462L28 41.628 6.525 23.767zM28 0l24.42 8.993L28 24.699 3.58 8.99Z" /><path fill="${this.primaryColor}" d="m28 0-.135.05h.15v24.64L52.42 8.991Zm12.738 19.307-11.425 7.347-.06.04a2.4 2.4 0 0 1-1.237.36v14.56l21.459-17.846zm-.347 15.08-10.86 9.031q-.196.167-.418.285l-.006.002-.043.024-.013.007-.033.016-.03.014-.015.007-.041.018-.008.004c-.263.112-.54.173-.819.185h-.007l-.045.002h-.037v12.002l18.021-17.87Z" /></g></svg>`
 
     return `data:image/svg+xml;base64,${btoa(logoWithColor)}`
   }
diff --git a/src/components/widgets/gcode-preview/GcodePreview.vue b/src/components/widgets/gcode-preview/GcodePreview.vue
@@ -47,14 +47,14 @@
         >
           <path
             v-if="flipY"
-            d="M 0,0 L 5,10 L 10,0 Z"
+            d="m0 0 5 10 5-10Z"
             fill="red"
             fill-opacity="0.9"
             :shape-rendering="shapeRendering"
           />
           <path
             v-else
-            d="M 10,10 L 5,0 L 0,10 Z"
+            d="M10 10 5 0 0 10Z"
             fill="red"
             fill-opacity="0.9"
             :shape-rendering="shapeRendering"
@@ -68,14 +68,14 @@
         >
           <path
             v-if="flipY"
-            d="M 10,10 L 5,0 L 0,10 Z"
+            d="M10 10 5 0 0 10Z"
             fill="green"
             fill-opacity="0.9"
             :shape-rendering="shapeRendering"
           />
           <path
             v-else
-            d="M 0,0 L 5,10 L 10,0 Z"
+            d="m0 0 5 10 5-10Z"
             fill="green"
             fill-opacity="0.9"
             :shape-rendering="shapeRendering"
@@ -90,13 +90,13 @@
           <path
             fill="#ff0000"
             fill-opacity="0.4"
-            d="M 8.5859375 -1.4140625 L 8.2324219 -1.0605469 L 9.0429688 -0.25 L 0.96875 -0.25 A 1 1 0 0 1 1 0 A 1 1 0 0 1 0.96679688 0.25 L 9.0429688 0.25 L 8.2324219 1.0605469 L 8.5859375 1.4140625 L 10 0 L 8.5859375 -1.4140625 z "
+            d="m8.586-1.414-.354.353.811.811H.969A1 1 0 0 1 1 0a1 1 0 0 1-.033.25h8.076l-.81.81.353.354L10 0z"
             :shape-rendering="shapeRendering"
           />
           <path
             fill="#00ff00"
             fill-opacity="0.4"
-            d="M -0.25 0.96679688 L -0.25 9.0429688 L -1.0605469 8.2324219 L -1.4140625 8.5859375 L 0 10 L 1.4140625 8.5859375 L 1.0605469 8.2324219 L 0.25 9.0429688 L 0.25 0.96679688 A 1 1 0 0 1 0 1 A 1 1 0 0 1 -0.25 0.96679688 z "
+            d="M-.25.967v8.076l-.81-.81-.354.353L0 10l1.414-1.414-.353-.354-.811.811V.967A1 1 0 0 1 0 1 1 1 0 0 1-.25.967"
             :shape-rendering="shapeRendering"
           />
           <circle
diff --git a/src/components/widgets/mmu/MmuFilamentStatus.vue b/src/components/widgets/mmu/MmuFilamentStatus.vue
@@ -11,11 +11,11 @@
         style="stroke: var(--color-outline); stroke-linecap: round; stroke-linejoin: round; fill: none;"
       >
         <path
-          d="M18,9,13.78,3.39a1,1,0,0,0-1.56,0L8,9"
+          d="m18 9-4.22-5.61a1 1 0 0 0-1.56 0L8 9"
           style="stroke-width: 1; stroke-opacity: 0.8"
         />
         <path
-          d="M13,8.24,18,15H15H8Z"
+          d="M13 8.24 18 15H8Z"
           style="stroke-width: 2"
         />
       </g>
@@ -25,7 +25,7 @@
         style="stroke: var(--color-outline); fill: none; stroke-linecap: round; stroke-linejoin: round;"
       >
         <path
-          d="M8.8,7.72c-.6,1.21-2.34,1.64-3.89,1S2.6,6.48,3.2,5.28s2.34-1.64,3.89-1S9.4,6.52,8.8,7.72Zm-3.89,1L21,16M7.09,19.68c-1.55.68-3.29.25-3.89-1s.17-2.73,1.71-3.4,3.29-.25,3.89,1S8.63,19,7.09,19.68ZM21,8,4.91,15.32"
+          d="M8.8 7.72c-.6 1.21-2.34 1.64-3.89 1S2.6 6.48 3.2 5.28s2.34-1.64 3.89-1S9.4 6.52 8.8 7.72m-3.89 1L21 16M7.09 19.68c-1.55.68-3.29.25-3.89-1s.17-2.73 1.71-3.4 3.29-.25 3.89 1-.17 2.72-1.71 3.4M21 8 4.91 15.32"
           style="fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2"
         />
         <line
@@ -87,7 +87,7 @@
           />
           <path
             style="fill: rgb(88, 110, 117)"
-            d="m 322 762 h 355 l -118 142 h -118 z"
+            d="M322 762h355L559 904H441z"
           />
         </g>
         <g transform="matrix(23.2058 0 0 23.2058 329.7195 325.9517)">
@@ -109,7 +109,7 @@
             vector-effect="non-scaling-stroke"
             transform=" translate(-15.4288, -16.4198)"
             stroke-linecap="round"
-            d="M 25.032 26.16 c 2.884 -2.883 4.184 -6.74 3.928 -10.51 c -1.511 0.013 -3.021 0.021 -4.531 0.034 c 0.254 2.599 -0.603 5.287 -2.594 7.277 c -3.535 3.533 -9.263 3.533 -12.796 0 c -3.534 -3.533 -3.534 -9.26 0 -12.794 c 3.015 -3.016 7.625 -3.446 11.109 -1.314 c -1.181 1.167 -2.57 2.549 -2.57 2.549 c -1 1.062 0.016 1.766 0.69 1.77 h 8.828 c 0.338 0 0.611 -0.274 0.612 -0.612 V 3.804 c 0.041 -0.825 -0.865 -1.591 -1.756 -0.7 c 0 0 -1.495 1.48 -2.533 2.509 C 18.112 1.736 10.634 2.175 5.841 6.967 c -5.3 5.3 -5.3 13.892 0 19.193 C 11.141 31.459 19.733 31.459 25.032 26.16 z"
+            d="M25.032 26.16c2.884-2.883 4.184-6.74 3.928-10.51-1.511.013-3.021.021-4.531.034a9.01 9.01 0 0 1-2.594 7.277c-3.535 3.533-9.263 3.533-12.796 0a9.045 9.045 0 0 1 0-12.794c3.015-3.016 7.625-3.446 11.109-1.314-1.181 1.167-2.57 2.549-2.57 2.549-1 1.062.016 1.766.69 1.77h8.828a.613.613 0 0 0 .612-.612V3.804c.041-.825-.865-1.591-1.756-.7l-2.533 2.509C18.112 1.736 10.634 2.175 5.841 6.967c-5.3 5.3-5.3 13.892 0 19.193 5.3 5.299 13.892 5.299 19.191 0"
           />
         </g>
       </g>
@@ -137,11 +137,11 @@
       >
         <path
           fill="rgb(131,148,150)"
-          d="M368,368 V376 C368,380.41,364.41,384,360,384 H344 V360 H360 C364.41,360,368,363.59,368,368 Z M368,408 V416 C368,420.41,364.41,424,360,424 C293.65,424,340.73,424,312,424 C307.59,424,304,420.41,304,416 V408 C304,403.59,307.59,400,312,400 C326.91,400,345.09,400,360,400 C364.41,400,368,403.59,368,408 Z M248.97,461.66 L242.34,455.03 C237.81,450.5,231.78,448,225.38,448 H160 V368 H193.38 C199.79,368,205.82,365.5,210.35,360.97 L248.97,322.35 C250.49,320.84,252.5,320,254.63,320 H320 C324.42,320,328,323.59,328,328 V384 C322.21,384,317.79,384,312,384 C307.59,384,304,380.42,304,376 V350.61 C304,346.19,300.43,342.61,296,342.61 S288,346.19,288,350.61 V357.2 L262.56,389 C261.04,390.91,258.75,392,256.31,392 H217.05 C212.63,392,209.05,395.58,209.05,400 S212.63,408,217.05,408 H256.31 C263.64,408,270.47,404.72,275.06,399 L288.74,381.9 C289.71,385.74,291.62,389.21,294.2,392.06 C290.39,396.31,288,401.86,288,408 V416 C288,427.06,295.56,436.31,305.76,439.08 C304.65,441.84,304,444.85,304,448.01 V456.01 C304,458.82,304.58,461.49,305.48,464.01 H254.63 C252.49,464.01,250.48,463.17,248.97,461.67 Z M368,456 C368,460.41,364.41,464,360,464 H328 C323.59,464,320,460.41,320,456 V448 C320,443.59,323.59,440,328,440 H360 C364.41,440,368,443.59,368,448 V456 Z M368,328 V336 C368,340.41,364.41,344,360,344 H344 V328 C344,325.18,343.42,322.51,342.53,320 H360 C364.41,320,368,323.59,368,328 Z"
+          d="M368 368v8c0 4.41-3.59 8-8 8h-16v-24h16c4.41 0 8 3.59 8 8m0 40v8c0 4.41-3.59 8-8 8h-48c-4.41 0-8-3.59-8-8v-8c0-4.41 3.59-8 8-8h48c4.41 0 8 3.59 8 8m-119.03 53.66-6.63-6.63c-4.53-4.53-10.56-7.03-16.96-7.03H160v-80h33.38c6.41 0 12.44-2.5 16.97-7.03l38.62-38.62a8 8 0 0 1 5.66-2.35H320c4.42 0 8 3.59 8 8v56h-16c-4.41 0-8-3.58-8-8v-25.39c0-4.42-3.57-8-8-8s-8 3.58-8 8v6.59L262.56 389c-1.52 1.91-3.81 3-6.25 3h-39.26c-4.42 0-8 3.58-8 8s3.58 8 8 8h39.26c7.33 0 14.16-3.28 18.75-9l13.68-17.1c.97 3.84 2.88 7.31 5.46 10.16-3.81 4.25-6.2 9.8-6.2 15.94v8c0 11.06 7.56 20.31 17.76 23.08-1.11 2.76-1.76 5.77-1.76 8.93v8c0 2.81.58 5.48 1.48 8h-50.85a8 8 0 0 1-5.66-2.34ZM368 456c0 4.41-3.59 8-8 8h-32c-4.41 0-8-3.59-8-8v-8c0-4.41 3.59-8 8-8h32c4.41 0 8 3.59 8 8zm0-128v8c0 4.41-3.59 8-8 8h-16v-16c0-2.82-.58-5.49-1.47-8H360c4.41 0 8 3.59 8 8"
         />
         <path
           :fill="currentGateColor"
-          d="M300,250 L350,250 L350,310 L300,310 Z M300,475 L350,475 L350,520 L300,520 Z"
+          d="M300 250h50v60h-50Zm0 225h50v45h-50Z"
         />
       </g>
     </defs>
@@ -166,7 +166,7 @@
     />
     <g style="stroke: var(--color-outline); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1;">
       <path
-        d="M242 25 L242 405 L249 411 L251 411 L258 405 L258 25"
+        d="M242 25v380l7 6h2l7-6V25"
         style="fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1"
       />
     </g>
@@ -262,7 +262,7 @@
           :class="encoderClass"
         />
         <path
-          d="M257 135 L261 140 L257 145"
+          d="m257 135 4 5-4 5"
           stroke-width="2"
           fill="none"
         />
diff --git a/src/components/widgets/mmu/MmuSpool.vue b/src/components/widgets/mmu/MmuSpool.vue
@@ -7,17 +7,17 @@
     <defs>
       <path
         id="oval"
-        d="M 0 -63 C 35 -63 63 -35 63 0 C 63 35 35 63 0 63 C -35 63 -63 35 -63 0 C -63 -35 -35 -63 0 -63 z"
+        d="M0-63c35 0 63 28 63 63S35 63 0 63-63 35-63 0s28-63 63-63"
         vector-effect="non-scaling-stroke"
       />
       <path
         id="center"
-        d="M 0 -63 C 35 -63 63 -35 63 0 C 63 35 35 63 0 63 L -624 63 L -624 -63 z"
+        d="M0-63c35 0 63 28 63 63S35 63 0 63h-624V-63z"
         vector-effect="non-scaling-stroke"
       />
       <path
         id="espool"
-        d="M 89.561 35.5 L 60.333 15.734 c -0.308 -0.208 -0.704 -0.229 -1.029 -0.055 c -0.327 0.173 -0.531 0.513 -0.531 0.883 v 7.987 c -12.038 0.262 -26.306 5.201 -37.501 13.023 C 7.554 47.155 0 59.894 0 73.438 c 0 0.471 0.329 0.878 0.79 0.978 C 0.86 74.432 0.931 74.438 1 74.438 c 0.386 0 0.747 -0.225 0.911 -0.588 c 7.823 -17.312 26.952 -26.183 56.861 -26.376 v 8.62 c 0 0.37 0.204 0.71 0.531 0.883 c 0.325 0.173 0.722 0.153 1.029 -0.055 l 29.228 -19.766 C 89.835 36.971 90 36.661 90 36.329 S 89.835 35.686 89.561 35.5 z"
+        d="M89.561 35.5 60.333 15.734a.999.999 0 0 0-1.56.828v7.987c-12.038.262-26.306 5.201-37.501 13.023C7.554 47.155 0 59.894 0 73.438a1.001 1.001 0 0 0 1.911.412c7.823-17.312 26.952-26.183 56.861-26.376v8.62a.999.999 0 0 0 1.56.828L89.56 37.156c.275-.185.44-.495.44-.827s-.165-.643-.439-.829"
         stroke-width="2"
         stroke="#CCCCCC"
         fill="#808080"
@@ -73,7 +73,7 @@
     <path
       v-if="filamentAmount !== 0 || details.status !== GATE_EMPTY"
       ref="filament"
-      d="M 0 -63 C 35 -63 63 -35 63 0 C 63 35 35 63 0 63 L -424 63 L -424 -63 z"
+      d="M0-63c35 0 63 28 63 63S35 63 0 63h-424V-63z"
       vector-effect="non-scaling-stroke"
       :fill="filamentColor"
       :transform="'matrix(' + computedScale(0.28, 0.4) + ',0,0,' + computedScale(1.65, 3.5) + ',197,250)'"
diff --git a/src/components/widgets/toolhead/ToolheadControlCircle.vue b/src/components/widgets/toolhead/ToolheadControlCircle.vue
diff --git a/src/globals.ts b/src/globals.ts

Original file line number	Diff line number	Diff line change
`@@ -273,7 +273,7 @@ export default class App extends Mixins(StateMixin, FilesMixin, BrowserMixin) {`
`273`	`273`	`}`
`274`	`274`
`275`	`275`	`get defaultIconDataUrl () {`
`276`		- const logoWithColor = `<svg width="56" height="56" viewBox="0 0 56 56" xmlns="http://www.w3.org/2000/svg"><g><path fill="${this.primaryOffsetColor}" d="m 14.853368,33.756571 11.61619,9.661168 c 0.130777,0.111917 0.271485,0.207659 0.419213,0.286738 v 0 l 0.0018,9.59e-4 0.04421,0.02288 0.01682,0.0084 0.03004,0.01466 0.02772,0.01301 0.02085,0.0096 0.03643,0.01614 0.0112,0.0048 c 0.261834,0.111457 0.538454,0.172946 0.816165,0.185089 v 0 l 0.0094,4.66e-4 0.04421,0.0014 0.01743,3.11e-4 0.03579,1.57e-4 0.03113,-1.57e-4 0.01976,-3.11e-4 0.04638,-0.0016 0.0066,-1.57e-4 c 0.278332,-0.01219 0.555886,-0.07379 0.818498,-0.185864 v 0 l 0.0076,-0.0031 0.04141,-0.01836 0.01581,-0.0072 0.03019,-0.01433 0.03192,-0.01548 0.01367,-0.0071 0.04375,-0.02273 0.0048,-0.0023 c 0.147428,-0.07893 0.287828,-0.174502 0.418278,-0.28627 v 0 L 40.390591,34.385713 46.037415,38.112852 27.999766,56 9.242502,37.397936 Z m 0.408314,-14.451202 11.425655,7.349201 c 0.406292,0.266969 0.859439,0.40053 1.312586,0.400687 0.452679,0 0.90536,-0.133247 1.311963,-0.400064 v 0 l 11.426278,-7.349045 8.736349,4.462197 -21.47459,17.859067 -21.47459,-17.86031 z M 27.999923,0 52.420045,8.9925786 27.999923,24.698769 3.579955,8.9913323 Z" /><path fill="${this.primaryColor}" d="m 28,0 -0.134766,0.05078125 h 0.150391 V 24.689453 L 52.419922,8.9921875 Z m 12.738281,19.306641 -11.425781,7.347656 -0.05859,0.03906 c -0.386465,0.238992 -0.812514,0.358329 -1.238281,0.361329 v 14.558595 l 21.45898,-17.845703 z m -0.347656,15.080078 -10.859375,9.03125 c -0.13045,0.111767 -0.270596,0.206206 -0.417969,0.285156 l -0.0059,0.002 -0.04297,0.02344 -0.01367,0.0078 -0.0332,0.01563 -0.0293,0.01367 -0.01563,0.0078 -0.04102,0.01758 -0.0078,0.0039 c -0.26261,0.112075 -0.540027,0.173357 -0.818359,0.185547 h -0.0078 l -0.04492,0.002 h -0.02148 -0.01563 V 55.984375 L 46.037109,38.113281 Z" /></g></svg>`
	`276`	+ const logoWithColor = `<svg width="56" height="56" viewBox="0 0 56 56" xmlns="http://www.w3.org/2000/svg"><g><path fill="${this.primaryOffsetColor}" d="m14.853 33.757 11.617 9.66q.196.169.419.287l.002.001.044.023.017.009.03.014.027.013.021.01.037.016.01.005c.263.111.54.173.817.185h.01l.044.002h.104l.046-.002h.007a2.3 2.3 0 0 0 .818-.186l.008-.003.041-.018.016-.007.03-.015.032-.015.014-.007.044-.023.004-.002a2.3 2.3 0 0 0 .419-.287l10.86-9.031 5.646 3.727L28 56 9.243 37.398Zm.409-14.452 11.425 7.35c.407.267.86.4 1.313.4s.905-.133 1.312-.4l11.426-7.349 8.737 4.462L28 41.628 6.525 23.767zM28 0l24.42 8.993L28 24.699 3.58 8.99Z" /><path fill="${this.primaryColor}" d="m28 0-.135.05h.15v24.64L52.42 8.991Zm12.738 19.307-11.425 7.347-.06.04a2.4 2.4 0 0 1-1.237.36v14.56l21.459-17.846zm-.347 15.08-10.86 9.031q-.196.167-.418.285l-.006.002-.043.024-.013.007-.033.016-.03.014-.015.007-.041.018-.008.004c-.263.112-.54.173-.819.185h-.007l-.045.002h-.037v12.002l18.021-17.87Z" /></g></svg>`
`277`	`277`
`278`	`278`	return `data:image/svg+xml;base64,${btoa(logoWithColor)}`
`279`	`279`	`}`