id: 44
pagetitle: Projekt
longtitle: 'Bearbeite dein Projekt: '
description: 'Bearbeite deine individuelle Anleitung. Berechne mit deinen Maßen, deiner Maschenprobe und deinem Schnitt '
alias: projekt
published: 1
parent: 45
introtext: ''
richtext: 0
template: 9
createdby: 1
createdon: 1687270541
publishedon: 1687270500
publishedby: 1
context_key: justknit
uri: projekte/projekt/
properties: null
tvs: {  }

-----

[[-!ProjectEdit?
    &Calcs=`project`
    &Dims=`wBust,wWaist,wHips,wFrontband,wFront,hCo2hips,hHips2waist,hWaist2armhole,hCo2Armhole,hProject,hNeckFront,hArmhole,hNeckBack, hShoulder, wNeck, wShoulder, wCrossback, wArmhole, hCap, hSleeve, hSleeve2Underarm, wNeckRaglan,wUpperarm, wWrist`
    &showModal=`wBust_len,wWaist_len,wHips_len,wFrontband_len,wFront_len,hCo2hips_len,hHips2waist_len,hWaist2armhole_len,hCo2Armhole_len,hProject_len,hNeckFront_len,hArmhole_len,hNeckBack_len,hShoulder_len,wNeck_len,wShoulder_len,wCrossback_len,wArmhole_len,hCap_len,hSleeve_len,hSleeve2Underarm_len,wNeckRaglan_len,wUpperarm_len,wWrist_len`
    &showValue=`len_w,qty_w,len_h,qty_h,description,title`
]]

<div class="card-stepper printview" [[-data-html2canvas-ignore]]>  
    <ul id="progressbar" class="mx-0 mt-2 mb-5 px-0 pt-0 pb-4">[[- Beispiel aus https://bbbootstrap.com/snippets/order-tracking-details-progress-bar-11090565]]
      <li class="step0 active" id="step1"><a class="stretched-link text-decoration-none target-shape" data-bs-toggle="collapse" href="#shape" role="button" aria-expanded="false" aria-controls="shape"><span style="margin-left: 22px; margin-top: 12px;">Form</span></a></li><!-- shape -->[[-style="margin-left: 22px; margin-top: 12px;"]]
      <li class="step0 text-center" id="step2"><a class="stretched-link text-decoration-none target-sketch" data-bs-toggle="collapse" href="#sketch" role="button" aria-expanded="false" aria-controls="sketch"><span >Maße</span></a></li><!-- sketch -->
      <li class="step0 text-center" id="step3"><a class="stretched-link text-decoration-none target-gauge" data-bs-toggle="collapse" href="#gauge" role="button" aria-expanded="false" aria-controls="gauge"><span >MaPro</span></a></li><!-- gauge -->
      <li class="step0 text-muted text-end" id="step4"><a class="stretched-link text-decoration-none target-pattern" data-bs-toggle="collapse" href="#pattern" role="button" aria-expanded="false" aria-controls="pattern"><span style="margin-right: 22px;">Anleitung</span></a></li><!-- pattern -->
    </ul>
</div>
<div class="accordion accordion-flush" id="design">
    <div id="shape" class="[[-hideinpdf]] accordion-collapse collapse show accordion-item" data-bs-parent="#design" data-bs-touch="true">
        <div id="shape_div">
            <fieldset class="hideinpdf"[[-data-html2canvas-ignore]]><!-- select fields -->
                <legend>1. Wähle die Form für dein Strickprojekt. </legend>
                <div class="mb-3 d-flex">
                    <select id="cut" class="form-select inVal" aria-label="[[!%pj.cut_label_text]]" required sov="[[+pjv.cut]]" value="[[+pjv.cut]]">
                        <option value="" [[!+pjv.cut:is=``:then=`selected`]]>[[!%pj.cut_option_select]]</option>
                        <option value="cutEven" [[!+pjv.cut:is=`cutEven`:then=`selected`]]>[[!%pj.cut_even_opt]]</option>
                        <option value="cutWaistshape" [[!+pjv.cut:is=`cutWaistshape`:then=`selected`]]>[[!%pj.cut_waistshape_opt]]</option>
                        <option value="cutAline" [[!+pjv.cut:is=`cutAline`:then=`selected`]]>[[!%pj.cut_aline_opt]]</option>
                        <option value="cutSingleshape" [[!+pjv.cut:is=`cutSingleshape`:then=`selected`]]>[[!%pj.cut_singleshape_opt]]</option>
                    </select>        
                    <a class="my-auto ms-1 pop" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.cut_pop_title]]" 
                    data-bs-content="[[!%pj.cut_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>
                <div class="mb-3 d-flex">
                    <select id="arm"  class="form-select inVal" aria-label="[[!%pj.arm_label_text]]" required sov="[[+pjv.arm]]" value="[[+pjv.arm]]">
                        <option value="" [[!+pjv.arm:is=``:then=`selected`]] >[[!%pj.arm_option_select]]</option>
                        <option value="armCap" [[!+pjv.arm:is=`armCap`:then=`selected`]] >[[!%pj.arm_cap_opt]]</option>
                        <option value="armEvenSi" [[!+pjv.arm:is=`armEvenSi`:then=`selected`]] >[[!%pj.arm_even-si_opt]]</option>
                        <option value="armSlope" [[!+pjv.arm:is=`armSlope`:then=`selected`]] >[[!%pj.arm_slope_opt]]</option>
                        <option value="armRaglan" [[!+pjv.arm:is=`armRaglan`:then=`selected`]] >[[!%pj.arm_raglan_opt]]</option>
                        <option value="armEven" [[!+pjv.arm:is=`armEven`:then=`selected`]] >[[!%pj.arm_even_opt]]</option>
                        [[-<option value="armYoke" [[!+pjv.arm:is=`armYoke`:then=`selected`]] >[[!%pj.arm_yoke_opt]]</option>]]
                    </select>
                    <a class="my-auto ms-1 pop" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.arm_pop_title]]" 
                    data-bs-content="[[!%pj.arm_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>
                <div class="mb-3 d-flex">
                    <select id="neck" class="form-select inVal" aria-label="[[!%pj.neck_label_text]]" required sov="[[+pjv.neck]]" value="[[+pjv.neck]]">
                        <option value=""  [[!+pjv.neck:is=``:then=`selected`]] >[[!%pj.neck_option_select]]</option>
                        <option value="neckRound"  [[!+pjv.neck:is=`neckRound`:then=`selected`]] >[[!%pj.neck_round_opt]]</option>
                        <option value="neckV"  [[!+pjv.neck:is=`neckV`:then=`selected`]] >[[!%pj.neck_v_opt]]</option>
                    </select>  
                    <a class="my-auto ms-1 pop" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.neck_pop_title]]" 
                    data-bs-content="[[!%pj.neck_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>
                <div id="shoulder_div" class="mb-3 d-flex">
                   <select id="shoulder" class="form-select inVal" aria-label="[[%pj.shoulder_label_text]]" required sov="[[+pjv.shoulder]]" value="[[+pjv.shoulder]]">
                        <option value=""  [[!+pjv.shoulder:is=``:then=`selected`]] >[[!%pj.shoulder_option_select]]</option>
                        <option value="shoulderSlope" [[!+pjv.shoulder:is=`shoulderSlope`:then=`selected`]] >[[!%pj.shoulder_slope_opt]]</option>
                        <option value="shoulderEven" [[!+pjv.shoulder:is=`shoulderEven`:then=`selected`]] >[[!%pj.shoulder_even_opt]]</option>
                    </select>        
                    <a class="my-auto ms-1 pop" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.shoulder_pop_title]]" 
                    data-bs-content="[[!%pj.shoulder_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>  
                <div id="raglan_div" class="mb-3 d-flex d-none">
                    <select id="raglan" class="form-select inVal" aria-label="[[%pj.raglan_label_text]]" sov="[[+pjv.raglan]]" value="[[+pjv.raglan]]">
                        <option value=""  [[!+pjv.raglan:is=``:then=`selected`]] >[[!%pj.raglan_option_select]]</option>
                        <option value="raglanRow" [[!+pjv.raglan:is=`raglanRow`:then=`selected`]] >[[!%pj.raglan_row_opt]]</option>
                        <option value="raglanRound" [[!+pjv.raglan:is=`raglanRound`:then=`selected`]] >[[!%pj.raglan_round_opt]]</option>
                        [[-<option value="raglanTop" [[!+pjv.raglan:is=`raglanTop`:then=`selected`]] >[[!%pj.raglan_top_opt]]</option>]]
                    </select>        
                    <a class="my-auto ms-1 pop" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.raglan_pop_title]]" 
                    data-bs-content="[[!%pj.raglan_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>    
                <div id="wRaglanLine" class="mb-3  d-none">
                    <label class="form-label" for="wRaglanLine_qty" title="[[!%pj.lwRaglanLine_qty_label_title]]">[[!%pj.wRaglanLine_qty_label_text]]</label>
                    <div class="d-flex ">
                    <input type="number"  inputmode="decimal" step="1" class="form-control inVal shown"  title="[[!%pj.wRaglanLine_qty_label_title]]" id="wRaglanLine_qty" name="wRaglanLine_qty" sov="[[+pjv.wRaglanLine_qty]]" value="[[+pjv.wRaglanLine_qty]]">
                    <div id="DwRaglanLine" class="invalid-tooltip">[[!%pj.inv_0]]</div>
                    <a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="my-auto ms-1 pop" data-bs-toggle="popover" data-placement="top" title="[[!%pj.wRaglanLine_qty_pop_title]]" 
                        data-bs-content="[[!%pj.wRaglanLine_qty_pop_content]]"><i class="bi bi-question-circle"></i></a>
                    </div>
                </div>
            </fieldset><!-- select fields -->
            <fieldset class="hideinpdf"><!-- switch fields NEW 2-->
                <div class="mb-3 d-flex">
                    <input class="form-check-input align-middle inVal" type="checkbox" sov="[[+pjv.front_divided]]" value="[[+pjv.front_divided]]" id="front_divided" name="front_divided" [[!+pjv.front_divided:is=`1`:then=`checked`]]>
                    <label class="form-check-label align-middle ms-2" for="front_divided" title="[[!%pj.front_divided_label_title]]" >[[!%pj.front_divided_label_text]]</label>
                    <a class="ms-auto align-middle" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.front_divided_pop_title]]" 
                    data-bs-content="[[!%pj.front_divided_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>
                <div class="mb-3 d-flex">
                    <input class="form-check-input align-middle inVal" type="checkbox" sov="[[+pjv.has_sleeve]]" value="[[+pjv.has_sleeve]]" id="has_sleeve" name="has_sleeve" [[!+pjv.has_sleeve:is=`1`:then=`checked`]]>
                    <label class="form-check-label align-middle ms-2" for="has_sleeve" title="[[!%pj.has_sleeve_label_title]]">[[!%pj.has_sleeve_label_text]]</label>
                    <a class="ms-auto align-middle" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.has_sleeve_pop_title]]" 
                    data-bs-content="[[!%pj.has_sleeve_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>
                <div class="mb-3 d-flex">
                    <input class="form-check-input align-middle inVal" type="checkbox" sov="[[+pjv.frontband]]" value="[[+pjv.frontband]]" id="frontband" name="frontband" disabled [[!+pjv.frontband:is=`1`:then=`checked`]]>
                    <label class="form-check-label align-middle ms-2" for="frontband" title="[[!%pj.frontband_label_title]]">[[!%pj.frontband_label_text]]</label>
                    <a class="ms-auto align-middle" tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" data-bs-toggle="popover" data-placement="top" title="[[!%pj.frontband_pop_title]]" 
                    data-bs-content="[[!%pj.frontband_pop_content]]"><i class="bi bi-question-circle"></i></a>
                </div>
            </fieldset>
        </div>
        <div id="shape_prt" class="print-ad"><!-- display values in printscreen -->
            <legend>1. Die Form von deinem Strickprojekt. </legend>
            <p id="shape_prt_value" class="h3 py-4"></p>
        </div>            
        <div class="d-flex gap-2">
            <button id="next_sketch" class="btn btn-light ms-auto target-sketch" type="button" data-bs-toggle="collapse" data-bs-target="#sketch" aria-expanded="false" aria-controls="sketch">[[!%pj.goto_next]] <i class="bi bi-arrow-right-short"></i></button>
        </div>
    </div>
    <div id="sketch" class="[[-hideinpdf]] accordion-collapse collapse accordion-item" data-bs-parent="#design">
        <div id="hint" class="row">
            <legend>2. Die Maße von deinem Projekt</legend>
            <p class="d-inline-flex gap-1" [[-data-html2canvas-ignore]]>
                <a class="hideinpdf btn btn-light" data-bs-toggle="collapse" href="#hint" role="button" aria-expanded="false" aria-controls="hint">Hinweis zu den Maßen <i class="bi bi-arrow-right"></i></a>
            </p>
            <div class="collapse" id="hint">
                <p>Bitte beachte, dass die Maße von einander abhängen. Zum Beispiel ergibt die Höhe vom Armloch und die Höhe bis zum Armloch zusammen die Gesamtlänge. 
                Änderst du eines dieser Maße ändert sich automatisch ein anderes, da die Gesamtsumme stimmen muss. 
                Trotzdem musst du alle Maße überprüfen, da nicht alle Werte automatisch richtig berechnet werden können. </p> 
                <p><strong>Diese Maße werden automatisch eingetragen:</strong></p>
                <ul>
                    <li>Breite Armloch = (Oberweite - Rückenbreite)/2</li>
                    <li>Gesamtlänge = Höhe Anschlag bis Armloch + Höhe Armloch</li>
                    <li>Höhe Anschlag bis Armloch = Gesamtlänge - Höhe Armloch</li>
                    <li>Breite Schulter = ( Rückenbreite - Breite Halsausschnitt) / 2</li>
                    <li>Breite Halsausschnitt = Rückenbreite - Breite Schulter * 2</li>
                    <li>Ärmellänge = Innere Ärmellänge + Höhe Armkugel</li>
                    <li>Innere Ärmellänge = Ärmellänge - Höhe Armkugel</li>
                    <li>Bei einer Jacke: Breite Vorderteil = ( Weite am Anschlag +/- Breite Blende ) /2</li>
                    <li>Bei tailliertem Schnitt: Höhe Anschlag bis Armloch = Höhe Anschlag bis Hüfte + Höhe Hüfte bis Taille + Höhe Taille bis Armloch</li>
                    <li>Bei Raglan: Höhe Armkugel = Höhe Armloch - Breite Raglanärmel am Halsausschnitt / 2</li>
                    <li>Bei gerade eingesetztem Ärmel oder Ärmel mit Schräge: </li>
                    <ul>
                    <li>Oberarmumfang = Höhe Armloch / 2</li>
                    <li>Höhe Armkugel = Breite Armloch</li>
                    <li>Höhe Armloch = Oberarmumfang / 2</li>
                    </ul>
                </ul>
                <p><strong>Besonderheiten beim Raglan:</strong><br>
                Bei der Höhe vom Armloch und der Höhe vom vorderen Halsausschnitt wird bei der Berechnung die Breite vom Raglanärmel am Halsausschnitt
                automatisch berücksichtigt. </p>
            </div>
        </div>
        <div id="alert_div" class="alert custom-alert-3 alert-danger [[-alert-dismissible]] fade d-none" role="alert">
            <i class="bi bi-exclamation-triangle-fill fs-xxlarge"></i>
            <div class="alert-text"><h5>Da stimmt was nicht!</h5><span id="alert_err"></span></div>
            <button class="btn btn-close position-relative p-1 ms-auto" type="button" onclick="this.parentElement.classList.remove('show'); this.parentElement.classList.add('d-none');" [[-data-bs-dismiss="alert"]] aria-label="Close"></button>
        </div>
        <div id="sketch_div" [[-class="d-flex"]]>
        <fieldset class="flex-fill" > <!-- svg cut -->
            <div [[-class="hideinpdf"]][[-data-html2canvas-ignore]]>
                <p>Für Vorder- und Rückenteil</p>
            <svg id="cut_sketch" class="svg" version="1.1" [[-width="100%" height="100%"]] [[-viewBox="25 0 345 650"]] viewBox="0 0 370 650" xmlns="http://www.w3.org/2000/svg" [[-xmlns:xlink="http://www.w3.org/1999/xlink"]] >
                
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wBust" [[-xlink]]>
              <g id="wBust"  opacity="1" class="dim [[!+pjv.wBust_len:is=`0`:then=`blank`]]">
               <marker id="wBust-ms" overflow="visible" orient="auto">
                <path id="wBust-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wBust-me" overflow="visible" orient="auto">
                <path id="wBust-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wBust-p" d="m76.062 478.975h210.5" fill="none" marker-end="url(#wBust-me)" marker-start="url(#wBust-ms)"/>
               <text id="wBust-t" dy="-5" text-align="center" text-anchor="middle"><textPath id="wBust-tp" startOffset="50%" [[-xlink:]] href="#wBust-p"><tspan id="wBust-s" text-align="center" text-anchor="middle">[[!+pjv.wBust_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wBust_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wWaist" [[-xlink]]>
              <g id="wWaist" opacity="0" class="dim [[!+pjv.wWaist_len:is=`0`:then=`blank`]]">
               <marker id="wWaist-ms" overflow="visible" orient="auto">
                <path id="wWaist-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wWaist-me" overflow="visible" orient="auto">
                <path id="wWaist-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wWaist-p" d="m89.036 521.09h184.53" fill="none" marker-end="url(#wWaist-me)" marker-start="url(#wWaist-ms)"/>
               <text id="wWaist-t" dy="-5"><textPath id="wWaist-tp" startOffset="50%" [[-xlink:]] href="#wWaist-p"><tspan id="wWaist-s" text-align="center" text-anchor="middle" class="dim [[!+pjv.wWaist_len:is=`0`:then=`blank`]]">[[!+pjv.wWaist_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wWaist_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wHips" [[-xlink]]>
              <g id="wHips" opacity="0" class="dim [[!+pjv.wHips_len:is=`0`:then=`blank`]]">
               <marker id="wHips-ms" overflow="visible" orient="auto">
                <path id="wHips-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wHips-me" overflow="visible" orient="auto">
                <path id="wHips-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wHips-p" d="m68.872 563.21h224.85" fill="none" marker-end="url(#wHips-me)" marker-start="url(#wHips-ms)"/>
               <text id="wHips-t" dy="-5"><textPath id="wHips-tp" startOffset="50%" [[-xlink:]] href="#wHips-p"><tspan id="wHips-s" text-align="center" text-anchor="middle">[[!+pjv.wHips_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wHips_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wFrontband" [[-xlink]]>
              <g id="wFrontband" opacity="0" class="dim [[!+pjv.wFrontband_len:is=`0`:then=`blank`]]">
               <marker id="wFrontband-ms" overflow="visible" orient="auto">
                <path id="wFrontband-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wFrontband-me" overflow="visible" orient="auto">
                <path id="wFrontband-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wFrontband-p" d="m176.328 606.79h10.056" fill="none" marker-end="url(#wFrontband-me)" marker-start="url(#wFrontband-ms)"/>
               <path id="wFrontband-ph" d="m162.458 606.79h37.791" fill="none" stroke-width="0"/>
               <text id="wFrontband-t" dy="-5"><textPath id="wFrontband-tp" startOffset="50%" [[-xlink:]] href="#wFrontband-ph"><tspan id="wFrontband-s" transform="scale(5)" text-align="center" text-anchor="middle">[[!+pjv.wFrontband_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wFrontband_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wFront" [[-xlink]]>
              <g id="wFront" opacity="0" class="dim [[!+pjv.wFront_len:is=`0`:then=`blank`]]">
               <marker id="wFront-ms" overflow="visible" orient="auto">
                <path id="wFront-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wFront-me" overflow="visible" orient="auto">
                <path id="wFront-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wFront-p" d="m69.821 606.79h106.4" fill="none" marker-end="url(#wFront-me)" marker-start="url(#wFront-ms)"/>
               <text id="wFront-t" dy="-5"><textPath id="wFront-tp" startOffset="50%" [[-xlink:]] href="#wFront-p"><tspan id="wFront-s" text-align="center" text-anchor="middle">[[!+pjv.wFront_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wFront_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hCo2hips" [[-xlink]]>
              <g id="hCo2hips" opacity="0" class="dim [[!+pjv.hCo2hips_len:is=`0`:then=`blank`]]">
               <marker id="hCo2hips-ms" overflow="visible" orient="auto">
                <path id="hCo2hips-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hCo2hips-me" overflow="visible" orient="auto">
                <path id="hCo2hips-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hCo2hips-p" d="m45.344 436.84v-51.2" fill="none" marker-end="url(#hCo2hips-me)" marker-start="url(#hCo2hips-ms)"/>
               <text id="hCo2hips-t" dy="-5"><textPath id="hCo2hips-tp" startOffset="50%" [[-xlink:]] href="#hCo2hips-p"><tspan id="hCo2hips-s" text-align="center" text-anchor="middle">[[!+pjv.hCo2hips_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hCo2hips_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hHips2waist" [[-xlink]]>
              <g id="hHips2waist" opacity="0" class="dim [[!+pjv.hHips2waist_len:is=`0`:then=`blank`]]">
               <marker id="hHips2waist-ms" overflow="visible" orient="auto">
                <path id="hHips2waist-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hHips2waist-me" overflow="visible" orient="auto">
                <path id="hHips2waist-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hHips2waist-p" d="m45.344 385.43v-51.177" fill="none" marker-end="url(#hHips2waist-me)" marker-start="url(#hHips2waist-ms)"/>
               <text id="hHips2waist-t" dy="-5"><textPath id="hHips2waist-tp" startOffset="50%" [[-xlink:]] href="#hHips2waist-p"><tspan id="hHips2waist-s" text-align="center" text-anchor="middle">[[!+pjv.hHips2waist_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hHips2waist_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hWaist2armhole" [[-xlink]]>
              <g id="hWaist2armhole" opacity="0" class="dim [[!+pjv.hWaist2armhole_len:is=`0`:then=`blank`]]">
               <marker id="hWaist2armhole-ms" overflow="visible" orient="auto">
                <path id="hWaist2armhole-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hWaist2armhole-me" overflow="visible" orient="auto">
                <path id="hWaist2armhole-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hWaist2armhole-p" d="m45.344 333.95v-103.18" fill="none" marker-end="url(#hWaist2armhole-me)" marker-start="url(#hWaist2armhole-ms)"/>
               <text id="hWaist2armhole-t" dy="-5"><textPath id="hWaist2armhole-tp" startOffset="50%" [[-xlink:]] href="#hWaist2armhole-p"><tspan id="hWaist2armhole-s" text-align="center" text-anchor="middle">[[!+pjv.hWaist2armhole_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hWaist2armhole_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hCo2Armhole" [[-xlink]]>
              <g id="hCo2Armhole"  opacity="1" class="dim [[!+pjv.hCo2Armhole_len:is=`0`:then=`blank`]]">
               <marker id="hCo2Armhole-ms" overflow="visible" orient="auto">
                <path id="hCo2Armhole-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hCo2Armhole-me" overflow="visible" orient="auto">
                <path id="hCo2Armhole-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hCo2Armhole-p" d="m314.895 230.84v205.93" fill="none" marker-end="url(#hCo2Armhole-me)" marker-start="url(#hCo2Armhole-ms)"/>
               <text id="hCo2Armhole-t" dy="-5"><textPath id="hCo2Armhole-tp" startOffset="50%" [[-xlink:]] href="#hCo2Armhole-p"><tspan id="hCo2Armhole-s" text-align="center" text-anchor="middle">[[!+pjv.hCo2Armhole_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hCo2Armhole_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hProject" [[-xlink]]>
              <g id="hProject"  opacity="1" class="dim [[!+pjv.hProject_len:is=`0`:then=`blank`]]">
               <marker id="hProject-ms" overflow="visible" orient="auto">
                <path id="hProject-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hProject-me" overflow="visible" orient="auto">
                <path id="hProject-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hProject-p" d="m346.759 120.533v316.29" fill="none" marker-end="url(#hProject-me)" marker-start="url(#hProject-ms)"/>
               <text id="hProject-t" dy="-5"><textPath id="hProject-tp" startOffset="50%" [[-xlink:]] href="#hProject-p"><tspan id="hProject-s" text-align="center" text-anchor="middle">[[!+pjv.hProject_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hProject_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hNeckFront" [[-xlink]]>
              <g id="hNeckFront"  opacity="1" class="dim [[!+pjv.hNeckFront_len:is=`0`:then=`blank`]]">
               <marker id="hNeckFront-ms" overflow="visible" orient="auto">
                <path id="hNeckFront-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hNeckFront-me" overflow="visible" orient="auto">
                <path id="hNeckFront-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hNeckFront-p" d="m301.938 121.156v36.823" fill="none" marker-end="url(#hNeckFront-me)" marker-start="url(#hNeckFront-ms)"/>
               <path id="hNeckFront-ph" d="m301.938 101.156v76.823" fill="none" stroke-width="0"/>
               <text id="hNeckFront-t" dy="-5"><textPath id="hNeckFront-tp" startOffset="50%" [[-xlink:]] href="#hNeckFront-ph"><tspan id="hNeckFront-s" text-align="center" text-anchor="middle">[[!+pjv.hNeckFront_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hNeckFront_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hArmhole" [[-xlink]]>
              <g id="hArmhole"  opacity="1" class="dim [[!+pjv.hArmhole_len:is=`0`:then=`blank`]]">
               <marker id="hArmhole-ms" overflow="visible" orient="auto">
                <path id="hArmhole-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hArmhole-me" overflow="visible" orient="auto">
                <path id="hArmhole-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hArmhole-p" d="m45.344 231.31v-110.11" fill="none" marker-end="url(#hArmhole-me)" marker-start="url(#hArmhole-ms)"/>
               <text id="hArmhole-t" dy="-5"><textPath id="hArmhole-tp" startOffset="50%" [[-xlink:]] href="#hArmhole-p"><tspan id="hArmhole-s" text-align="center" text-anchor="middle">[[!+pjv.hArmhole_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hArmhole_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hNeckBack" [[-xlink]]>
              <g id="hNeckBack"  opacity="1" class="dim [[!+pjv.hNeckBack_len:is=`0`:then=`blank`]]">
               <marker id="hNeckBack-ms" overflow="visible" orient="auto">
                <path id="hNeckBack-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hNeckBack-me" overflow="visible" orient="auto">
                <path id="hNeckBack-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hNeckBack-p" d="m98.449 133.044v-11.85" fill="none" marker-end="url(#hNeckBack-me)" marker-start="url(#hNeckBack-ms)"/>
               <path id="hNeckBack-ph" d="m97.156 163.044v-71.85" fill="none" stroke-width="0"/>
               <text id="hNeckBack-t" dy="-5"><textPath id="hNeckBack-tp" startOffset="50%" [[-xlink:]] href="#hNeckBack-ph"><tspan id="hNeckBack-s" text-align="center" text-anchor="middle">[[!+pjv.hNeckBack_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hNeckBack_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="hShoulder" [[-xlink]]>
              <g id="hShoulder"  opacity="1" class="dim [[!+pjv.hShoulder_len:is=`0`:then=`blank`]]">
               <marker id="hShoulder-ms" overflow="visible" orient="auto">
                <path id="hShoulder-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="hShoulder-me" overflow="visible" orient="auto">
                <path id="hShoulder-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="hShoulder-p" d="m72.703 133.044v-11.85" fill="none" marker-end="url(#hShoulder-me)" marker-start="url(#hShoulder-ms)"/>
               <path id="hShoulder-ph" d="m72.703 163.044v-71.85" fill="none" stroke-width="0"/>
               <text id="hShoulder-t" dy="-5"><textPath id="hShoulder-tp" startOffset="50%" [[-xlink:]] href="#hShoulder-ph"><tspan id="hShoulder-s" text-align="center" text-anchor="middle">[[!+pjv.hShoulder_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hShoulder_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
        <!-- <a data-bs-target="#dim_wBust-modal" data-bs-toggle="modal" role="button" data-bs-dim="" [[-xlink]]> -->     
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wNeck" [[-xlink]]>
              <g id="wNeck"  opacity="1" class="dim [[!+pjv.wNeck_len:is=`0`:then=`blank`]]">
               <marker id="wNeck-ms" overflow="visible" orient="auto">
                <path id="wNeck-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wNeck-me" overflow="visible" orient="auto">
                <path id="wNeck-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wNeck-p" d="m146.128 85.041h70.882" fill="none" marker-end="url(#wNeck-me)" marker-start="url(#wNeck-ms)"/>
               <text id="wNeck-t" dy="-5"><textPath id="wNeck-tp" startOffset="50%" [[-xlink:]] href="#wNeck-p"><tspan id="wNeck-s" text-align="center" text-anchor="middle">[[!+pjv.wNeck_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wNeck_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
        <!-- <a data-bs-target="#dim_wShoulder-modal" data-bs-toggle="modal" role="button" data-bs-dim="" [[-xlink]]><button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal" data-bs-whatever="@mdo">Open modal for @mdo</button> 
        <a data-bs-target="#dim_wWaist-modal" data-bs-toggle="modal" role="button" data-bs-dim="" [[-xlink]]> -->
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" data-bs-target="modal" role="button" data-bs-dim="wShoulder" [[-xlink]]>
              <g id="wShoulder" opacity="1" class="dim [[!+pjv.wShoulder_len:is=`0`:then=`blank`]]">
               <marker id="wShoulder-ms" overflow="visible" orient="auto">
                <path id="wShoulder-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wShoulder-me" overflow="visible" orient="auto">
                <path id="wShoulder-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wShoulder-p" d="m105.033 85.041h40.937" fill="none" marker-end="url(#wShoulder-me)" marker-start="url(#wShoulder-ms)"/>
               <path id="wShoulder-ph" d="m95.033 85.041h60.937" fill="none" stroke-width="0"/>
               <text id="wShoulder-t" dy="-5" ><textPath id="wShoulder-tp" startOffset="50%" [[-xlink:]] href="#wShoulder-ph"><tspan id="wShoulder-s" transform="scale(5)" text-align="center" text-anchor="middle" >[[!+pjv.wShoulder_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wShoulder_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wCrossback" [[-xlink]]>
              <g id="wCrossback"  opacity="1" class="dim [[!+pjv.wCrossback_len:is=`0`:then=`blank`]]">
               <marker id="wCrossback-ms" overflow="visible" orient="auto">
                <path id="wCrossback-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wCrossback-me" overflow="visible" orient="auto">
                <path id="wCrossback-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wCrossback-p" d="m105.198 42.925h152.12" fill="none" marker-end="url(#wCrossback-me)" marker-start="url(#wCrossback-ms)"/>
               <text id="wCrossback-t" dy="-5"><textPath id="wCrossback-tp" startOffset="50%" [[-xlink:]] href="#wCrossback-p"><tspan id="wCrossback-s" text-align="center" text-anchor="middle" class="dim [[!+pjv.wCrossback_len:is=`0`:then=`blank`]]">[[!+pjv.wCrossback_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wCrossback_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" role="button" data-bs-dim="wArmhole" [[-xlink]]>
              <g id="wArmhole"  opacity="1" class="dim [[!+pjv.wArmhole_len:is=`0`:then=`blank`]]">
               <marker id="wArmhole-ms" overflow="visible" orient="auto">
                <path id="wArmhole-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <marker id="wArmhole-me" overflow="visible" orient="auto">
                <path id="wArmhole-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none"/>
               </marker>
               <path id="wArmhole-p" d="m75.619 42.925h29.173" fill="none" marker-end="url(#wArmhole-me)" marker-start="url(#wArmhole-ms)"/>
               <path id="wArmhole-ph" d="m55.619 42.925h69.173" fill="none" stroke-width="0"/>
               <text id="wArmhole-t" dy="-5"><textPath id="wArmhole-tp" startOffset="50%" [[-xlink:]] href="#wArmhole-ph"><tspan id="wArmhole-s" transform="scale(5)" text-align="center" text-anchor="middle">[[!+pjv.wArmhole_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wArmhole_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
        
            <g id="cut_sketch_path">
             <path opacity="0" id="FrontDivided" d="m187.77 156.09v280.41h-10.275v-280.44" fill="none" stroke="#000"/>
             <path opacity="0" id="shoulderEvenWide" d="m218.2 119.24h69.83v11.597m-210.8-0.21137v-11.385h69.544" fill="none" stroke="#000"/>
             <path opacity="0" id="shoulderSlopeWide" d="m218.2 119.19 69.217 11.597m-209.66-0.21137 69.022-11.385" fill="none" stroke="#000"/>
             <path opacity="0" id="shoulderSlopeSlim" d="m218.3 119.33 40.475 11.597m-152.36 0 40.472-11.597" fill="none" stroke="#000"/>
             <path opacity="0" id="shoulderEvenSlim" d="m218.3 119.44h40.475v11.597m-152.36 0v-11.597h40.472" fill="none" stroke="#000"/>
             <path opacity="0" id="cutWaistshape" d="m288.1 228.71-13.218 103.38c-2.3401 18.304 20.024 50.643 20.055 69.099l0.0573 34.1-111.99-0.47907h-0.74991l-111.99 0.47907 0.0573-34.1c0.031-18.453 22.395-50.794 20.055-69.099l-13.217-103.38" fill="none" stroke="#000"/>
             <path opacity="0" id="cutEven" d="m288.03 229.01 0.0968 207.33h-210.81l-0.16015-207.33" fill="none" stroke="#000"/>
             <path opacity="0" id="cutAline" d="m288.03035 229.015 6.92085 155.725 0.0574 51.599h-224.73l0.0573-51.599 6.821322-155.725" fill="none" stroke="#000"/>
             <path opacity="0" id="cutSingleshape" d="m288.1 229.3-13.218 206.04h-184.5l-13.218-206.04" fill="none" stroke="#000"/>
             <path opacity="0" id="neckRound" d="m146.89 119.33c7e-3 18.555 15.719 36.858 35.708 37.038 19.987-0.17797 35.706-18.482 35.706-37.038" fill="none" stroke="#000"/>
             <path opacity="1" id="neckRoundBack" d="m218.3 119.33c-6.8302 11.968-14.588 12.13-35.708 12.13-21.119 0-28.877-0.16224-35.706-12.13" fill="none" stroke="#000"/>
             <path opacity="0" id="neckEven" d="m218.3 119.33h-71.414" fill="none" stroke="#000"/>
             <path opacity="0" id="neckSquare" d="m218.3 119.33v36.651h-71.414v-36.651" fill="none" stroke="#000"/>
             <path opacity="0" id="neckV" d="m218.3 119.33c-3.7562 17.889-34.435 40.059-35.708 40.059s-31.016-22.194-35.708-40.023" fill="none" stroke="#000"/>
             <path opacity="0" id="armSlope" d="m258.88 130.02v81.275l29.097 17.719m-210.82 0 29.366-17.719v-81.275" fill="none" stroke="#000"/>
             <path opacity="0" id="armRaglan" d="m153.98 144.89-68.29 84.216-8.5432-0.0937m211.13 0-8.5444 0.0937-68.249-84.263" fill="none" stroke="#000"/>
             <path opacity="0" id="armEvenSi" d="m258.79 130v98.848l29.227 0.16064m-210.88 0 29.286-0.16064v-98.848" fill="none" stroke="#000"/>
             <path opacity="0" id="armEven" d="m288.03 130.43v98.576m-210.9 0.43v-98.576" fill="none" stroke="#000"/>
             
             
             <path opacity="0" id="armCap" d="m258.76 130.93c-0.71424 48.486-0.47014 98.399 29.288 98.511m-210.93 0c29.758-0.10853 30.002-50.024 29.288-98.511" fill="none" stroke="#000"/>
             <path opacity="0" id="armYoke" d="m146.85 119.64s-28.44 4.6547-40.475 12.381c-24.274 15.583-59.042 65.344-59.042 65.344s18.083 28.636 44.544 44.452c26.461 15.815 58.329 22.906 90.717 22.906 32.39 0 64.257-7.0918 90.717-22.906 26.461-15.814 44.544-44.452 44.544-44.452s-34.855-49.71-59.12-65.344c-11.875-7.6492-39.931-12.381-39.931-12.381" fill="none" stroke="#000"/>
            </g>
            </svg>            
            </div>
        </fieldset><!-- svg cut --> 
    <!-- <path opacity="1" id="armTest" d="m6 10 3 3 6-6" fill="none" stroke="#000"/> -->
        <fieldset class="flex-fill" id="sleeve_sketch_flds" > <!-- svg sleeve -->
            
            <div  [[-data-html2canvas-ignore]]>
            <p>Für den Ärmel</p>
            <svg id="sleeve_sketch" class="svg" version="1.1"   viewBox="0 0 280 400" xmlns="http://www.w3.org/2000/svg" [[-xmlns:xlink="http://www.w3.org/1999/xlink"]]>
                
             <a  data-bs-target="#dim-modal" data-bs-toggle="modal" data-bs-target="modal" role="button" data-bs-dim="hCap" [[-xlink]]>
              <g id="hCap" opacity="0" class="dim [[!+pjv.hCap_len:is=`0`:then=`blank`]]">
               <marker id="hCap-ms" overflow="visible" orient="auto">
                <path id="hCap-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <marker id="hCap-me" overflow="visible" orient="auto">
                <path id="hCap-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <path id="hCap-p" d="m26.906 162.2v-79.828" fill="none" marker-end="url(#hCap-me)" marker-start="url(#hCap-ms)" stroke="#f0c"/>
               <text id="hCap-t" dy="-5" fill="#ff00cc"><textPath id="hCap-tp" startOffset="50%" [[-xlink:]] href="#hCap-p"><tspan id="hCap-s" text-align="center" text-anchor="middle">[[!+pjv.hCap_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hCap_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a data-bs-target="#dim-modal" data-bs-toggle="modal" data-bs-target="modal" role="button" data-bs-dim="hSleeve" [[-xlink]]>
              <g id="hSleeve" opacity="0" class="dim [[!+pjv.hSleeve_len:is=`0`:then=`blank`]]">
               <marker id="hSleeve-ms" overflow="visible" orient="auto">
                <path id="hSleeve-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <marker id="hSleeve-me" overflow="visible" orient="auto">
                <path id="hSleeve-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <path id="hSleeve-p" d="m257.07 364.27v-280.44" fill="none" marker-end="url(#hSleeve-me)" marker-start="url(#hSleeve-ms)" stroke="#f0c"/>
               <text id="hSleeve-t" dy="-5" fill="#ff00cc"><textPath id="hSleeve-tp" startOffset="50%" [[-xlink:]] href="#hSleeve-p"><tspan id="hSleeve-s" text-align="center" text-anchor="middle">[[!+pjv.hSleeve_len:is=`0`:then=`&#x270E;`:else=`[[!+pjv.hSleeve_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a  data-bs-target="#dim-modal" data-bs-toggle="modal" data-bs-target="modal" role="button" data-bs-dim="hSleeve2Underarm" [[-xlink]]>
              <g id="hSleeve2Underarm" opacity="0" class="dim [[!+pjv.hSleeve2Underarm_len:is=`0`:then=`blank`]]">
               <marker id="hSleeve2Underarm-ms" overflow="visible" orient="auto">
                <path id="hSleeve2Underarm-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <marker id="hSleeve2Underarm-me" overflow="visible" orient="auto">
                <path id="hSleeve2Underarm-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <path id="hSleeve2Underarm-p" d="m26.906 364.27v-202.23" fill="none" marker-end="url(#hSleeve2Underarm-me)" marker-start="url(#hSleeve2Underarm-ms)" stroke="#f0c"/>
               <text id="hSleeve2Underarm-t" dy="-5" fill="#ff00cc"><textPath id="hSleeve2Underarm-tp" startOffset="50%" [[-xlink:]]href="#hSleeve2Underarm-p"><tspan id="hSleeve2Underarm-s" text-align="center" text-anchor="middle">[[!+pjv.hSleeve2Underarm_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.hSleeve2Underarm_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a  data-bs-target="#dim-modal" data-bs-toggle="modal" data-bs-target="modal" role="button" data-bs-dim="wNeckRaglan" [[-xlink]]>
              <g id="wNeckRaglan" opacity="0" class="dim [[!+pjv.wNeckRaglan_len:is=`0`:then=`blank`]]">
               <marker id="wNeckRaglan-ms" overflow="visible" orient="auto">
                <path id="wNeckRaglan-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <marker id="wNeckRaglan-me" overflow="visible" orient="auto">
                <path id="wNeckRaglan-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <path id="wNeckRaglan-p" d="m114.86 26.906h46.098" fill="none" marker-end="url(#wNeckRaglan-me)" marker-start="url(#wNeckRaglan-ms)" stroke="#f0c"/>
               <text id="wNeckRaglan-t" dy="-5" fill="#ff00cc"><textPath id="wNeckRaglan-tp" startOffset="50%" [[-xlink:]] href="#wNeckRaglan-p"><tspan id="wNeckRaglan-s" text-align="center" text-anchor="middle">[[!+pjv.wNeckRaglan_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wNeckRaglan_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a  data-bs-target="#dim-modal" data-bs-toggle="modal" data-bs-target="modal" role="button" data-bs-dim="wUpperarm" [[-xlink]]>
              <g id="wUpperarm" opacity="0" class="dim [[!+pjv.wUpperarm_len:is=`0`:then=`blank`]]">
               <marker id="wUpperarm-ms" overflow="visible" orient="auto">
                <path id="wUpperarm-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <marker id="wUpperarm-me" overflow="visible" orient="auto">
                <path id="wUpperarm-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <path id="wUpperarm-p" d="m44.186 56.866h187.7" fill="none" marker-end="url(#wUpperarm-me)" marker-start="url(#wUpperarm-ms)" stroke="#f0c"/>
               <text id="wUpperarm-t" dy="-5" fill="#ff00cc"><textPath id="wUpperarm-tp" startOffset="50%" [[-xlink:]] href="#wUpperarm-p"><tspan id="wUpperarm-s" text-align="center" text-anchor="middle">[[!+pjv.wUpperarm_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wUpperarm_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             <a  data-bs-target="#dim-modal" data-bs-toggle="modal" data-bs-target="modal" role="button" data-bs-dim="wWrist" [[-xlink]]>
              <g id="wWrist" opacity="0" class="dim [[!+pjv.wWrist_len:is=`0`:then=`blank`]]">
               <marker id="wWrist-ms" overflow="visible" orient="auto">
                <path id="wWrist-msp" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <marker id="wWrist-me" overflow="visible" orient="auto">
                <path id="wWrist-mep" transform="scale(.8)" d="m0 5.65v-11.3" fill="none" stroke="#f0c"/>
               </marker>
               <path id="wWrist-p" d="m73.816 385.62h128.44" fill="none" marker-end="url(#wWrist-me)" marker-start="url(#wWrist-ms)" stroke="#f0c"/>
               <text id="wWrist-t" dy="-5" fill="#ff00cc"><textPath id="wWrist-tp" startOffset="50%" [[-xlink:]] href="#wWrist-p"><tspan id="wWrist-s" text-align="center" text-anchor="middle">[[!+pjv.wWrist_len:is=`0`:then=`&#x270E;`:else=`[[+pjv.wWrist_len]] cm`]]</tspan></textPath></text>
              </g>
             </a>
             
             <g id="arm_sketch_path">
             <path opacity="1" id="Sleeve" d="m44.256 163.53 29.921 200.74h127.74l29.921-200.74" fill="none" stroke="#000"/>
             <path opacity="0" id="sleeveCap" d="m231.84 163.53c-33.271 0-31.543-79.752-95.205-79.509-63.661 0.23759-49.449 79.509-92.37 79.509" fill="none" stroke="#000"/>
             <path opacity="0" id="sleeveEvenSi" d="m231.9 163.87-0.27907-31.895h-187.38l-0.0392 31.895" fill="none" stroke="#000"/>
             <path opacity="0" id="sleeveSlope" d="m231.9 163.67-22.411-31.895h-143.12l-22.171 31.895" fill="none" stroke="#000"/>
             <path opacity="0" id="sleeveRaglan" d="m231.87,163.55-7.7094-0.18764-63.106-93.392 h-45.948 l-63.182,93.3932-7.7094,0.18765" fill="none" stroke="#000"/>
<!--             m231.87 163.55-7.7094-0.18764-63.106-93.392c-5.7054 7.6144-15.599 13.43-23.241 13.346-8.9619-0.0987-11.993 0.12712-22.707-3.1058l-63.182 83.153-7.7094 0.18765
                                                    m231.87,163.55-7.7094-0.18764-63.106-93.392 h-45.948 l-63.182,93.3932-7.7094,0.18765   --> 
             <path opacity="0" id="sleeveEven" d="m231.9 163.52h-187.7" fill="none" stroke="#000"/>
             <path opacity="0" id="sleeveYoke" d="m231.9 163.52h-187.7" fill="none" stroke-dasharray="4" stroke="#000"/>
            </g>
            </svg>        

            </div>
        </fieldset><!-- svg sleeve -->
        <p class="hideinpdf">[[-Hier muss noch ein button rein, der alle eingegebenen Maße löscht. ]]
        <button id="clrBtn" type="reset" class="btn btn-secondary  mb-2" title="[[!%justknit.btn_reset_tip? &namespace=`justknit` &topic=`project`]]" >[[%justknit.btn_reset? &namespace=`justknit` &topic=`project`]]</button>
        <button id="reloadBtn" type="button" class="btn btn-info  mb-2" title="[[!%justknit.btn_reload_tip? &namespace=`justknit` &topic=`project`]]" >[[%justknit.btn_reload? &namespace=`justknit` &topic=`project`]]</button>
        </p>
        
        </div>
        <div id="sketch_err" class="alert custom-alert-3 alert-info fade" role="alert" data-html2canvas-ignore>
            <i class="bi bi-info-circle fs-xxlarge"></i>
            <div class="alert-text"><h5>Du musst eine Auswahl für die Form treffen!</h5><span id="gaugeError">Wenn du für die Form vom Schnitt, Armausschnitt, Halsausschnitt oder Schulter keine Angaben machst, kann keine Anleitung erstellt werden. </span></div>
            <button class="btn btn-close position-relative p-1 ms-auto" type="button" onclick="this.parentElement.classList.remove('show'); this.parentElement.classList.add('d-none');" aria-label="Close"></button>
        </div>
        <div class="d-flex gap-2">
            <button id="prev_shape" class="btn btn-light ms-auto target-shape" type="button" data-bs-toggle="collapse" data-bs-target="#shape" aria-expanded="true" aria-controls="shape"><i class="bi bi-arrow-left"></i> [[!%pj.goto_prev]]</button>
            <button id="next_gauge" class="btn btn-light target-gauge" type="button" data-bs-toggle="collapse" data-bs-target="#gauge" aria-expanded="false" aria-controls="gauge">[[!%pj.goto_next]] <i class="bi bi-arrow-right"></i></button>
        </div>
    </div>   
    <div id="gauge" class="[[-hideinpdf]] nobreak accordion-collapse collapse accordion-item" data-bs-parent="#design">
        <fieldset><!-- gauge fields -->
            <legend>3. Deine Maschenprobe</legend> 
            <div class="row">
                <div class="col">[[-+pj.len_w]]
                    <div class="mb-3 position-relative show">
                        <div class="d-flex">
                            <label class="form-label" for="len_w" title="[[!%pj.len_w_label_title]]">[[!%pj.len_w_label_text]]</label>
                            <a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto pop" data-bs-toggle="popover" data-placement="top" title="[[!%pj.len_w_pop_title]]" 
                            data-bs-content="[[!%pj.len_w_pop_content]]"><i class="bi bi-question-circle"></i></a>
                        </div>
                        <input type="number"  inputmode="decimal" step=".1" class="form-control inVal shown"  title="[[!%pj.len_w_label_title]]" id="len_w" name="len_w" sov="[[+pjv.len_w]]" value="[[+pjv.len_w]]">
                        <div id="Dlen_w" class="invalid-tooltip">[[!%pj.len_w_invalid]]</div>
                    </div>                
                </div>
                <div class="col">[[-+pj.qty_w]]
                    <div class="mb-3 position-relative show">
                        <div class="d-flex">
                            <label class="form-label" for="qty_w" title="[[!%pj.qty_w_label_title]]">[[!%pj.qty_w_label_text]]</label>
                            <a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto pop" data-bs-toggle="popover" data-placement="top" title="[[!%pj.qty_w_pop_title]]" 
                            data-bs-content="[[!%pj.qty_w_pop_content]]"><i class="bi bi-question-circle"></i></a>
                        </div>
                        <input type="number"  inputmode="decimal" step=".1" class="form-control inVal shown"  title="[[!%pj.qty_w_label_title]]" id="qty_w" name="qty_w" sov="[[+pjv.qty_w]]" value="[[+pjv.qty_w]]">
                        <div id="Dqty_w" class="invalid-tooltip">[[!%pj.qty_w_invalid]]</div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col">[[-+pj.len_h]]
                    <div class="mb-3 position-relative show">
                        <div class="d-flex">
                            <label class="form-label" for="len_h" title="[[!%pj.len_h_label_title]]">[[!%pj.len_h_label_text]]</label>
                            <a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto pop" data-bs-toggle="popover" data-placement="top" title="[[!%pj.len_h_pop_title]]" 
                            data-bs-content="[[!%pj.len_h_pop_content]]"><i class="bi bi-question-circle"></i></a>
                        </div>
                        <input type="number"  inputmode="decimal" step=".1" class="form-control inVal shown"  title="[[!%pj.len_h_label_title]]" id="len_h" name="len_h" sov="[[+pjv.len_h]]" value="[[+pjv.len_h]]">
                        <div id="Dlen_h" class="invalid-tooltip">[[!%pj.len_h_invalid]]</div>
                    </div>
                </div>
                <div class="col">[[-+pj.qty_h]]
                    <div class="mb-3 position-relative show">
                        <div class="d-flex">
                            <label class="form-label" for="qty_h" title="[[!%pj.qty_h_label_title]]">[[!%pj.qty_h_label_text]]</label>
                            <a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto pop" data-bs-toggle="popover" data-placement="top" title="[[!%pj.qty_h_pop_title]]" 
                            data-bs-content="[[!%pj.qty_h_pop_content]]"><i class="bi bi-question-circle"></i></a>
                        </div>
                        <input type="number"  inputmode="decimal" step=".1" class="form-control inVal shown"  title="[[!%pj.qty_h_label_title]]" id="qty_h" name="qty_h" sov="[[+pjv.qty_h]]" value="[[+pjv.qty_h]]">
                        <div id="Dqty_h" class="invalid-tooltip">[[!%pj.qty_h_invalid]]</div>
                    </div>
                </div>
            </div>
        </fieldset><!-- gauge fields -->

    [[-
        <button id="pjBtnBack02" type="button" class="btn btn-info  mb-2"  data-bs-toggle="collapse" data-bs-target="#sketch" aria-expanded="false" aria-controls="sketch">[[!%pj.button_back02]]</button>
        <button id="pjBtnNext02" type="button" class="btn btn-info  mb-2" data-bs-toggle="collapse" data-bs-target="#pattern" aria-expanded="false" aria-controls="pattern">[[!%pj.button_next02]]</button>
    ]] 
 
        <div class="d-flex gap-2">
            <button id="prev_sketch" class="btn btn-light ms-auto target-sketch" type="button" data-bs-toggle="collapse" data-bs-target="#sketch" aria-expanded="false" aria-controls="sketch"><i class="bi bi-arrow-left"></i> [[!%pj.goto_prev]]</button>
            <button id="next_pattern" class="btn btn-light target-pattern" type="button" data-bs-toggle="collapse" data-bs-target="#pattern" aria-expanded="false" aria-controls="pattern">[[!%pj.goto_next]] <i class="bi bi-arrow-right"></i></button>
        </div>    
    </div>   
    <div id="pattern" class="[[-hideinpdf]] accordion-collapse collapse accordion-item" data-bs-parent="#design">
        <div id="pattern_div" hidden>
            <legend>4. Die Anleitung</legend>
[[-            <div class="d-flex"><!-- title and description -->
                <div class="flex-grow-1">
                    <p class="fw-bold" id="title_target">[[+pjv.title]]</p>
                    <p id="description_target">[[+pjv.description]]</p>
                </div>
                <div class="">
                    <a class="my-auto ms-1 btn btn-light btn-edit ms-auto" tabindex="0" role="button"  data-bs-target="#editPjModal" data-bs-toggle="modal" data-bs-target="modal" title="[[!%pj.description_pop_title]]" ><i class="bi bi-pencil"></i></a>
                </div>
            </div><!-- END title an description -->
]]            
            <button id="submitBtn" data-bs-toggle="collapse" href="#calculate" role="button" aria-expanded="[[!+pjv.pattern_meta:is=``:then=`false`:else=`true`]]" aria-controls="calculate" type="button" class="hideinpdf btn btn-info mb-2 d-none" [[-onclick="writePattern()"]]>[[-%justknit.btn_calc? &namespace=`justknit` &topic=`calc`]][[!%pj.project_calcBtn]]</button>
            <div class="collapse [[!+pjv.pattern_meta:is=``:then=``:else=`show`]]" id="calculate">
                <div id="result_err" hidden></div>
                
                <div id="pattern_text" [[-hidden]]>
                    <div id="pattern_body">
                        <h3>Rückenteil</h3>
                            <h4>1. Anschlag</h4>
                            	<p id="castonBack" class="resultP nobreak" >[[+pjv.castonBack]]</p>
                            <h4>2. Armloch</h4>
                                <p id="armhole" class="resultP nobreak" >[[+pjv.armhole]]</p>
                        <div id="neckBackShow" class="pattern_notRaglan">
                            <h4>3. Halsausschnitt hinten</h4>
                                <p id="neckBack" class="resultP nobreak" >[[+pjv.neckBack]]</p>
                        </div>
                        <div id="shoulderShow" class="pattern_notRaglan">
                            <h4>4. Schulter</h4>
                                <p id="shoulderLine" class="resultP nobreak" >[[+pjv.shoulderLine]]</p>
                        </div>
                        <h3>Vorderteil</h3>
                            <h4>1. Anschlag</h4>
                                <p id="castonFront" class="resultP nobreak" >[[+pjv.castonFront]]</p>
                        <div id="neckFrontShow" class="pattern_notRaglan">
                            <h4 id="neck_not_raglan">2. Halsausschnitt vorne</h4>
                                <p id="neckFront" class="resultP nobreak" >[[+pjv.neckFront]]</p>
                        </div>
                    </div>
                    <div id="pattern_sleeve">
                        <h3>Ärmel</h3>
                            <h4>1. Anschlag</h4>
                                <p id="castonSleeve" class="resultP nobreak" >[[+pjv.castonSleeve]]</p>
                            <h4>2. Ärmelschräge</h4>
                                <p id="biasSleeve" class="resultP nobreak" >[[+pjv.biasSleeve]]</p>
                        <div id="capSleeveShow" class="pattern_notRaglan">
                            <h4>3. Armkugel</h4>
                                <p id="capSleeve" class="resultP nobreak" >[[+pjv.capSleeve]]</p>
                        </div>
                    </div>
                    <div class="pattern_raglan" id="raglanRoundShow">
                        <h3>Passe</h3>
                            <h4>1. Abnahmen</h4>
                                <p id="raglanYoke" class="resultP nobreak" >[[+pjv.raglanYoke]]</p>
                            <h4 id="neck_raglan">2. Halsausschnitt vorne</h4>
                                <p id="neckFront" class="resultP nobreak" >[[+pjv.neckFront]]</p>
                            <h4>3. Tabelle mit deinen Abnahmen</h4>
                                <table class="table">  <thead>  <tr> <th>Reihe</th>    <th>Abnahmen</th>    <th>Maschen</th>  </tr></thead>  <tbody> [[+pjv.tblRaglanRound]]</tbody></table>
                    </div>
                </div>
            </div>
            <div class="d-flex gap-2">
                <button id="prev_gauge" class="btn btn-light ms-auto target-gauge" type="button" data-bs-toggle="collapse" data-bs-target="#gauge" aria-expanded="false" aria-controls="gauge"><i class="bi bi-arrow-left"></i> [[!%pj.goto_prev]]</button>
            </div>    
        </div>
        <div id="pattern_err" class="alert custom-alert-3 alert-info fade" role="alert" data-html2canvas-ignore>
            <i class="bi bi-info-circle fs-xxlarge"></i>
            <div class="">
            <div id="pattern_err_shape" class="alert-text mb-2"><h5><i class="bi bi-1-circle-fill [[-fs-xxlarge]]"></i>Du musst eine Auswahl für die Form treffen!</h5><span id="gaugeError">Wenn du für die Form vom Schnitt, 
            Armausschnitt, Halsausschnitt oder Schulter keine Angaben machst, kann keine Anleitung erstellt werden. </span></div>
            <div id="pattern_err_sketch" class="alert-text mb-2"><h5><i class="bi bi-2-circle-fill [[-fs-xxlarge]]"></i>Du musst alle erforderlichen Maße angeben!</h5><span id="gaugeError">Wenn du für die Maße keine Angaben 
            machst, kann keine Anleitung erstellt werden. </span></div>
            <div id="pattern_err_gauge" class="alert-text" ><h5><i class="bi bi-3-circle-fill [[-fs-xxlarge]]"></i>Du musst eine Maschenprobe angeben!</h5><span id="gaugeError">Wenn du für die Maschenprobe keine Werte angibst, 
            kann deine Anleitung nicht berechnet werden.  </span></div>
            </div>
            <div id="pattern_err_dim" class="alert-text" ><h5><i class="bi bi-2-circle-fill [[-fs-xxlarge]]"></i>Mit deinen Maßen stimmt etwas nicht!</h5><span id="gaugeError">Beachte die Hinweise bei den Maßen. Wenn deine Maße Fehler haben, 
            kann deine Anleitung nicht korrekt berechnet werden.  </span></div>
            <button class="btn btn-close position-relative p-1 ms-auto" type="button" onclick="this.parentElement.classList.remove('show'); this.parentElement.classList.add('d-none');" aria-label="Close"></button>
        </div>
        </div>
    
    </div>
</div> 
<!--
// bei dem gets gar net
<a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto" data-bs-html="true" 
data-bs-toggle="popovermodal" title="titel02[[-!%jk.pjedit_pj_title_pop_title]]" 
data-bs-content="content02[[-!%jk.pjedit_pj_title_pop_content]]"><i class="bi bi-question-circle"></i></a>


// bei dem gehts halb: nur der Titel wird angezeigt
<a tabindex="0" id="dimLink" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto" 
data-bs-toggle="popovermodal" data-placement="top" title="[[-!%pj.dim_xxx_pop_title]]" 
data-bs-content="[[-!%pj.dim_xxx_pop_content]]"><i class="bi bi-question-circle"></i></a>

// bei dem gehts in der Hilfe mit glossary
<a tabindex="0" role="button"  data-bs-trigger="focus" class="jk-glossary" data-bs-html="true" data-bs-toggle="popovermodal"  title="[[+term]]"
        data-bs-content="[[+explanation]]">[[+term]]<i class="bi bi-question"></i></a>
        

<a tabindex="0" role="button"  data-bs-trigger="focus" data-bs-html="true" data-bs-toggle="popovermodal"  title="[[+term]]"
        data-bs-content="[[+explanation]]">[[+term]]<i class="bi bi-question"></i></a>        
        

-->
    <fieldset> <!-- modal fields -->
        <div class="modal fade" id="dim-modal" tabindex="-1" aria-labelledby="dimModalLabel" aria-hidden="true"><!-- dim-modal -->
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="dimModalLabel"></h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="mb-3 position-relative show">
                            <div class="d-flex">
                                <label class="form-label" for="len_w" id="dimLabel" title="[[!%pj.dim_xxx_label_title]]">[[!%pj.dim_xxx_label_text]]</label>
                                <a tabindex="0" id="dimLink" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto" data-bs-toggle="popovermodal" data-placement="top" title="Title: [[-!%pj.dim_xxx_pop_title]]" 
                                data-bs-content=" Content: [[-!%pj.dim_xxx_pop_content]]" data-bs-title="titel01: " [[-data-bs-original-title="titel02: [[-!%pj.dim_xxx_pop_content]]"]]><i class="bi bi-question-circle"></i></a>
                            </div>
                            <input type="number"  inputmode="decimal" step=".1" class="form-control inVal shown "  title="[[!%pj.dim_xxx_label_title]]" id="pe-dim" name="pe-dim" [[-sov="[[+pjv.xxx_len]]"]] value="[[!+pjv.xxx_len]]">[[-pjv.hSleeve_len]]
                            <div id="dimLen" class="invalid-tooltip">[[-!%pj.dim_xxx_invalid]]</div>
                        </div>                    
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" >Schließen</button>
                        <button id="save-modal-dim" type="button" data-bs-dismiss="modal" class="btn btn-primary" onclick="">Speichern</button>
                    </div>
                </div>
            </div>
        </div><!-- END dim-modal -->
        
        
        <!-- Hier noch Modal zum Bearbeiten von title und description --> [[-<p>[[+pj.calcname]] </p> &#x270E;]]
        <div class="modal " id="editPjModal" tabindex="-1" aria-labelledby="editPjLabel" aria-hidden="true"><!-- Modal: Projekt bearbeiten-->
            <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">[[!%jk.pjedit_title_modal]]</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <div class="mb-3 position-relative show">
                            <div class="d-flex">
                                <label class="form-label" for="title" title="[[!%jk.pjedit_pj_title_label_title]]">[[!%jk.pjedit_pj_title_label_text]]</label>
                                <a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto" data-bs-html="true" data-bs-toggle="popovermodal" title="[[!%jk.pjedit_pj_title_pop_title]]" 
                                data-bs-content="[[!%jk.pjedit_pj_title_pop_content]]" data-bs-title="[[!%jk.pjedit_pj_title_pop_title]]" ><i class="bi bi-question-circle"></i></a>
                            </div>
                            <input type="text" class="form-control inVal shown"  title="[[!%jk.pjedit_pj_title_label_title]]" id="title" name="title" placeholder="[[!%jk.pjedit_pj_title_plchd]]" sov="[[+pjv.title]]" value="[[+pjv.title]]">
                            <div id="Dpj_title" class="invalid-tooltip">[[!%jk.pjedit_pj_title_invalid]]</div>
                        </div>
                        <div class="mb-3 position-relative show">
                            <div class="d-flex">
                                <label class="form-label" for="description" title="[[!%jk.pjedit_pj_desc_label_title]]">[[!%jk.pjedit_pj_desc_label_text]]</label>
                                <a tabindex="0" role="button"  data-bs-trigger="focus" data-placement="top" class="ms-auto" data-bs-html="true" data-bs-toggle="popovermodal" title="[[!%jk.pjedit_pj_desc_pop_title]]" 
                                data-bs-content="[[!%jk.pjedit_pj_desc_pop_content]]" data-bs-title="[[!%jk.pjedit_pj_desc_pop_title]]" ><i class="bi bi-question-circle"></i></a>
                            </div>
                            <textarea class="form-control mt-2 inVal"  title="[[!%jk.pjedit_pj_desc_label_title]]" id="description" name="description" placeholder="[[!%jk.pjedit_pj_desc_plchd]]" sov="[[+pjv.description]]" value="[[+pjv.description]]" rows="5">[[+pjv.description]]</textarea>
                            <div id="Dpj_desc" class="invalid-tooltip">[[!%jk.pjedit_pj_desc_invalid]]</div>
                        </div> 
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Schließen</button>
                        <button id="save-modal-title" type="button" data-bs-dismiss="modal" class="btn btn-primary" onclick="updateProject()">Speichern</button>            
                    </div>
                </div>
            </div>
        </div><!-- END Modal Projekt bearbeiten-->  
    </fieldset><!-- modal fields -->  
    <fieldset>

    </fieldset> 
    <fieldset hidden>
        
       [[+pj.hiddenflds]]
       [[-<input class="form-control inVal" id="calcname" name="calcname" sov="project" value="project">]]
       <input class="form-control inVal"  id="pattern_meta" name="pattern_meta"  value="[[+pjv.pattern_meta]]">
[[-
    [id] => 15
       [[+pj.resource_id]]
       [[+pj.createdon]]
       [[+pj.ccreatedby]]
       [[+pj.editedon]]
       [[+pj.editedby]]
    [len_w] => 10
    [len_h] => 10
    [qty_w] => 24
    [qty_h] => 36
       [[+pj.calcname]]
       [[+pj.pattern_meta]]
    [title] => Mein erstes Strickprojekt
    [description] => Mit diesem Projekt teste ich die neuen Funktionen
       [[+pj.results]]
]]
   
    </fieldset>
 <fieldset hidden>
     <p id="test"></p>
 </fieldset>
[[-
pencil: &#x270E;
cross: [[!+pjv.wBust_len:is=`0`:then=`&#x270E;`]]

ruler: <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 640 512"><path d="M635.7 167.2L556.1 31.7c-8.8-15-28.3-20.1-43.5-11.5l-69 39.1L503.3 161c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L416 75l-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L333.2 122 278 153.3 337.8 255c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-59.7-101.7-55.2 31.3 27.9 47.4c2.2 3.8.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9l-27.9-47.5-55.2 31.3 59.7 101.7c2.2 3.7.9 8.5-2.9 10.7l-13.8 7.8c-3.8 2.2-8.7.9-10.9-2.9L84.9 262.9l-69 39.1C.7 310.7-4.6 329.8 4.2 344.8l79.6 135.6c8.8 15 28.3 20.1 43.5 11.5L624.1 210c15.2-8.6 20.4-27.8 11.6-42.8z"/></svg>
tshirt: <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 640 512"><path d="M631.2 96.5L436.5 0C416.4 27.8 371.9 47.2 320 47.2S223.6 27.8 203.5 0L8.8 96.5c-7.9 4-11.1 13.6-7.2 21.5l57.2 114.5c4 7.9 13.6 11.1 21.5 7.2l56.6-27.7c10.6-5.2 23 2.5 23 14.4V480c0 17.7 14.3 32 32 32h256c17.7 0 32-14.3 32-32V226.3c0-11.8 12.4-19.6 23-14.4l56.6 27.7c7.9 4 17.5.8 21.5-7.2L638.3 118c4-7.9.8-17.6-7.1-21.5z"/></svg>
]]