{"id":52774,"date":"2025-11-11T18:11:25","date_gmt":"2025-11-11T17:11:25","guid":{"rendered":"https:\/\/handmadestateofmind.com\/?page_id=52774"},"modified":"2025-11-17T16:45:45","modified_gmt":"2025-11-17T15:45:45","slug":"kalkulator-zuzycia-wloczki","status":"publish","type":"page","link":"https:\/\/handmadestateofmind.com\/en\/kalkulator-zuzycia-wloczki\/","title":{"rendered":"Kalkulator zu\u017cycia w\u0142\u00f3czki"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n\n\n \n \n Kalkulator Zu\u017cycia W\u0142\u00f3czki<\/title>\n <!-- Tailwind CSS -->\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n\n <!-- Czcionki: Lora (nag\u0142\u00f3wki) + Roboto (interfejs) -->\n <link href=\"https:\/\/fonts.googleapis.com\/css?family=Lora:wght@500;700;900&family=Roboto:wght@400;700;900&display=swap\" rel=\"stylesheet\">\n \n <!-- Ikona lupy\/info -->\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\">\n\n\n <style>\n \/* SCALED\/SCOPED STYLES *\/\n\n #yarn-calculator-app * {\n box-sizing: border-box; \n }\n\n #yarn-calculator-app {\n font-family: 'Roboto', sans-serif;\n background-color: #ffffff; \n margin-left: auto;\n margin-right: auto;\n }\n\n #yarn-calculator-app h1, \n #yarn-calculator-app h2, \n #yarn-calculator-app h3 {\n font-family: 'Lora', serif;\n }\n\n .rounded-30px {\n border-radius: 30px !important;\n }\n\n \/* G\u0142\u00f3wne sekcje (karty) *\/\n .section-card {\n background-color: #ffffff;\n padding: 1.5rem;\n border-radius: 30px;\n \/* Usuni\u0119ty shadow-2xl i border z g\u0142\u00f3wnego kontenera *\/\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),\n 0 1px 3px 0 rgba(0, 0, 0, 0.08);\n border: 1px solid #e0e0e0;\n }\n \n \/* Kontener danych wewn\u0105trz sekcji (DANE PR\u00d3BKI, DANE W\u0141\u00d3CZKI, ELEMENTY) *\/\n .data-container {\n background-color: #f9fafb; \n border-radius: 30px;\n padding: 1rem;\n border: 1px solid #e5e7eb;\n box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);\n }\n\n \/* Pola wej\u015bciowe *\/\n .input-style {\n padding: 0.6rem !important;\n border: 1px solid #9CA3AF !important;\n border-radius: 30px !important; \n width: 100% !important;\n font-size: 0.95rem !important;\n color: #1F2937 !important;\n transition: border-color 0.2s, box-shadow 0.2s;\n background-color: white !important; \n -webkit-appearance: none !important; \n -moz-appearance: none !important;\n appearance: none !important;\n }\n\n .input-style:focus {\n border-color: #000000 !important;\n outline: none !important;\n box-shadow: 0 0 0 1px #000000 !important;\n }\n \n .placeholder-gray-400::placeholder {\n color: #9CA3AF !important; \n opacity: 1 !important; \n }\n\n \/* Minimalistyczny przycisk usuwania w\u0142\u00f3czki\/elementu - sam krzy\u017cyk *\/\n .minimal-delete-btn {\n \/* POPRAWKA DLA ELEMENTORA - WIDOCZNO\u015a\u0106 *\/\n opacity: 1 !important; \/* Wymu\u015b pe\u0142n\u0105 widoczno\u015b\u0107 *\/\n color: #333333 !important; \n \n background-color: transparent; \n border: none; \n width: 1.5rem; \n height: 1.5rem; \n padding: 0; \n line-height: 1;\n font-size: 1.25rem; \n border-radius: 50% !important; \n display: flex;\n align-items: center;\n justify-content: center;\n transition: color 0.2s, background-color 0.2s, transform 0.2s;\n }\n\n .minimal-delete-btn:hover {\n color: #FF0000; \n background-color: #f0f0f0; \n transform: scale(1.1);\n }\n \n .minimal-delete-btn span {\n display: block;\n transform: translateY(-5%);\n }\n \n \/* Styl dla przycisku klonowania\/Powielania *\/\n .clone-btn {\n \/* POPRAWKA DLA ELEMENTORA - WIDOCZNO\u015a\u0106 I T\u0141O *\/\n opacity: 1 !important; \/* Wymu\u015b pe\u0142n\u0105 widoczno\u015b\u0107 *\/\n background-color: #f0f4f8 !important; \n color: #4B5563 !important; \n \n padding: 0.35rem 0.75rem; \n border-radius: 30px;\n font-size: 0.85rem;\n font-weight: 500;\n transition: background-color 0.2s, color 0.2s, transform 0.2s;\n border: 1px solid #D1D5DB;\n }\n\n .clone-btn:hover {\n background-color: #e5e7eb;\n color: #1F2937; \n transform: translateY(-1px);\n }\n\n \/* Nowy styl dla sekcji wynik\u00f3w *\/\n .result-section-card {\n background: linear-gradient(135deg, #f0f4f8 0%, #ffffff 100%);\n }\n \n \/* Styl dla nowych link\u00f3w dodawania *\/\n .add-link {\n padding: 0.25rem 0.5rem; \n background: none;\n border: none;\n text-align: left;\n margin-left: -0.5rem; \n }\n \n \/* KLUCZOWE POPRAWKI: Wymuszenie przezroczystego t\u0142a w stanach HOVER, FOCUS i ACTIVE *\/\n .add-link:hover,\n .add-link:focus,\n .add-link:active {\n background-color: transparent !important; \n outline: none !important; \n }\n \n \/* KLASA: Wymuszenie inline dla ca\u0142ego bloku P *\/\n .info-text-inline-p {\n display: block; \n line-height: 1.4;\n }\n \n \/* Styl dla labeli z info, kt\u00f3re maj\u0105 dzia\u0142a\u0107 w jednej linii *\/\n .info-label-inline {\n display: flex; \n align-items: center;\n flex-wrap: nowrap; \n }\n \n \/* ZMIENIONY STYL: Przycisk czyszczenia - Bia\u0142e t\u0142o i czarny\/ciemnoszary tekst *\/\n .clear-all-btn {\n opacity: 1 !important;\n background-color: #ffffff !important; \/* Bia\u0142e t\u0142o *\/\n color: #1F2937 !important; \/* Czarny\/ciemnoszary tekst i ikona *\/\n padding: 0.5rem 1rem; \n border-radius: 30px;\n font-size: 0.95rem;\n font-weight: 600;\n transition: background-color 0.2s, color 0.2s, transform 0.2s;\n border: 1px solid #D1D5DB; \/* Neutralna, szara ramka *\/\n }\n \n .clear-all-btn:hover {\n background-color: #f0f4f8; \/* Lekko szare t\u0142o na hover *\/\n color: #000000; \/* Czarny tekst na hover *\/\n transform: translateY(-1px);\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.06); \/* Neutralny cie\u0144 *\/\n }\n \n \/* ========================================================== *\/\n \/* NOWE REGU\u0141Y DLA SZEROKO\u015aCI MOBILNEJ (Tablet\/Mobile) *\/\n \/* ========================================================== *\/\n @media (max-width: 640px) {\n \n \/* GLOBALNE W\u0141A\u015aCIWO\u015aCI TOOLTIPA NA MOBILE\/TABLET (WY\u015aRODKOWANIE NA EKRANIE) *\/\n .info-tooltip-text {\n \/* Wymuszamy du\u017c\u0105 szeroko\u015b\u0107 dla lepszej czytelno\u015bci *\/\n width: min(90vw, 400px) !important; \n max-width: none !important; \n \n \/* Wracamy do regu\u0142y: lewa kraw\u0119d\u017a dymka przy lewej kraw\u0119dzi kontenera, ale dymek jest szeroki. *\/\n left: 5px !important;\n right: 5px !important;\n width: auto !important;\n max-width: none !important;\n transform: none !important;\n }\n \n \/* NOWA LOGIKA DLA MOBILNEJ STRZA\u0141KI *\/\n .info-tooltip-text::after,\n .info-tooltip-text::before {\n \/* Strza\u0142ka ma by\u0107 pod ikon\u0105. Ikona jest na lewo od dymka (left: 5px). *\/\n left: 10px !important;\n right: auto !important;\n margin-left: 0 !important;\n }\n }\n\n \/* DODATKOWA KOREKTA DLA TABLET\u00d3W (>640px) aby poprawi\u0107 szeroko\u015b\u0107, gdy jest w\u0119\u017csza *\/\n @media (min-width: 641px) and (max-width: 1024px) {\n .info-tooltip-text {\n \/* Na tablecie chcemy, \u017ceby dymek by\u0142 w\u0119\u017cszy ni\u017c 90vw, ale nie tak w\u0105ski jak na desktopie *\/\n width: 300px !important; \n max-width: none !important; \n \n \/* Utrzymujemy desktopowe pozycjonowanie do prawej kraw\u0119dzi *\/\n right: 0 !important;\n left: auto !important;\n transform: none !important;\n }\n }\n\n \/* Styl dla link\u00f3w rozwijaj\u0105cych (NOWA WERSJA) *\/\n .toggle-link {\n \/* KLUCZOWA POPRAWKA DLA ELEMENTORA: Wymuszenie widoczno\u015bci *\/\n opacity: 1 !important; \n display: inline-block !important; \n \n \/* ZMIANY ZGODNE Z PRO\u015aB\u0104: mniejsza czcionka (text-xs), czarny kolor, pogrubiony, bez podkre\u015blenia *\/\n color: #000000 !important; \n background: none !important;\n border: none !important;\n padding: 0 !important;\n \n cursor: pointer;\n text-decoration: none !important; \/* Usuni\u0119cie podkre\u015blenia *\/\n font-size: 0.75rem; \/* text-xs *\/\n font-weight: 700 !important; \/* Pogrubienie *\/\n transition: color 0.2s;\n margin-top: 0.25rem;\n margin-bottom: 0.5rem;\n line-height: 1.4;\n }\n\n .toggle-link:hover {\n color: #4B5563; \/* Lekko szary na hover (by co\u015b si\u0119 dzia\u0142o) *\/\n background-color: transparent !important; \n }\n \n \/* Styl dla list w rozwijanych sekcjach informacyjnych *\/\n .info-list-style {\n list-style: disc; \/* Lista punktowana *\/\n padding-left: 1.5rem; \/* Wci\u0119cie dla punkt\u00f3w *\/\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n }\n .info-list-style li {\n margin-bottom: 0.25rem;\n }\n \n <\/style>\n<\/head>\n<body>\n <div id=\"yarn-calculator-app\" class=\"max-w-4xl w-full p-4 md:p-8 mx-auto space-y-8\">\n <!-- NAG\u0141\u00d3WEK -->\n <h1 class=\"text-4xl font-bold text-center text-gray-900 mb-6\">\n Kalkulator Zu\u017cycia W\u0142\u00f3czki\n <\/h1>\n \n <!-- DODANY AKAPIT Z \u017bYCZENIA U\u017bYTKOWNIKA -->\n <p class=\"text-center text-sm text-gray-600\">\n Oblicz ile w\u0142\u00f3czki zu\u017cyje Tw\u00f3j projekt*\n <\/p>\n\n <!-- SEKCJA 1: DANE PR\u00d3BKI -->\n <div class=\"section-card\" id=\"calibration-section\">\n <h2 class=\"text-2xl font-semibold text-gray-800 mb-4\">1. Dane pr\u00f3bki<\/h2>\n <p class=\"mb-1 text-sm text-gray-600\">\n Wprowad\u017a dane swojej pr\u00f3bki.\n <\/p>\n \n <!-- NOWY ELEMENT: LINK ROZWIJAJ\u0104CY -->\n <button id=\"toggleInfoButton_sample\" onclick=\"toggleInfo('sample-info-content', 'toggleInfoButton_sample')\" \n class=\"toggle-link\"\n style=\"opacity: 1 !important; color: black !important; background-color: transparent !important; font-size: 0.75rem !important; font-weight: 700 !important; text-decoration: none !important;\">\n wi\u0119cej informacji\n <\/button>\n \n <!-- NOWY ELEMENT: ROZWIJANA TRE\u015a\u0106 -->\n <div id=\"sample-info-content\" class=\"text-sm text-gray-700 p-3 mb-4 rounded-xl bg-gray-100 border border-gray-300 transition-all duration-300\" style=\"display: none;\">\n <p class=\"mt-1\">\n Wykonaj pr\u00f3bk\u0119 u\u017cywaj\u0105c kombinacji w\u0142\u00f3czki, drut\u00f3w oraz \u015bciegu z jakich zamierzasz wykona\u0107 projekt. Zmierz i zwa\u017c swoj\u0105 pr\u00f3bk\u0119, a nast\u0119pnie uzupe\u0142nij dane. Podaj na ilu nitkach przerabiany jest projekt, np. je\u015bli u\u017cywasz 1 nitki merino, wpisz 1; je\u015bli u\u017cywasz 1 nitki merino i jednocze\u015bnie 1 nitki moheru, wpisz 2.\n <\/p>\n <\/div>\n \n <div class=\"data-container\">\n <!-- ZMIANA DLA RESPONSIVE: grid-cols-1 dla mobile, md:grid-cols-4 dla desktop -->\n <div class=\"grid grid-cols-1 md:grid-cols-4 gap-4\">\n <div>\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">szeroko\u015b\u0107 (cm)<\/label>\n <input type=\"number\" id=\"swatchWidth\" min=\"1\" class=\"input-style placeholder-gray-400\" placeholder=\"np. 10\">\n <\/div>\n <div>\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">wysoko\u015b\u0107 (cm)<\/label>\n <input type=\"number\" id=\"swatchHeight\" min=\"1\" class=\"input-style placeholder-gray-400\" placeholder=\"np. 10\">\n <\/div>\n <div>\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">waga (g)<\/label>\n <input type=\"number\" id=\"swatchWeight\" min=\"0.1\" step=\"0.1\" class=\"input-style placeholder-gray-400\" placeholder=\"np. 6\">\n <\/div>\n <div>\n <label class=\"info-label-inline text-sm font-medium text-gray-700 mb-1\">\n liczba nitek\n <\/label>\n <input type=\"number\" id=\"swatchStrands\" min=\"1\" class=\"input-style placeholder-gray-400\" placeholder=\"np. 2\">\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- SEKCJA 2: DANE W\u0141\u00d3CZKI -->\n <div class=\"section-card\" id=\"yarn-setup-section\">\n <h2 class=\"text-2xl font-semibold text-gray-800 mb-4\">2. Dane w\u0142\u00f3czki<\/h2>\n <p class=\"mb-1 text-sm text-gray-600\">\n Wprowad\u017a informacje o w\u0142\u00f3czkach, z jakich wykonujesz projekt.\n <\/p>\n \n <!-- NOWY ELEMENT: LINK ROZWIJAJ\u0104CY DLA DANYCH W\u0141\u00d3CZKI -->\n <button id=\"toggleInfoButton_yarn\" onclick=\"toggleInfo('yarn-info-content', 'toggleInfoButton_yarn')\" \n class=\"toggle-link\"\n style=\"opacity: 1 !important; color: black !important; background-color: transparent !important; font-size: 0.75rem !important; font-weight: 700 !important; text-decoration: none !important;\">\n wi\u0119cej informacji\n <\/button>\n \n <!-- NOWY ELEMENT: ROZWIJANA TRE\u015a\u0106 DLA DANYCH W\u0141\u00d3CZKI -->\n <div id=\"yarn-info-content\" class=\"text-sm text-gray-700 p-3 mb-4 rounded-xl bg-gray-100 border border-gray-300 transition-all duration-300\" style=\"display: none;\">\n <p class=\"mt-1\">\n Podaj dane techniczne oddzielnie dla ka\u017cdej w\u0142\u00f3czki z jakiej wykonujesz projekt. Podaj r\u00f3wnie\u017c ile nitek danej w\u0142\u00f3czki u\u017cywasz jednocze\u015bnie w projekcie np. je\u015bli u\u017cywasz 1 nitki danej w\u0142\u00f3czki, wpisz 1; je\u015bli u\u017cywasz jednocze\u015bnie 2 nitek tej samej w\u0142\u00f3czki, wpisz 2.\n <\/p>\n <\/div>\n \n <!-- ZMIANA: Usuni\u0119to 'space-y-3' z kontenera, aby to renderYarns zarz\u0105dza\u0142o odst\u0119pami -->\n <div id=\"yarnsContainer\" class=\"data-container p-4\">\n <!-- Dynamicznie dodane w\u0142\u00f3czki -->\n <\/div>\n <!-- Przycisk dodawania w\u0142\u00f3czki. Klasa 'add-link' jest teraz zabezpieczona przed r\u00f3\u017cowym t\u0142em we wszystkich stanach. -->\n <button onclick=\"addYarn()\" class=\"add-link flex items-center space-x-2 mt-4 text-base font-medium text-black hover:text-gray-700 transition duration-200 cursor-pointer\" style=\"color: black !important;\">\n <span style=\"color: black !important;\" class=\"text-xl font-bold leading-none translate-y-[-1px]\">+<\/span>\n <span style=\"color: black !important;\" class=\"leading-none\">dodaj kolejny rodzaj w\u0142\u00f3czki<\/span>\n <\/button>\n <\/div>\n\n <!-- SEKCJA 3: POWIERZCHNIA PROJEKTU -->\n <div class=\"section-card\" id=\"elements-section\">\n <h2 class=\"text-2xl font-semibold text-gray-800 mb-4\">3. Powierzchnia projektu<\/h2>\n <!-- KLUCZOWA ZMIANA: usuni\u0119cie kontenera info-tooltip-container i zwi\u0105zanych z nim element\u00f3w -->\n <p class=\"mb-1 text-sm text-gray-600 info-text-inline-p\">\n Dodaj poszczeg\u00f3lne elementy garderoby i wybierz ich kszta\u0142t, aby obliczy\u0107 powierzchni\u0119.\n <\/p>\n \n <!-- NOWY ELEMENT: LINK ROZWIJAJ\u0104CY DLA ELEMENT\u00d3W PROJEKTU -->\n <button id=\"toggleInfoButton_elements\" onclick=\"toggleInfo('elements-info-content', 'toggleInfoButton_elements')\" \n class=\"toggle-link\"\n style=\"opacity: 1 !important; color: black !important; background-color: transparent !important; font-size: 0.75rem !important; font-weight: 700 !important; text-decoration: none !important;\">\n wi\u0119cej informacji\n <\/button>\n \n <!-- NOWY ELEMENT: ROZWIJANA TRE\u015a\u0106 DLA ELEMENT\u00d3W PROJEKTU -->\n <div id=\"elements-info-content\" class=\"text-sm text-gray-700 p-3 mb-4 rounded-xl bg-gray-100 border border-gray-300 transition-all duration-300\" style=\"display: none;\">\n <p class=\"mt-1\">\n Aby uzyska\u0107 jak najbardziej precyzyjne dane, rozbij sw\u00f3j projekt na jak najbardziej precyzyjne elementy np. ty\u0142 swetra, r\u0119kawy, ko\u0142nierzyk, plisa.\n <\/p>\n <p class=\"mt-2 font-semibold\">\n Dodatkowo wybierz jak najbardziej precyzyjny kszta\u0142t danego elementu:\n <\/p>\n <ul class=\"info-list-style\">\n <li>je\u015bli ty\u0142 swetra ma prost\u0105 lini\u0119 ramion to wybierz dla niego kszta\u0142t prostok\u0105ta\/kwadratu; ale je\u015bli ty\u0142 swetra ma sko\u015bn\u0105 lini\u0119 ramion to ty\u0142 swetra powinien sk\u0142ada\u0107 si\u0119 z dw\u00f3ch element\u00f3w : w kszta\u0142cie trapezu i w kszta\u0142cie prostok\u0105ta<\/li>\n <li>je\u015bli r\u0119kawy s\u0105 proste to wybierz dla niego kszta\u0142t prostok\u0105ta\/kwadratu; ale je\u015bli r\u0119kawy s\u0105 zw\u0119\u017cone to wybierz dla nich kszta\u0142t trapezu.<\/li>\n <\/ul>\n <p class=\"mt-2 font-bold text-gray-900\">\n PS. I pami\u0119taj, \u017ce sweter ma dwa r\u0119kawy, ka\u017cdy trzeba poda\u0107 oddzielnie \ud83d\ude42 mo\u017cesz u\u017cy\u0107 opcji \u201cpowiel\u201d aby utworzy\u0107 kolejny element o tych samych danych. \n <\/p>\n <\/div>\n \n <div id=\"elementsContainer\" class=\"space-y-4 data-container p-4\">\n <!-- Dynamicznie dodane elementy -->\n <\/div>\n <!-- Przycisk dodawania elementu. Klasa 'add-link' jest teraz zabezpieczona przed r\u00f3\u017cowym t\u0142em we wszystkich stanach. -->\n <button onclick=\"addElement()\" class=\"add-link flex items-center space-x-2 mt-4 text-base font-medium text-black hover:text-gray-700 transition duration-200 cursor-pointer\" style=\"color: black !important;\">\n <span style=\"color: black !important;\" class=\"text-xl font-bold leading-none translate-y-[-1px]\">+<\/span>\n <span style=\"color: black !important;\" class=\"leading-none\">dodaj kolejny element projektu<\/span>\n <\/button>\n <\/div>\n\n <!-- SEKCJA WYNIKI -->\n <div class=\"section-card result-section-card\" id=\"results-section\">\n <!-- Usuni\u0119to \"4.\" z tytu\u0142u -->\n <h2 class=\"text-3xl font-bold text-center text-gray-900 mb-6\">wyniki zu\u017cycia<\/h2>\n \n <div id=\"resultsContent\" class=\"space-y-6\">\n \n <!-- USUNI\u0118TO: PODSUMOWANIE WAGI I CA\u0141KOWITEJ POWIERZCHNI. B\u0118D\u0104 ONE GENEROWANE W SKRYPCIE PONI\u017bEJ JAKO OSTATNIE ELEMENTY LIST. -->\n\n <!-- SZCZEG\u00d3\u0141Y (POWIERZCHNIA I W\u0141\u00d3CZKI) -->\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6 pt-4\">\n \n <!-- SZCZEG\u00d3\u0141Y POWIERZCHNI ELEMENT\u00d3W (ZAWIERA TERAZ CA\u0141KOWIT\u0104 POWIERZCHNI\u0118) -->\n <!-- ZMIANA: Dodanie stylu inline z !important, by wymusi\u0107 bia\u0142e t\u0142o i naprawi\u0107 konflikt z Elementorum -->\n <div class=\"data-container p-4 bg-white space-y-3\" style=\"background-color: white !important;\">\n <!-- ZMIANA NAG\u0141\u00d3WKA: \"powierzchnia poszczeg\u00f3lnych element\u00f3w\" -> \"powierzchnia\" -->\n <h3 class=\"text-xl font-semibold text-gray-800 border-b pb-2 mb-3\">powierzchnia:<\/h3>\n <div id=\"individualAreaResults\" class=\"space-y-2\">\n <!-- Wyniki powierzchni -->\n <p class=\"text-gray-500 text-sm\">Wprowad\u017a elementy, aby zobaczy\u0107 szczeg\u00f3\u0142y.<\/p>\n <\/div>\n <\/div>\n\n <!-- ZU\u017bYCIE W\u0141\u00d3CZKI (MA BY\u0106 W STYLU POWIERZCHNI) (ZAWIERA TERAZ CA\u0141KOWITE ZU\u017bYCIE) -->\n <!-- ZMIANA: Dodanie stylu inline z !important, by wymusi\u0107 bia\u0142e t\u0142o i naprawi\u0107 konflikt z Elementorum -->\n <div class=\"data-container p-4 bg-white space-y-3\" style=\"background-color: white !important;\">\n <!-- ZMIANA NAG\u0141\u00d3WKA: \"zu\u017cycie wed\u0142ug rodzaju w\u0142\u00f3czki\" -> \"zu\u017cycie w\u0142\u00f3czki\" -->\n <h3 class=\"text-xl font-semibold text-gray-800 border-b pb-2 mb-3\">zu\u017cycie w\u0142\u00f3czki:<\/h3>\n <!-- ZMIANA: Zmieniono space-y-4 na space-y-2 dla sp\u00f3jno\u015bci i usuni\u0119to klas\u0119 yarn-result-box -->\n <div id=\"individualYarnResults\" class=\"space-y-2\">\n <!-- Wyniki dla poszczeg\u00f3lnych w\u0142\u00f3czek -->\n <p class=\"text-gray-500 text-sm\">Wprowad\u017a dane w\u0142\u00f3czek i pr\u00f3bki, aby zobaczy\u0107 zu\u017cycie.<\/p>\n <\/div>\n <\/div>\n\n <\/div>\n <\/div>\n <\/div>\n \n <!-- NOWY PRZYCISK CZYSZCZENIA DANYCH (w prawym dolnym rogu) -->\n <div class=\"flex justify-end pt-4\">\n <button onclick=\"clearAllData()\" \n class=\"clear-all-btn flex items-center\"\n title=\"Usu\u0144 wszystkie wprowadzone dane i zresetuj kalkulator\">\n <i class=\"fas fa-trash-alt mr-2\"><\/i> Wyczy\u015b\u0107 wszystkie dane\n <\/button>\n <\/div>\n \n <!-- DODANY DISCLAIMER (NOWY ELEMENT) -->\n <div class=\"text-center pt-8 pb-4 text-xs text-gray-500 italic border-t border-gray-200 mt-8\">\n *Kalkulator pokazuje szacunkowe zu\u017cycie w\u0142\u00f3czki, kt\u00f3re mo\u017ce si\u0119 r\u00f3\u017cni\u0107 od ostatecznego zu\u017cycia.\n <\/div>\n \n <\/div>\n\n <script>\n \/\/ Global state management\n let yarns = [];\n let elements = [];\n let nextYarnId = 1;\n let nextElementId = 1;\n const PI = Math.PI; \n\n window.onload = function() {\n initializeApp();\n \n \/\/ Nas\u0142uchiwanie na zmiany w danych pr\u00f3bki\n const calibrationSection = document.getElementById('calibration-section');\n if (calibrationSection) {\n calibrationSection.querySelectorAll('input').forEach(input => {\n input.addEventListener('input', calculateConsumption);\n });\n }\n \n renderYarns();\n renderElements();\n calculateConsumption();\n };\n \n \/\/ --- ZMODYFIKOWANA FUNKCJA DO ROZWIJANIA\/ZWIJANIA TRE\u015aCI (Uniwersalna) ---\n function toggleInfo(contentId, buttonId) {\n const content = document.getElementById(contentId);\n const button = document.getElementById(buttonId);\n \n \/\/ Sprawdzenie obecnego stanu (czy zawarto\u015b\u0107 jest ukryta lub pusta)\n const isHidden = content.style.display === 'none' || content.style.display === '';\n\n if (isHidden) {\n \/\/ Poka\u017c zawarto\u015b\u0107\n content.style.display = 'block';\n \/\/ Zmie\u0144 tekst przycisku\n button.textContent = 'mniej informacji'; \n } else {\n \/\/ Ukryj zawarto\u015b\u0107\n content.style.display = 'none';\n \/\/ Zmie\u0144 tekst przycisku z powrotem\n button.textContent = 'wi\u0119cej informacji'; \n }\n }\n\n \/\/ Funkcja inicjalizacyjna, u\u017cywana r\u00f3wnie\u017c do resetowania\n function initializeApp() {\n \/\/ Reset stan\u00f3w\n yarns = [];\n elements = [];\n nextYarnId = 1;\n nextElementId = 1;\n \n \/\/ Czyszczenie p\u00f3l wej\u015bciowych dla pr\u00f3bki\n document.getElementById('swatchWidth').value = '';\n document.getElementById('swatchHeight').value = '';\n document.getElementById('swatchWeight').value = '';\n document.getElementById('swatchStrands').value = '';\n \n \/\/ ZWI\u0143 INFORMACJ\u0118 PRZY RESECIE dla wszystkich sekcji\n \/\/ Sekcja 1: Dane pr\u00f3bki\n const infoContentSample = document.getElementById('sample-info-content');\n const infoButtonSample = document.getElementById('toggleInfoButton_sample');\n if(infoContentSample && infoButtonSample) {\n infoContentSample.style.display = 'none';\n infoButtonSample.textContent = 'wi\u0119cej informacji';\n }\n \n \/\/ Sekcja 2: Dane w\u0142\u00f3czki\n const infoContentYarn = document.getElementById('yarn-info-content');\n const infoButtonYarn = document.getElementById('toggleInfoButton_yarn');\n if(infoContentYarn && infoButtonYarn) {\n infoContentYarn.style.display = 'none';\n infoButtonYarn.textContent = 'wi\u0119cej informacji';\n }\n \n \/\/ Sekcja 3: Powierzchnia projektu\n const infoContentElements = document.getElementById('elements-info-content');\n const infoButtonElements = document.getElementById('toggleInfoButton_elements');\n if(infoContentElements && infoButtonElements) {\n infoContentElements.style.display = 'none';\n infoButtonElements.textContent = 'wi\u0119cej informacji';\n }\n\n\n \/\/ Dodajemy jedn\u0105 pust\u0105 w\u0142\u00f3czk\u0119 i jeden pusty element projektu na start\n if (yarns.length === 0) {\n addYarn();\n }\n if (elements.length === 0) {\n addElement();\n }\n \n renderYarns();\n renderElements();\n calculateConsumption();\n }\n\n \/\/ --- FUNKCJA DO CZYSZCZENIA WSZYSTKICH DANYCH ---\n function clearAllData() {\n \/\/ Zamiast alert(), mo\u017cna u\u017cy\u0107 prostej wiadomo\u015bci lub zaimplementowa\u0107 modal.\n \/\/ Poniewa\u017c nie mog\u0119 u\u017cy\u0107 confirm(), po prostu wywo\u0142uj\u0119 resetowanie\n initializeApp();\n }\n\n \/\/ --- FUNKCJE KALKULACYJNE ---\n\n function calculateArea(shape, dim1, dim2, dim3) {\n \/\/ Dim1 to zawsze g\u00f3rna podstawa\/szeroko\u015b\u0107\/promie\u0144 (po\u0142owa \u015brednicy)\n \/\/ Dim2 to zawsze wysoko\u015b\u0107\/dolna podstawa\n \/\/ Dim3 to zawsze wysoko\u015b\u0107 trapezu (je\u015bli dotyczy)\n const d1 = parseFloat(dim1) || 0; \n const d2 = parseFloat(dim2) || 0; \n const d3 = parseFloat(dim3) || 0; \n\n if (d1 < 0 || d2 < 0 || d3 < 0) return 0;\n\n switch (shape) {\n case 'rectangle':\n return d1 * d2;\n case 'triangle':\n return 0.5 * d1 * d2;\n case 'trapezoid':\n \/\/ d1 = podstawa g\u00f3rna, d2 = podstawa dolna, d3 = wysoko\u015b\u0107\n return 0.5 * (d1 + d2) * d3; \n case 'circle':\n \/\/ d1 = promie\u0144 (po\u0142owa \u015brednicy)\n return PI * d1 * d1;\n default:\n return 0;\n }\n }\n\n function calculateConsumption() {\n const wSwatch = parseFloat(document.getElementById('swatchWidth').value) || 0;\n const hSwatch = parseFloat(document.getElementById('swatchHeight').value) || 0;\n const weightSwatch = parseFloat(document.getElementById('swatchWeight').value) || 0;\n const strandsSwatch = parseInt(document.getElementById('swatchStrands').value) || 0; \/\/ ZMIANA: Domy\u015blnie 0 dla wymuszenia walidacji\n\n \/\/ 1. Obliczanie ca\u0142kowitej powierzchni projektu\n let totalArea = 0;\n elements.forEach(element => {\n element.area = calculateArea(element.shape, element.dim1, element.dim2, element.dim3); \n totalArea += element.area;\n });\n\n let totalWeight = 0;\n let individualResults = [];\n let error = ''; \/\/ Nowa zmienna dla komunikatu o b\u0142\u0119dzie\n \n \/\/ --- WALIDACJA I OBLICZENIA DANYCH W\u0141\u00d3CZKI ---\n let projectTotalStrands = 0;\n let missingYarnData = false;\n\n \/\/ KROK 1: Obliczanie G\/M (Gramy\/Metr) dla ca\u0142ej mieszanki u\u017cytej w projekcie\/pr\u00f3bce\n let totalGramsPerMeterMix = 0; \n \n yarns.forEach(yarn => {\n \/\/ U\u017cywamy 0 jako domy\u015blnej, co wymusza wprowadzenie warto\u015bci w walidacji poni\u017cej\n const strands = parseFloat(yarn.strandsInProject) || 0; \n projectTotalStrands += strands;\n \n const weightPerSkein = parseFloat(yarn.weightPerSkein) || 0; \n const lengthPerSkein = parseFloat(yarn.lengthPerSkein) || 0;\n \n let gramsPerMeter = 0;\n if (lengthPerSkein > 0 && weightPerSkein > 0) {\n gramsPerMeter = weightPerSkein \/ lengthPerSkein; \n }\n \n \/\/ Sprawdzamy, czy dane s\u0105 kompletne, je\u015bli w\u0142\u00f3czka ma by\u0107 u\u017cyta\n if (strands > 0 && (weightPerSkein <= 0 || lengthPerSkein <= 0)) {\n missingYarnData = true;\n }\n \n \/\/ Contribution = g\/m jednej nitki * liczba nitek tej w\u0142\u00f3czki w mieszance\n yarn.contribution = gramsPerMeter * strands; \n totalGramsPerMeterMix += yarn.contribution;\n });\n \n \/\/ ------------------- WALIDACJA -------------------\n \/\/ Walidacja 1: Dane pr\u00f3bki (wymiary i waga)\n if (wSwatch <= 0 || hSwatch <= 0 || weightSwatch <= 0) {\n \/\/ ZMIANA ZGODNA Z \u017bYCZENIEM U\u017bYTKOWNIKA\n error = 'Wprowad\u017a wszystkie dane.';\n } \n \/\/ Walidacja 2: Liczba nitek musi by\u0107 podana\n else if (strandsSwatch <= 0) {\n error = 'Wprowad\u017a liczb\u0119 nitek w Danych pr\u00f3bki (musi by\u0107 > 0).';\n }\n \/\/ Walidacja 3: Brakuj\u0105ce dane w\u0142\u00f3czki (waga, d\u0142ugo\u015b\u0107, je\u015bli ma by\u0107 u\u017cyta)\n else if (missingYarnData) {\n error = 'Uzupe\u0142nij wag\u0119 i d\u0142ugo\u015b\u0107 motka dla wszystkich w\u0142\u00f3czek z liczb\u0105 nitek > 0.';\n }\n \/\/ Walidacja 4: Nowa zasada: Liczba nitek w pr\u00f3bce musi by\u0107 r\u00f3wna \u0142\u0105cznej liczbie nitek w projekcie\n else if (strandsSwatch !== projectTotalStrands) {\n error = `B\u0141\u0104D ZASADY: Liczba nitek w pr\u00f3bce (${strandsSwatch}) musi by\u0107 r\u00f3wna \u0142\u0105cznej liczbie nitek w Danych w\u0142\u00f3czki (${projectTotalStrands}).`;\n } \n \/\/ Walidacja 5: Powierzchnia musi by\u0107 podana\n else if (totalArea <= 0) {\n error = 'Wprowad\u017a wymiary element\u00f3w projektu (Powierzchnia projektu).';\n }\n \/\/ Walidacja 6: Musimy mie\u0107 jak\u0105\u015b mieszank\u0119, \u017ceby oblicza\u0107\n else if (totalGramsPerMeterMix <= 0) {\n error = 'Wprowad\u017a poprawne dane motk\u00f3w (waga\/d\u0142ugo\u015b\u0107) i liczb\u0119 nitek.';\n }\n\n \/\/ Je\u015bli wyst\u0105pi b\u0142\u0105d, zatrzymaj obliczenia i zaktualizuj UI\n if (error) {\n updateResultsUI(totalArea, 0, [], error); \n return;\n }\n \/\/ ------------------- KONIEC WALIDACJI -------------------\n\n \/\/ KROK 2: OBLICZANIE G\u0118STO\u015aCI ROB\u00d3TKI (NORMALIZED RATE)\n let normalizedRate = 0; \/\/ Metry\/cm^2\n const areaSwatch = wSwatch * hSwatch; \n \n if (areaSwatch > 0 && weightSwatch > 0 && totalGramsPerMeterMix > 0) {\n \/\/ metersUsedInSwatch = waga pr\u00f3bki \/ (\u0142\u0105czny G\/M mieszanki)\n const metersUsedInSwatch = weightSwatch \/ totalGramsPerMeterMix; \n normalizedRate = metersUsedInSwatch \/ areaSwatch; \n }\n \n \/\/ KROK 3: OBLICZANIE CA\u0141KOWITEJ WAGI PROJEKTU\n \/\/ Waga = Powierzchnia * (metry\/cm^2) * (gramy\/metr mieszanki)\n totalWeight = totalArea * normalizedRate * totalGramsPerMeterMix;\n \n totalWeight = Math.max(0, totalWeight);\n\n \/\/ KROK 4: ROZDZIELENIE WAGI NA POSZCZEG\u00d3LNE W\u0141\u00d3CZKI\n if (totalGramsPerMeterMix > 0) {\n yarns.forEach(yarn => {\n \/\/ fraction = (g\/m tej w\u0142\u00f3czki) \/ (g\/m ca\u0142ej mieszanki)\n const contributionFraction = yarn.contribution \/ totalGramsPerMeterMix; \n const weight = totalWeight * contributionFraction; \n \n let skeinsNeeded = 0;\n if (weight > 0 && (parseFloat(yarn.weightPerSkein) || 0) > 0) {\n skeinsNeeded = weight \/ parseFloat(yarn.weightPerSkein); \n }\n\n individualResults.push({\n name: yarn.name || `W\u0142\u00f3czka ${yarn.id}`,\n weight: weight,\n skeinsNeeded: skeinsNeeded,\n weightPerSkein: parseFloat(yarn.weightPerSkein) || 0,\n id: yarn.id\n });\n });\n }\n \/\/ 5. Update UI\n updateResultsUI(totalArea, totalWeight, individualResults);\n }\n\n \/\/ --- ZARZ\u0104DZANIE W\u0141\u00d3CZKAMI ---\n\n function addYarn() { \n const id = nextYarnId++;\n const newYarn = {\n id: id,\n name: '', \n placeholderName: `np. My Time Merino`, \n strandsInProject: '', \n weightPerSkein: '', \n lengthPerSkein: '', \n contribution: 0\n };\n yarns.push(newYarn);\n renderYarns(); \n calculateConsumption();\n }\n\n function removeYarn(id) {\n yarns = yarns.filter(yarn => yarn.id !== id);\n \/\/ Re-numerowanie ID dla sp\u00f3jno\u015bci\n yarns = yarns.map((yarn, index) => ({\n ...yarn,\n id: index + 1,\n placeholderName: `np. My Time Merino`\n }));\n nextYarnId = yarns.length + 1;\n\n renderYarns(); \n calculateConsumption();\n }\n\n function handleYarnChange(id, field, value) {\n const yarn = yarns.find(y => y.id === id);\n if (yarn) {\n if (value === '') {\n yarn[field] = '';\n } else if (field === 'name') {\n yarn[field] = value;\n } else {\n yarn[field] = value; \n }\n \n calculateConsumption();\n }\n }\n\n function renderYarns() {\n const container = document.getElementById('yarnsContainer');\n \/\/ ZMIANA: Zmieniono struktur\u0119, aby w\u0142\u00f3czki nie by\u0142y w oddzielnych kartach i wygl\u0105da\u0142y jak w Danych Pr\u00f3bki.\n container.innerHTML = yarns.map((yarn, index) => { \/\/ Dodano 'index'\n const strandsVal = yarn.strandsInProject === '' ? '' : yarn.strandsInProject;\n const weightVal = yarn.weightPerSkein === '' ? '' : yarn.weightPerSkein;\n const lengthVal = yarn.lengthPerSkein === '' ? '' : yarn.lengthPerSkein;\n const nameVal = yarn.name || ''; \n const placeholder = yarn.placeholderName;\n \n \/\/ Klasa separuj\u0105ca: border-t i pt-4 dla wszystkich element\u00f3w poza pierwszym\n const separatorClass = index > 0 ? 'border-t border-gray-300 pt-4 mt-4' : 'pt-0 mt-0'; \n \n return `\n <div class=\"space-y-4 ${separatorClass} pb-4\">\n \n <!-- 1. PRZYCISK USU\u0143 (wyr\u00f3wnanie do prawej) -->\n <div class=\"flex justify-end -mb-2\">\n <button onclick=\"removeYarn(${yarn.id})\" \n class=\"minimal-delete-btn transition duration-200\"\n title=\"Usu\u0144 w\u0142\u00f3czk\u0119\">\n <span>×<\/span>\n <\/button>\n <\/div>\n\n <!-- ZMIANA: Nazwa w\u0142\u00f3czki na pe\u0142nej szeroko\u015bci, nad pozosta\u0142ymi polami -->\n <!-- 2. POLE 1: NAZWA W\u0141\u00d3CZKI (Pe\u0142na szeroko\u015b\u0107) -->\n <div class=\"w-full\">\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">nazwa w\u0142\u00f3czki<\/label>\n <input type=\"text\" value=\"${nameVal}\" oninput=\"handleYarnChange(${yarn.id}, 'name', this.value)\" \n class=\"input-style bg-white font-bold placeholder-gray-400\" placeholder=\"${placeholder}\">\n <\/div>\n\n <!-- 3. G\u0141\u00d3WNA SIATKA DANYCH (Nitki, Waga, D\u0142ugo\u015b\u0107) - 3 kolumny -->\n <div class=\"grid grid-cols-1 md:grid-cols-3 gap-4 w-full\">\n \n <!-- POLE A: LICZBA NITEK -->\n <div>\n <label class=\"info-label-inline text-sm font-medium text-gray-700 mb-1\">\n liczba nitek\n <\/label>\n <input type=\"number\" value=\"${strandsVal}\" min=\"0\" step=\"1\" \n oninput=\"handleYarnChange(${yarn.id}, 'strandsInProject', this.value)\" \n class=\"input-style bg-white placeholder-gray-400\" placeholder=\"np. 1\">\n <\/div>\n\n <!-- POLE B: WAGA MOTKA -->\n <div>\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">waga motka (g)<\/label>\n <input type=\"number\" value=\"${weightVal}\" min=\"0.1\" step=\"0.1\" \n oninput=\"handleYarnChange(${yarn.id}, 'weightPerSkein', this.value)\" \n class=\"input-style bg-white placeholder-gray-400\" placeholder=\"np. 50\">\n <\/div>\n\n <!-- POLE C: D\u0141UGO\u015a\u0106 MOTKA -->\n <div>\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">d\u0142ugo\u015b\u0107 motka (m)<\/label>\n <input type=\"number\" value=\"${lengthVal}\" min=\"1\" step=\"1\" \n oninput=\"handleYarnChange(${yarn.id}, 'lengthPerSkein', this.value)\" \n class=\"input-style bg-white placeholder-gray-400\" placeholder=\"np. 100\">\n <\/div>\n <\/div>\n <\/div>\n `;\n }).join('');\n }\n\n \/\/ --- ZARZ\u0104DZANIE ELEMENTAMI PROJEKTU (Area\/Kszta\u0142ty) ---\n\n function addElement(name = '', shape = 'rectangle', dim1 = '', dim2 = '', dim3 = '') { \/\/ Usuni\u0119to 'count' z parametr\u00f3w\n const id = nextElementId++;\n const newElement = {\n id: id,\n name: name, \n placeholderName: `np. ty\u0142 swetra`, \n shape: shape,\n dim1: dim1,\n dim2: dim2,\n dim3: dim3,\n area: 0\n };\n elements.push(newElement);\n renderElements(); \n }\n\n function cloneElement(id) {\n const elementToClone = elements.find(e => e.id === id);\n if (elementToClone) {\n \/\/ Skopiowanie danych\n const { name, shape, dim1, dim2, dim3 } = elementToClone;\n \/\/ Dodanie nowego elementu z skopiowanymi danymi i nowym ID\n addElement(name + ' (kopia)', shape, dim1, dim2, dim3);\n calculateConsumption();\n }\n }\n\n function removeElement(id) {\n elements = elements.filter(element => element.id !== id);\n renderElements(); \n calculateConsumption();\n }\n\n function handleElementChange(id, field, value) {\n const element = elements.find(e => e.id === id);\n if (element) {\n if (value === '') {\n element[field] = '';\n } else if (field === 'name') {\n element[field] = value;\n } else {\n \/\/ Dla p\u00f3l numerycznych\n element[field] = value; \n }\n \n if (field === 'shape') {\n \/\/ Reset wymiar\u00f3w przy zmianie kszta\u0142tu, \u017ceby unikn\u0105\u0107 b\u0142\u0119d\u00f3w w obliczeniach\n element.dim1 = '';\n element.dim2 = '';\n element.dim3 = '';\n renderElements(); \n }\n calculateConsumption();\n }\n }\n\n function renderDimensionsInputs(element) {\n let dimInputs = [];\n \n const dim1Val = element.dim1 === '' ? '' : element.dim1;\n const dim2Val = element.dim2 === '' ? '' : element.dim2;\n const dim3Val = element.dim3 === '' ? '' : element.dim3;\n \n switch (element.shape) {\n case 'rectangle':\n dimInputs = [\n { label: 'szeroko\u015b\u0107 (cm)', value: dim1Val, field: 'dim1', placeholder: 'np. 50' },\n { label: 'wysoko\u015b\u0107 (cm)', value: dim2Val, field: 'dim2', placeholder: 'np. 60' }\n ];\n break;\n case 'triangle':\n dimInputs = [\n { label: 'szeroko\u015b\u0107 podstawy dolnej (cm)', value: dim1Val, field: 'dim1', placeholder: 'np. 40' },\n { label: 'wysoko\u015b\u0107 (cm)', value: dim2Val, field: 'dim2', placeholder: 'np. 20' }\n ];\n break;\n case 'trapezoid':\n \/\/ ZMIANA: Zosta\u0142y tylko 3 wymiary w trapezie: g\u00f3rna podstawa, dolna podstawa, wysoko\u015b\u0107\n dimInputs = [\n { label: 'szeroko\u015b\u0107 podstawy g\u00f3rnej (cm)', value: dim1Val, field: 'dim1', placeholder: 'np. 50' },\n { label: 'szeroko\u015b\u0107 podstawy dolnej (cm)', value: dim2Val, field: 'dim2', placeholder: 'np. 30' },\n { label: 'wysoko\u015b\u0107 (cm)', value: dim3Val, field: 'dim3', placeholder: 'np. 10' }\n ];\n break;\n case 'circle':\n dimInputs = [\n { label: 'po\u0142owa \u015brednicy (cm)', value: dim1Val, field: 'dim1', placeholder: 'np. 15' }\n ];\n break;\n }\n \n \/\/ Wymiary s\u0105 teraz renderowane w innej siatce\n return dimInputs.map(input => `\n <div>\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">${input.label}<\/label>\n <input type=\"number\" value=\"${input.value}\" min=\"0\" step=\"0.1\" oninput=\"handleElementChange(${element.id}, '${input.field}', this.value)\" \n class=\"input-style bg-white placeholder-gray-400\" placeholder=\"${input.placeholder}\">\n <\/div>\n `).join('');\n }\n\n function renderElements() {\n const container = document.getElementById('elementsContainer');\n container.innerHTML = elements.map((element, index) => { \/\/ ZMIANA: Dodano index do implementacji separatora\n const nameVal = element.name || ''; \n const placeholder = element.placeholderName; \n \n \/\/ Ustalenie klasy siatki dla wymiar\u00f3w\n let dimGridClass = 'grid-cols-1 md:grid-cols-2'; \/\/ ZMIANA: Domy\u015blnie grid-cols-1 dla mobile\n if (element.shape === 'trapezoid') {\n dimGridClass = 'grid-cols-1 md:grid-cols-3'; \/\/ ZMIANA: Domy\u015blnie grid-cols-1 dla mobile\n } else if (element.shape === 'circle') {\n dimGridClass = 'grid-cols-1 md:grid-cols-1'; \/\/ ZMIANA: Domy\u015blnie grid-cols-1 dla mobile\n }\n \n \/\/ ZMIANA: Klasa separuj\u0105ca, tak jak w sekcji w\u0142\u00f3czki\n const separatorClass = index > 0 ? 'border-t border-gray-300 pt-4 mt-4' : 'pt-0 mt-0'; \n \n return `\n <!-- ZMIANA: Usuni\u0119to styl karty (p-4 bg-white rounded-30px border border-gray-200 shadow-md), \n aby element renderowa\u0142 si\u0119 bezpo\u015brednio w data-container, oddzielony tylko lini\u0105. -->\n <div class=\"space-y-4 ${separatorClass} pb-4\">\n \n <!-- NOWY RZ\u0104D 1: PRZYCISKI AKCJI (POWIEL I USU\u0143) -->\n <div class=\"flex justify-end space-x-2\">\n <!-- PRZYCISK POWIEL (KLONUJ) -->\n <button onclick=\"cloneElement(${element.id})\" \n class=\"clone-btn flex items-center\"\n title=\"Powiel element\">\n <i class=\"fas fa-copy mr-1\"><\/i> Powiel\n <\/button>\n \n <!-- PRZYCISK USUWANIA -->\n <button onclick=\"removeElement(${element.id})\" \n class=\"minimal-delete-btn transition duration-200\"\n title=\"Usu\u0144 element\">\n <span>×<\/span>\n <\/button>\n <\/div>\n\n <!-- RZ\u0104D 2: NAZWA ELEMENTU (teraz ni\u017cej) -->\n <div class=\"w-full\">\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">nazwa elementu<\/label>\n <input type=\"text\" value=\"${nameVal}\" oninput=\"handleElementChange(${element.id}, 'name', this.value)\" \n class=\"input-style bg-white font-bold placeholder-gray-400\" placeholder=\"${placeholder}\">\n <\/div>\n\n <!-- RZ\u0104D 3: KSZTA\u0141T -->\n <div class=\"w-full\">\n <label class=\"block text-sm font-medium text-gray-700 mb-1\">kszta\u0142t<\/label>\n <select onchange=\"handleElementChange(${element.id}, 'shape', this.value)\" class=\"input-style bg-white\">\n <option value=\"rectangle\" ${element.shape === 'rectangle' ? 'selected' : ''}>prostok\u0105t \/ kwadrat<\/option>\n <option value=\"triangle\" ${element.shape === 'triangle' ? 'selected' : ''}>tr\u00f3jk\u0105t<\/option>\n <option value=\"trapezoid\" ${element.shape === 'trapezoid' ? 'selected' : ''}>trapez<\/option>\n <option value=\"circle\" ${element.shape === 'circle' ? 'selected' : ''}>okr\u0105g<\/option>\n <\/select>\n <\/div>\n \n <!-- RZ\u0104D 4: WYMIARY -->\n <div class=\"grid ${dimGridClass} gap-4\" id=\"dims-${element.id}\">\n ${renderDimensionsInputs(element)}\n <\/div>\n <\/div>\n `;\n }).join('');\n }\n\n \/\/ --- WYNIKI UI ---\n\n function updateResultsUI(totalArea, totalWeight, individualResults, error = '') {\n \n \/\/ 1. Wyniki powierzchni poszczeg\u00f3lnych element\u00f3w\n const areaResultsContainer = document.getElementById('individualAreaResults');\n let areaResultsHtml = '';\n \n if (elements.length > 0 && totalArea > 0.0001) {\n areaResultsHtml = elements.map(element => {\n const displayName = element.name || `Element ${element.id}`;\n \/\/ ZMIANA: Usuni\u0119to odniesienie do element.count\n return `\n <div class=\"flex justify-between items-center text-sm border-b border-gray-100 pb-1\">\n <span class=\"text-gray-700\">${displayName}:<\/span>\n <span class=\"font-semibold text-base\">${element.area.toFixed(2)} cm\u00b2<\/span>\n <\/div>\n `;\n }).join('');\n \n \/\/ DODANIE CA\u0141KOWITEJ POWIERZCHNI W NOWYM STYLU\n areaResultsHtml += `\n <div class=\"flex justify-between items-center text-base pt-2 border-t border-gray-400 mt-2\">\n <span class=\"font-bold text-gray-900\">Ca\u0142kowita powierzchnia:<\/span>\n <span class=\"font-extrabold text-xl text-black\">${totalArea.toFixed(2)} cm\u00b2<\/span>\n <\/div>\n `;\n \n areaResultsContainer.innerHTML = areaResultsHtml;\n\n } else {\n areaResultsContainer.innerHTML = `<p class=\"text-gray-500 text-sm\">Wprowad\u017a wymiary element\u00f3w projektu.<\/p>`;\n }\n\n \/\/ 2. Zu\u017cycie w\u0142\u00f3czek\n const yarnResultsContainer = document.getElementById('individualYarnResults');\n \n \/\/ OBS\u0141UGA B\u0141\u0118DU WALIDACJI\n if (error) {\n yarnResultsContainer.innerHTML = `<p class=\"text-gray-500 text-sm\">${error}<\/p>`;\n return; \n }\n\n if (individualResults.length > 0 && totalWeight > 0.0001) { \n let resultsHtml = individualResults.map(result => {\n const skeinsNeeded = result.skeinsNeeded;\n const skeinsToBuy = Math.ceil(skeinsNeeded);\n \n const weightPerSkeinDisplay = (result.weightPerSkein === 0) ? '?' : result.weightPerSkein.toFixed(0);\n const displayName = result.name;\n\n return `\n <div class=\"space-y-1 pb-2 border-b border-gray-200\">\n <!-- Nazwa W\u0142\u00f3czki (Najwa\u017cniejsza) -->\n <div class=\"flex justify-between items-center pt-1\">\n <span class=\"font-bold text-base text-gray-900\">${displayName}<\/span>\n <\/div>\n \n <!-- Wynik w gramach (Podobnie jak linia wyniku powierzchni) -->\n <div class=\"flex justify-between items-center text-sm\">\n <span class=\"text-gray-700\">Szacowane zu\u017cycie (g):<\/span>\n <span class=\"font-semibold text-base\">${result.weight.toFixed(2)} g<\/span>\n <\/div>\n \n <!-- Wynik w motkach (Pogrubiony) -->\n <div class=\"flex justify-between items-center text-sm\">\n <span class=\"text-gray-700\">Motki do zakupu (${weightPerSkeinDisplay} g):<\/span>\n <span class=\"font-extrabold text-lg text-black\">${skeinsToBuy} szt.<\/span>\n <\/div>\n \n <!-- Dok\u0142adna liczba motk\u00f3w (Ma\u0142y tekst z prawej) -->\n <div class=\"text-right text-xs text-gray-500 pb-1\">\n (dok\u0142adnie: ${skeinsNeeded.toFixed(2)} motka\/motk\u00f3w)\n <\/div>\n <\/div>\n `;\n }).join('');\n \n \/\/ DODANIE CA\u0141KOWITEJ WAGI W NOWYM STYLU\n resultsHtml += `\n <div class=\"flex justify-between items-center text-base pt-2 border-t border-gray-400 mt-2\">\n <span class=\"font-bold text-gray-900\">Ca\u0142kowite zu\u017cycie (g):<\/span>\n <span class=\"font-extrabold text-xl text-black\">${totalWeight.toFixed(2)} g<\/span>\n <\/div>\n `;\n\n yarnResultsContainer.innerHTML = resultsHtml;\n } else {\n \/\/ Je\u015bli nie ma b\u0142\u0119du, ale wyniki s\u0105 zerowe (np. brak wagi pr\u00f3bki)\n yarnResultsContainer.innerHTML = `<p class=\"text-gray-500 text-sm\">Wprowad\u017a dane w\u0142\u00f3czek i pr\u00f3bki, aby zobaczy\u0107 zu\u017cycie.<\/p>`;\n }\n }\n\n <\/script>\n<\/body>\n<\/html>\n\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cc9895b elementor-widget elementor-widget-spacer\" data-id=\"cc9895b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a56c63c e-con-full e-flex e-con e-parent\" data-id=\"a56c63c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f29f8cb elementor-widget elementor-widget-heading\" data-id=\"f29f8cb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">masz ochot\u0119 podzierga\u0107? sprawd\u017a moje wzory<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"woocommerce elementor-element elementor-element-592ec41 elementor-grid-4 elementor-grid-mobile-2 elementor-grid-tablet-2 elementor-widget elementor-widget-loop-grid\" data-id=\"592ec41\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_skin":"product","template_id":48958,"columns":4,"row_gap":{"unit":"px","size":0,"sizes":[]},"columns_mobile":2,"columns_tablet":"2","edit_handle_selector":"[data-elementor-type=\\"loop-item\\"]","row_gap_tablet":{"unit":"px","size":"","sizes":[]},"row_gap_mobile":{"unit":"px","size":"","sizes":[]}}\" data-widget_type=\"loop-grid.product\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-loop-container elementor-grid\" role=\"list\">\n\t\t<style id=\"loop-48958\">.elementor-48958 .elementor-element.elementor-element-d5256ce{--display:flex;--gap:010px 0px;--row-gap:010px;--column-gap:0px;}.elementor-widget-theme-post-featured-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-48958 .elementor-element.elementor-element-d380504 img{max-width:100%;}.elementor-widget-woocommerce-product-title .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-48958 .elementor-element.elementor-element-ffec51d{text-align:start;}.elementor-48958 .elementor-element.elementor-element-ffec51d .elementor-heading-title{font-family:\"Roboto\", Sans-serif;font-size:13px;font-weight:500;letter-spacing:0.2px;color:#202020;}.elementor-48958 .elementor-element.elementor-element-8ac4dc7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--margin-top:-10px;--margin-bottom:0px;--margin-left:-10px;--margin-right:0px;}.elementor-48958 .elementor-element.elementor-element-8ac4dc7.e-con{--flex-grow:0;--flex-shrink:0;}.woocommerce .elementor-widget-woocommerce-product-price .price{color:var( --e-global-color-primary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-48958 .elementor-element.elementor-element-954ed25{text-align:start;}.woocommerce .elementor-48958 .elementor-element.elementor-element-954ed25 .price{color:#202020;font-family:\"Lora\", Sans-serif;font-size:11px;font-weight:600;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-48958 .elementor-element.elementor-element-c6fe9a3 .elementor-icon-wrapper{text-align:center;}.elementor-48958 .elementor-element.elementor-element-c6fe9a3.elementor-view-stacked .elementor-icon{background-color:#202020;}.elementor-48958 .elementor-element.elementor-element-c6fe9a3.elementor-view-framed .elementor-icon, .elementor-48958 .elementor-element.elementor-element-c6fe9a3.elementor-view-default .elementor-icon{color:#202020;border-color:#202020;}.elementor-48958 .elementor-element.elementor-element-c6fe9a3.elementor-view-framed .elementor-icon, .elementor-48958 .elementor-element.elementor-element-c6fe9a3.elementor-view-default .elementor-icon svg{fill:#202020;}.elementor-48958 .elementor-element.elementor-element-c6fe9a3 .elementor-icon{font-size:18px;}.elementor-48958 .elementor-element.elementor-element-c6fe9a3 .elementor-icon svg{height:18px;}@media(max-width:1024px){.elementor-48958 .elementor-element.elementor-element-8ac4dc7{--margin-top:-10px;--margin-bottom:0px;--margin-left:-10px;--margin-right:0px;}}@media(max-width:767px){.elementor-48958 .elementor-element.elementor-element-d5256ce{--width:100%;--justify-content:center;}.elementor-48958 .elementor-element.elementor-element-8ac4dc7{--width:105%;--justify-content:space-between;--flex-wrap:nowrap;--margin-top:-10px;--margin-bottom:0px;--margin-left:-10px;--margin-right:0px;}.elementor-48958 .elementor-element.elementor-element-c6fe9a3 .elementor-icon{font-size:18px;}.elementor-48958 .elementor-element.elementor-element-c6fe9a3 .elementor-icon svg{height:18px;}}<\/style>\t\t<div data-elementor-type=\"loop-item\" data-elementor-id=\"48958\" class=\"elementor elementor-48958 e-loop-item e-loop-item-19753 post-19753 product type-product status-publish has-post-thumbnail product_cat-swetry-i-kardigany product_cat-wzor-na-drutach-po-polsku product_cat-wzory-na-drutach product_shipping_class-cyfrowa first instock sale downloadable virtual taxable purchasable product-type-simple\" data-elementor-post-type=\"elementor_library\" data-custom-edit-handle=\"1\">\n\t\t\t<div class=\"elementor-element elementor-element-d5256ce e-con-full e-flex e-con e-parent\" data-id=\"d5256ce\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d380504 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image\" data-id=\"d380504\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-featured-image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/handmadestateofmind.com\/en\/product\/sweter-keep-it-cozy-wzor-na-drutach\/\">\n\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"1000\" src=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?fit=800%2C1000&ssl=1\" class=\"attachment-large size-large wp-image-50163\" alt=\"\" srcset=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?w=1600&ssl=1 1600w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?resize=240%2C300&ssl=1 240w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?resize=819%2C1024&ssl=1 819w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?resize=768%2C960&ssl=1 768w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?resize=1229%2C1536&ssl=1 1229w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?resize=10%2C12&ssl=1 10w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?resize=300%2C375&ssl=1 300w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-6514.jpg?resize=600%2C750&ssl=1 600w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ffec51d elementor-widget elementor-widget-woocommerce-product-title elementor-page-title elementor-widget-heading\" data-id=\"ffec51d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"product_title entry-title elementor-heading-title elementor-size-default\"><a href=\"https:\/\/handmadestateofmind.com\/en\/product\/sweter-keep-it-cozy-wzor-na-drutach\/\">Sweter Keep It Cozy<\/a><\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8ac4dc7 e-con-full e-flex e-con e-child\" data-id=\"8ac4dc7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-954ed25 elementor-widget elementor-widget-woocommerce-product-price\" data-id=\"954ed25\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-price.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<p class=\"price\"><span class=\"woocommerce-Price-amount amount\"><bdi>35.00 <span class=\"woocommerce-Price-currencySymbol\">zł<\/span><\/bdi><\/span><\/p>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c6fe9a3 elementor-view-default elementor-widget elementor-widget-icon\" data-id=\"c6fe9a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/handmadestateofmind.com\/en\/product\/sweter-keep-it-cozy-wzor-na-drutach\/\">\n\t\t\t<i aria-hidden=\"true\" class=\"far fa-arrow-alt-circle-right\"><\/i>\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-elementor-type=\"loop-item\" data-elementor-id=\"48958\" class=\"elementor elementor-48958 e-loop-item e-loop-item-32587 post-32587 product type-product status-publish has-post-thumbnail product_cat-akcesoria product_cat-wzor-na-drutach-po-polsku product_cat-wzory-na-drutach product_shipping_class-cyfrowa instock sale downloadable virtual taxable purchasable product-type-simple\" data-elementor-post-type=\"elementor_library\" data-custom-edit-handle=\"1\">\n\t\t\t<div class=\"elementor-element elementor-element-d5256ce e-con-full e-flex e-con e-parent\" data-id=\"d5256ce\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d380504 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image\" data-id=\"d380504\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-featured-image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/handmadestateofmind.com\/en\/product\/kaptur-merah-wzor-na-drutach\/\">\n\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"1001\" src=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?fit=800%2C1001&ssl=1\" class=\"attachment-large size-large wp-image-50116\" alt=\"\" srcset=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?w=1500&ssl=1 1500w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?resize=240%2C300&ssl=1 240w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?resize=818%2C1024&ssl=1 818w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?resize=768%2C961&ssl=1 768w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?resize=1227%2C1536&ssl=1 1227w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?resize=10%2C12&ssl=1 10w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?resize=300%2C375&ssl=1 300w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-0525-e1755961784698.jpg?resize=600%2C751&ssl=1 600w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ffec51d elementor-widget elementor-widget-woocommerce-product-title elementor-page-title elementor-widget-heading\" data-id=\"ffec51d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"product_title entry-title elementor-heading-title elementor-size-default\"><a href=\"https:\/\/handmadestateofmind.com\/en\/product\/kaptur-merah-wzor-na-drutach\/\">Kaptur Merah<\/a><\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8ac4dc7 e-con-full e-flex e-con e-child\" data-id=\"8ac4dc7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-954ed25 elementor-widget elementor-widget-woocommerce-product-price\" data-id=\"954ed25\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-price.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<p class=\"price\"><span class=\"woocommerce-Price-amount amount\"><bdi>35.00 <span class=\"woocommerce-Price-currencySymbol\">zł<\/span><\/bdi><\/span><\/p>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c6fe9a3 elementor-view-default elementor-widget elementor-widget-icon\" data-id=\"c6fe9a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/handmadestateofmind.com\/en\/product\/kaptur-merah-wzor-na-drutach\/\">\n\t\t\t<i aria-hidden=\"true\" class=\"far fa-arrow-alt-circle-right\"><\/i>\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-elementor-type=\"loop-item\" data-elementor-id=\"48958\" class=\"elementor elementor-48958 e-loop-item e-loop-item-27543 post-27543 product type-product status-publish has-post-thumbnail product_cat-kurs-masterclass-po-polsku product_cat-kursy-masterclass product_cat-swetry-i-kardigany product_cat-wzory-na-drutach product_shipping_class-cyfrowa last instock sale downloadable virtual taxable purchasable product-type-simple\" data-elementor-post-type=\"elementor_library\" data-custom-edit-handle=\"1\">\n\t\t\t<div class=\"elementor-element elementor-element-d5256ce e-con-full e-flex e-con e-parent\" data-id=\"d5256ce\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d380504 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image\" data-id=\"d380504\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-featured-image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/handmadestateofmind.com\/en\/product\/kardigan-roni-kurs-masterclass\/\">\n\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"1000\" src=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?fit=800%2C1000&ssl=1\" class=\"attachment-large size-large wp-image-27435\" alt=\"\" srcset=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?w=2316&ssl=1 2316w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=240%2C300&ssl=1 240w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=819%2C1024&ssl=1 819w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=768%2C960&ssl=1 768w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=1229%2C1536&ssl=1 1229w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=1638%2C2048&ssl=1 1638w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=1200%2C1500&ssl=1 1200w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=300%2C375&ssl=1 300w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2023\/04\/img_5058.jpg?resize=600%2C750&ssl=1 600w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ffec51d elementor-widget elementor-widget-woocommerce-product-title elementor-page-title elementor-widget-heading\" data-id=\"ffec51d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"product_title entry-title elementor-heading-title elementor-size-default\"><a href=\"https:\/\/handmadestateofmind.com\/en\/product\/kardigan-roni-kurs-masterclass\/\">Kardigan Roni | Masterclass<\/a><\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8ac4dc7 e-con-full e-flex e-con e-child\" data-id=\"8ac4dc7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-954ed25 elementor-widget elementor-widget-woocommerce-product-price\" data-id=\"954ed25\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-price.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<p class=\"price\"><span class=\"woocommerce-Price-amount amount\"><bdi>69.00 <span class=\"woocommerce-Price-currencySymbol\">zł<\/span><\/bdi><\/span><\/p>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c6fe9a3 elementor-view-default elementor-widget elementor-widget-icon\" data-id=\"c6fe9a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/handmadestateofmind.com\/en\/product\/kardigan-roni-kurs-masterclass\/\">\n\t\t\t<i aria-hidden=\"true\" class=\"far fa-arrow-alt-circle-right\"><\/i>\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div data-elementor-type=\"loop-item\" data-elementor-id=\"48958\" class=\"elementor elementor-48958 e-loop-item e-loop-item-22495 post-22495 product type-product status-publish has-post-thumbnail product_cat-swetry-i-kardigany product_cat-wzor-na-drutach-po-polsku product_cat-wzory-na-drutach product_shipping_class-cyfrowa first instock sale downloadable virtual taxable purchasable product-type-simple\" data-elementor-post-type=\"elementor_library\" data-custom-edit-handle=\"1\">\n\t\t\t<div class=\"elementor-element elementor-element-d5256ce e-con-full e-flex e-con e-parent\" data-id=\"d5256ce\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d380504 elementor-widget elementor-widget-theme-post-featured-image elementor-widget-image\" data-id=\"d380504\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"theme-post-featured-image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/handmadestateofmind.com\/en\/product\/sweter-chill-out-wzor-na-drutach\/\">\n\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"1000\" src=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?fit=800%2C1000&ssl=1\" class=\"attachment-large size-large wp-image-50101\" alt=\"\" srcset=\"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?w=1600&ssl=1 1600w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?resize=240%2C300&ssl=1 240w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?resize=819%2C1024&ssl=1 819w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?resize=768%2C960&ssl=1 768w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?resize=1229%2C1536&ssl=1 1229w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?resize=10%2C12&ssl=1 10w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?resize=300%2C375&ssl=1 300w, https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/08\/tezza-1246.jpg?resize=600%2C750&ssl=1 600w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ffec51d elementor-widget elementor-widget-woocommerce-product-title elementor-page-title elementor-widget-heading\" data-id=\"ffec51d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"product_title entry-title elementor-heading-title elementor-size-default\"><a href=\"https:\/\/handmadestateofmind.com\/en\/product\/sweter-chill-out-wzor-na-drutach\/\">Sweter Chill Out<\/a><\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8ac4dc7 e-con-full e-flex e-con e-child\" data-id=\"8ac4dc7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-954ed25 elementor-widget elementor-widget-woocommerce-product-price\" data-id=\"954ed25\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"woocommerce-product-price.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<p class=\"price\"><span class=\"woocommerce-Price-amount amount\"><bdi>35.00 <span class=\"woocommerce-Price-currencySymbol\">zł<\/span><\/bdi><\/span><\/p>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c6fe9a3 elementor-view-default elementor-widget elementor-widget-icon\" data-id=\"c6fe9a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<a class=\"elementor-icon\" href=\"https:\/\/handmadestateofmind.com\/en\/product\/sweter-chill-out-wzor-na-drutach\/\">\n\t\t\t<i aria-hidden=\"true\" class=\"far fa-arrow-alt-circle-right\"><\/i>\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Kalkulator Zu\u017cycia W\u0142\u00f3czki Kalkulator Zu\u017cycia W\u0142\u00f3czki Oblicz ile w\u0142\u00f3czki zu\u017cyje Tw\u00f3j projekt* 1. Dane pr\u00f3bki Wprowad\u017a dane swojej pr\u00f3bki. wi\u0119cej informacji Wykonaj pr\u00f3bk\u0119 u\u017cywaj\u0105c kombinacji w\u0142\u00f3czki, drut\u00f3w oraz \u015bciegu z jakich zamierzasz wykona\u0107 projekt. Zmierz i zwa\u017c swoj\u0105 pr\u00f3bk\u0119, a nast\u0119pnie uzupe\u0142nij dane. Podaj na ilu nitkach przerabiany jest projekt, np. je\u015bli u\u017cywasz 1 nitki […]<\/p>\n","protected":false},"author":184526190,"featured_media":52911,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"jetpack_post_was_ever_published":false,"footnotes":""},"class_list":["post-52774","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Kalkulator zu\u017cycia w\u0142\u00f3czki - HANDMADE state of mind<\/title>\n<meta name=\"description\" content=\"Zastanawiasz si\u0119 ile w\u0142\u00f3czki potrzebujesz na sweter lub czapk\u0119? Policz to przy u\u017cyciu mojego kalkulatora zu\u017cycia w\u0142\u00f3czki.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/handmadestateofmind.com\/en\/kalkulator-zuzycia-wloczki\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Kalkulator zu\u017cycia w\u0142\u00f3czki - HANDMADE state of mind\" \/>\n<meta property=\"og:description\" content=\"Zastanawiasz si\u0119 ile w\u0142\u00f3czki potrzebujesz na sweter lub czapk\u0119? Policz to przy u\u017cyciu mojego kalkulatora zu\u017cycia w\u0142\u00f3czki.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/handmadestateofmind.com\/en\/kalkulator-zuzycia-wloczki\/\" \/>\n<meta property=\"og:site_name\" content=\"HANDMADE state of mind\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-17T15:45:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/handmadestateofmind.com\/wp-content\/uploads\/2025\/11\/tezza-3411.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"2000\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/\",\"url\":\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/\",\"name\":\"Kalkulator zu\u017cycia w\u0142\u00f3czki - HANDMADE state of mind\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/handmadestateofmind.com\\\/wp-content\\\/uploads\\\/2025\\\/11\\\/tezza-3411.jpg?fit=1600%2C2000&ssl=1\",\"datePublished\":\"2025-11-11T17:11:25+00:00\",\"dateModified\":\"2025-11-17T15:45:45+00:00\",\"description\":\"Zastanawiasz si\u0119 ile w\u0142\u00f3czki potrzebujesz na sweter lub czapk\u0119? Policz to przy u\u017cyciu mojego kalkulatora zu\u017cycia w\u0142\u00f3czki.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/handmadestateofmind.com\\\/wp-content\\\/uploads\\\/2025\\\/11\\\/tezza-3411.jpg?fit=1600%2C2000&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/handmadestateofmind.com\\\/wp-content\\\/uploads\\\/2025\\\/11\\\/tezza-3411.jpg?fit=1600%2C2000&ssl=1\",\"width\":1600,\"height\":2000,\"caption\":\"Edited in Tezza with: Cocoa, Grain, & Crop\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/kalkulator-zuzycia-wloczki\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/handmadestateofmind.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Kalkulator zu\u017cycia w\u0142\u00f3czki\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/#website\",\"url\":\"https:\\\/\\\/handmadestateofmind.com\\\/\",\"name\":\"HANDMADE state of mind\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/handmadestateofmind.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/#organization\",\"name\":\"HANDMADE state of mind\",\"url\":\"https:\\\/\\\/handmadestateofmind.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/handmadestateofmind.com\\\/wp-content\\\/uploads\\\/2020\\\/06\\\/logo-2.png?fit=360%2C100&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/handmadestateofmind.com\\\/wp-content\\\/uploads\\\/2020\\\/06\\\/logo-2.png?fit=360%2C100&ssl=1\",\"width\":360,\"height\":100,\"caption\":\"HANDMADE state of mind\"},\"image\":{\"@id\":\"https:\\\/\\\/handmadestateofmind.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Kalkulator zu\u017cycia w\u0142\u00f3czki - HANDMADE state of mind","description":"Zastanawiasz si\u0119 ile w\u0142\u00f3czki potrzebujesz na sweter lub czapk\u0119? Policz to przy u\u017cyciu mojego kalkulatora zu\u017cycia w\u0142\u00f3czki.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/handmadestateofmind.com\/en\/kalkulator-zuzycia-wloczki\/","og_locale":"en_GB","og_type":"article","og_title":"Kalkulator zu\u017cycia w\u0142\u00f3czki - HANDMADE state of mind","og_description":"Zastanawiasz si\u0119 ile w\u0142\u00f3czki potrzebujesz na sweter lub czapk\u0119? Policz to przy u\u017cyciu mojego kalkulatora zu\u017cycia w\u0142\u00f3czki.","og_url":"https:\/\/handmadestateofmind.com\/en\/kalkulator-zuzycia-wloczki\/","og_site_name":"HANDMADE state of mind","article_modified_time":"2025-11-17T15:45:45+00:00","og_image":[{"width":1600,"height":2000,"url":"https:\/\/handmadestateofmind.com\/wp-content\/uploads\/2025\/11\/tezza-3411.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Estimated reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/","url":"https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/","name":"Kalkulator zu\u017cycia w\u0142\u00f3czki - HANDMADE state of mind","isPartOf":{"@id":"https:\/\/handmadestateofmind.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/#primaryimage"},"image":{"@id":"https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/11\/tezza-3411.jpg?fit=1600%2C2000&ssl=1","datePublished":"2025-11-11T17:11:25+00:00","dateModified":"2025-11-17T15:45:45+00:00","description":"Zastanawiasz si\u0119 ile w\u0142\u00f3czki potrzebujesz na sweter lub czapk\u0119? Policz to przy u\u017cyciu mojego kalkulatora zu\u017cycia w\u0142\u00f3czki.","breadcrumb":{"@id":"https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/#primaryimage","url":"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/11\/tezza-3411.jpg?fit=1600%2C2000&ssl=1","contentUrl":"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2025\/11\/tezza-3411.jpg?fit=1600%2C2000&ssl=1","width":1600,"height":2000,"caption":"Edited in Tezza with: Cocoa, Grain, & Crop"},{"@type":"BreadcrumbList","@id":"https:\/\/handmadestateofmind.com\/kalkulator-zuzycia-wloczki\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/handmadestateofmind.com\/"},{"@type":"ListItem","position":2,"name":"Kalkulator zu\u017cycia w\u0142\u00f3czki"}]},{"@type":"WebSite","@id":"https:\/\/handmadestateofmind.com\/#website","url":"https:\/\/handmadestateofmind.com\/","name":"HANDMADE state of mind","description":"","publisher":{"@id":"https:\/\/handmadestateofmind.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/handmadestateofmind.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Organization","@id":"https:\/\/handmadestateofmind.com\/#organization","name":"HANDMADE state of mind","url":"https:\/\/handmadestateofmind.com\/","logo":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/handmadestateofmind.com\/#\/schema\/logo\/image\/","url":"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2020\/06\/logo-2.png?fit=360%2C100&ssl=1","contentUrl":"https:\/\/i0.wp.com\/handmadestateofmind.com\/wp-content\/uploads\/2020\/06\/logo-2.png?fit=360%2C100&ssl=1","width":360,"height":100,"caption":"HANDMADE state of mind"},"image":{"@id":"https:\/\/handmadestateofmind.com\/#\/schema\/logo\/image\/"}}]}},"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/pages\/52774","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/users\/184526190"}],"replies":[{"embeddable":true,"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/comments?post=52774"}],"version-history":[{"count":100,"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/pages\/52774\/revisions"}],"predecessor-version":[{"id":53000,"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/pages\/52774\/revisions\/53000"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/media\/52911"}],"wp:attachment":[{"href":"https:\/\/handmadestateofmind.com\/en\/wp-json\/wp\/v2\/media?parent=52774"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}