change small t latter shape

public/assets/small-letter/ts.svg

@@ -7,10 +7,11 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
+   sodipodi:docname="ts_l2.svg"
-   inkscape:export-filename="ts.svg"
+   inkscape:export-filename="ts_l2.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
+   inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
@@ -28,12 +29,12 @@
      showgrid="false"
      showguides="true"
      inkscape:zoom="1.6295423"
-     inkscape:cx="47.252532"
+     inkscape:cx="125.49536"
-     inkscape:cy="206.19287"
+     inkscape:cy="151.88314"
      inkscape:window-width="1920"
-     inkscape:window-height="1007"
+     inkscape:window-height="1027"
-     inkscape:window-x="0"
+     inkscape:window-x="-8"
-     inkscape:window-y="0"
+     inkscape:window-y="-8"
      inkscape:window-maximized="1"
      inkscape:current-layer="svg5">
     <sodipodi:guide
@@ -132,42 +133,49 @@
          id="arrow2L-6-6" />
     </marker>
   </defs>
-  <path
+  <g
-     style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
+     id="g18882"
-     d="m 50.08549,24.331693 c 0.121005,1.203615 -0.079,39.438697 -0.160045,40.602866"
+     style="display:inline">
-     id="path127" />
+    <path
-  <text
+       style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-     xml:space="preserve"
+       d="m 50.08549,24.331693 c 0.276649,8.508821 -0.204874,28.733484 -0.204874,37.237207 0,4.994314 10.537236,5.173737 10.111561,-3.778473"
-     style="font-size:3.62443px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       id="path127"
-     x="48.917473"
+       sodipodi:nodetypes="ccc" />
-     y="26.370642"
+    <text
-     id="text9342"
+       xml:space="preserve"
-     transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
+       style="font-size:3.62443px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-       id="tspan9340"
-       style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.181793;stroke-dasharray:none;stroke-opacity:1"
        x="48.917473"
-       y="26.370642">1</tspan></text>
+       y="26.370642"
-  <circle
+       id="text9342"
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+       transform="matrix(0.99957927,-0.0076705,0.00767651,1.000362,0,0)"><tspan
-     id="path9448"
+         id="tspan9340"
-     cx="-50.669743"
+         style="fill:#ffffff;fill-opacity:1;stroke:#f9f4f4;stroke-width:0.181793;stroke-dasharray:none;stroke-opacity:1"
-     cy="-23.430946"
+         x="48.917473"
-     r="1.6570226"
+         y="26.370642">1</tspan></text>
-     transform="rotate(-178.67073)" />
+    <circle
-  <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#f9f6f6;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-     style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.46448;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-5);paint-order:stroke fill markers"
+       id="path9448"
-     d="m 50.181312,42.781753 c -0.01038,-3.228056 -0.0043,-15.652996 -0.0043,-15.652996"
+       cx="-50.669743"
-     id="path13743" />
+       cy="-23.430946"
+       r="1.6570226"
+       transform="rotate(-178.67073)" />
+    <path
+       style="display:inline;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#fefdfd;stroke-width:0.46448;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-5);paint-order:stroke fill markers"
+       d="m 50.181312,42.781753 c -0.01038,-3.228056 -0.0043,-15.652996 -0.0043,-15.652996"
+       id="path13743" />
+  </g>
   <g
      id="g18551"
-     transform="translate(-1.0583333,-0.52916667)">
+     transform="translate(-1.0583333,-0.52916667)"
+     style="display:inline">
     <path
        style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
        d="m 63.698073,36.333523 c -2.013851,0.08758 -26.404088,0.195734 -26.404088,0.195734"
        id="path1236-5" />
     <g
        id="g1301"
-       transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)">
+       transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)"
+       style="display:inline">
       <text
          xml:space="preserve"
          style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"

public/assets/small-letter/ts_l1.svg

@@ -7,7 +7,7 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
+   sodipodi:docname="ts_l2.svg"
    inkscape:export-filename="ts-l1.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
@@ -115,29 +115,15 @@
          style="fill:context-stroke;fill-rule:evenodd;stroke:none"
          id="arrow2L-54" />
     </marker>
-    <marker
-       style="overflow:visible"
-       id="Arrow2-3-7"
-       refX="0"
-       refY="0"
-       orient="auto-start-reverse"
-       markerWidth="7.6999998"
-       markerHeight="5.5999999"
-       viewBox="0 0 7.7 5.6"
-       preserveAspectRatio="xMidYMid">
-      <path
-         transform="scale(0.7)"
-         d="M -2,-4 9,0 -2,4 c 2,-2.33 2,-5.66 0,-8 z"
-         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
-         id="arrow2L-6-6" />
-    </marker>
   </defs>
   <g
-     id="g18882">
+     id="g18882"
+     style="display:inline">
     <path
        style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 50.08549,24.331693 c 0.121005,1.203615 -0.079,39.438697 -0.160045,40.602866"
+       d="m 50.08549,24.331693 c 0.276649,8.508821 -0.204874,28.733484 -0.204874,37.237207 0,4.994314 10.537236,5.173737 10.111561,-3.778473"
-       id="path127" />
+       id="path127"
+       sodipodi:nodetypes="ccc" />
     <text
        xml:space="preserve"
        style="font-size:3.62443px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
@@ -161,39 +147,4 @@
        d="m 50.181312,42.781753 c -0.01038,-3.228056 -0.0043,-15.652996 -0.0043,-15.652996"
        id="path13743" />
   </g>
-  <g
-     id="g18551"
-     transform="translate(-1.0583333,-0.52916667)"
-     style="display:none">
-    <path
-       style="display:inline;fill:#b16c57;fill-opacity:1;fill-rule:nonzero;stroke:#b16c57;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 63.698073,36.333523 c -2.013851,0.08758 -26.404088,0.195734 -26.404088,0.195734"
-       id="path1236-5" />
-    <g
-       id="g1301"
-       transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)">
-      <text
-         xml:space="preserve"
-         style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         x="54.113926"
-         y="-23.497944"
-         id="text1240-6"
-         transform="matrix(0.828845,0.5587786,-0.55921616,0.82949403,0,0)"><tspan
-           id="tspan1238-9"
-           style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-dasharray:none;stroke-opacity:1"
-           x="54.113926"
-           y="-23.497944">2</tspan></text>
-      <circle
-         style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#f9f6f6;stroke-width:0.14;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
-         id="circle1242-3"
-         cx="-54.018658"
-         cy="25.946033"
-         r="1.2760839"
-         transform="rotate(-144.24458)" />
-    </g>
-    <path
-       style="display:inline;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#fefdfd;stroke-width:0.481099;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker-start:url(#Arrow2-3-7);paint-order:stroke fill markers"
-       d="m 53.475324,36.181898 c -2.146558,0.0055 -10.407988,0.100872 -10.407988,0.100872"
-       id="path1246-7" />
-  </g>
 </svg>

public/assets/small-letter/ts_l2.svg

@@ -7,10 +7,11 @@
    viewBox="0 0 100 100"
    version="1.1"
    id="svg5"
-   sodipodi:docname="as.svg"
+   sodipodi:docname="ts_l2.svg"
-   inkscape:export-filename="ts-l2.svg"
+   inkscape:export-filename="ts-l3.svg"
    inkscape:export-xdpi="96"
    inkscape:export-ydpi="96"
+   inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
@@ -28,12 +29,12 @@
      showgrid="false"
      showguides="true"
      inkscape:zoom="1.6295423"
-     inkscape:cx="47.252532"
+     inkscape:cx="125.49536"
-     inkscape:cy="206.19287"
+     inkscape:cy="151.88314"
      inkscape:window-width="1920"
-     inkscape:window-height="1007"
+     inkscape:window-height="1027"
-     inkscape:window-x="0"
+     inkscape:window-x="-8"
-     inkscape:window-y="0"
+     inkscape:window-y="-8"
      inkscape:window-maximized="1"
      inkscape:current-layer="svg5">
     <sodipodi:guide
@@ -137,8 +138,9 @@
      style="display:none">
     <path
        style="display:inline;fill:none;fill-opacity:1;stroke:#009e40;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
-       d="m 50.08549,24.331693 c 0.121005,1.203615 -0.079,39.438697 -0.160045,40.602866"
+       d="m 50.08549,24.331693 c 0.276649,8.508821 -0.204874,28.733484 -0.204874,37.237207 0,4.994314 10.537236,5.173737 10.111561,-3.778473"
-       id="path127" />
+       id="path127"
+       sodipodi:nodetypes="ccc" />
     <text
        xml:space="preserve"
        style="font-size:3.62443px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#f9f4f4;stroke-width:0.181793;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
@@ -172,7 +174,8 @@
        id="path1236-5" />
     <g
        id="g1301"
-       transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)">
+       transform="matrix(1.0751203,-0.72819851,0.72819851,1.0751203,-30.931124,68.289741)"
+       style="display:inline">
       <text
          xml:space="preserve"
          style="font-size:2.31549px;display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#f9f4f4;stroke-width:0.11614;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"

src/pages/drawing/index.astro

@@ -64,7 +64,7 @@ import Layout from '../../layouts/Layout.astro';
     const data =       fetch(`https://management.beanstalkedu.com/items/game_drawing/${encodeURIComponent(paramsID)}`)
     .then(response => response.json())
     .then(({data}) => {
-        colorList = data.colors;
+        // colorList = data.colors;
     const {image} = data;
     assetsList.image = "https://management.beanstalkedu.com/assets/" + image; // + "?width=450";
     const config = {
@@ -225,9 +225,8 @@ import Layout from '../../layouts/Layout.astro';
             // Append the color picker to the color container data
             colorContainer.appendChild(colorPicker);
             // const colors = data.colors;
-            // console.log(colorList)
+            // var colors = colorList;
-            var colors = colorList;
+            const colors = ['#ff0000', '#00ff00', '#0000ff', '#ffff00', '#ff00ff', '#00ffff'];
-            // const colors = ['#ff0000', '#00ff00', '#0000ff', '#ffff00', '#ff00ff', '#00ffff'];
             const buttonSize = 50;
             const buttonSpacing = 15;
             // Create a container div for the color buttons