{"id":22541,"date":"2025-05-16T11:35:17","date_gmt":"2025-05-16T09:35:17","guid":{"rendered":"http:\/\/sionbartoszyce.pl\/?page_id=22541"},"modified":"2025-06-06T09:48:55","modified_gmt":"2025-06-06T07:48:55","slug":"pracownie","status":"publish","type":"page","link":"http:\/\/sionbartoszyce.pl\/en\/pracownie\/","title":{"rendered":"PRACOWNIE"},"content":{"rendered":"<style>\n.pracownie-wrapper {\n  display: flex;\n  width: 100%;\n  height: 300px;\n  overflow: hidden;\n  background: black;\n}\n\n.pracownia {\n  flex: 1;\n  position: relative;\n  transition: flex 0.4s ease, filter 0.4s ease;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);\n  cursor: pointer;\n}\n\n.pracownia img {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  filter: grayscale(100%) brightness(0.7);\n  transition: filter 0.4s ease, transform 0.4s ease;\n  z-index: 0;\n  transform: scale(1);\n}\n\n.pracownia:hover img, .pracownia.hovered img {\n  filter: grayscale(0%) brightness(1);\n  transform: scale(1.05);\n}\n\n.pracownia:hover, .pracownia.hovered {\n  flex: 3;\n  z-index: 2;\n}\n\n.pracownie-wrapper:hover .pracownia:not(:hover):not(.hovered) {\n  flex: 0.5;\n}\n\n.pracownia span {\n  position: relative;\n  z-index: 1;\n  color: white;\n  font-size: 1.1em;\n  font-weight: bold;\n  text-align: center;\n  text-shadow: 1px 1px 5px black;\n  padding: 10px;\n  pointer-events: none;\n  transition: transform 0.3s ease;\n}\n\n.pracownia:hover span, .pracownia.hovered span {\n  transform: scale(1.1);\n}\n\n@media (max-width: 768px) {\n  .pracownie-wrapper {\n    flex-direction: column;\n    height: auto;\n  }\n\n  .pracownia {\n    clip-path: none;\n    flex: none;\n    height: 150px;\n    margin: 2px 0;\n    transition: height 0.4s ease, filter 0.4s ease;\n  }\n\n  .pracownia:hover, .pracownia.hovered {\n    height: 250px;\n    flex: none;\n  }\n\n  .pracownie-wrapper:hover .pracownia:not(:hover):not(.hovered) {\n    flex: none;\n    height: 100px;\n  }\n}\n<\/style>\n\n<div class=\"pracownie-wrapper\">\n  <div class=\"pracownia\" data-href=\"http:\/\/sionbartoszyce.pl\/pracownia-artystyczna\/\">\n    <img decoding=\"async\" src=\"https:\/\/samart.pl\/wp-content\/uploads\/2020\/11\/grafika-rastrowa-przyklad-1-1-1024x446.jpg\" alt=\"\">\n    <span>Pracownia artystyczna<\/span>\n  <\/div>\n  <div class=\"pracownia\" data-href=\"http:\/\/sionbartoszyce.pl\/pracownia-gospodarstwa-domowego\/\">\n    <img decoding=\"async\" src=\"http:\/\/sionbartoszyce.pl\/wp-content\/gallery\/pracownia-gospodarstwa-domowego\/DSC_0551.JPG\" alt=\"\">\n    <span>Pracownia gospodarstwa domowego<\/span>\n  <\/div>\n  <div class=\"pracownia\" data-href=\"http:\/\/sionbartoszyce.pl\/pracownia-komputerowa\/\">\n    <img decoding=\"async\" src=\"https:\/\/samart.pl\/wp-content\/uploads\/2020\/11\/grafika-rastrowa-przyklad-1-1-1024x446.jpg\" alt=\"\">\n    <span>Pracownia komputerowa<\/span>\n  <\/div>\n  <div class=\"pracownia\" data-href=\"http:\/\/sionbartoszyce.pl\/pracownia-krawiecka\/\">\n    <img decoding=\"async\" src=\"http:\/\/sionbartoszyce.pl\/wp-content\/gallery\/pracownia-krawiecka\/DSC_0576.JPG\" alt=\"\">\n    <span>Pracownia krawiecka<\/span>\n  <\/div>\n  <div class=\"pracownia\" data-href=\"http:\/\/sionbartoszyce.pl\/pracownia-modelarska\/\">\n    <img decoding=\"async\" src=\"http:\/\/sionbartoszyce.pl\/wp-content\/gallery\/modelarnia\/494574606_1439474350767436_6347616898338897798_n.jpg\" alt=\"\">\n    <span>Pracownia modelarska<\/span>\n  <\/div>\n  <div class=\"pracownia\" data-href=\"http:\/\/sionbartoszyce.pl\/pracownia-zaradnosci-osobistej-i-treningu-ekonomicznego\/\">\n    <img decoding=\"async\" src=\"http:\/\/sionbartoszyce.pl\/wp-content\/gallery\/pracownia-zaradnosci-osobistej-i-treningu-ekonomicznego\/DSC_0517.JPG\" alt=\"\">\n    <span>Pracownia zaradno\u015bci osobistej i treningu ekonomicznego<\/span>\n  <\/div>\n  <div class=\"pracownia\" data-href=\"http:\/\/sionbartoszyce.pl\/sala-rehabilitacyjna\/\">\n    <img decoding=\"async\" src=\"http:\/\/sionbartoszyce.pl\/wp-content\/gallery\/sala-rehabilitacyjna\/DSC_0611.JPG\" alt=\"\">\n    <span>Sala rehabilitacyjna<\/span>\n  <\/div>\n<\/div>\n\n<script>\n  const pracownieWrapper = document.querySelector('.pracownie-wrapper');\n  const pracownie = document.querySelectorAll('.pracownia');\n  let isMobile = window.matchMedia(\"(max-width: 768px)\").matches;\n  let activePracownia = null;\n  let clickTimer = null;\n\n  \/\/ Obs\u0142uga zmian rozmiaru okna\n  window.addEventListener('resize', () => {\n    isMobile = window.matchMedia(\"(max-width: 768px)\").matches;\n    if (!isMobile && activePracownia) {\n      activePracownia.classList.remove('hovered');\n      activePracownia = null;\n    }\n  });\n\n  \/\/ Funkcja do obs\u0142ugi klikni\u0119cia\n  function handlePracowniaClick(e) {\n    const pracownia = e.currentTarget;\n    \n    if (isMobile) {\n      \/\/ Je\u015bli ju\u017c aktywna, przejd\u017a do linku\n      if (activePracownia === pracownia) {\n        window.location.href = pracownia.dataset.href;\n        return;\n      }\n      \n      \/\/ Anuluj poprzedni timer je\u015bli istnieje\n      if (clickTimer) {\n        clearTimeout(clickTimer);\n        clickTimer = null;\n      }\n      \n      \/\/ Usu\u0144 klas\u0119 hovered z innych element\u00f3w\n      pracownie.forEach(p => {\n        if (p !== pracownia) p.classList.remove('hovered');\n      });\n      \n      \/\/ Dodaj klas\u0119 hovered do aktualnego elementu\n      pracownia.classList.add('hovered');\n      activePracownia = pracownia;\n      \n      \/\/ Ustaw timer na automatyczne zresetowanie po 3 sekundach bez dzia\u0142ania\n      clickTimer = setTimeout(() => {\n        pracownia.classList.remove('hovered');\n        activePracownia = null;\n        clickTimer = null;\n      }, 3000);\n    } else {\n      \/\/ Na desktopie od razu przejd\u017a do linku\n      window.location.href = pracownia.dataset.href;\n    }\n  }\n\n  \/\/ Dodaj event listeners\n  pracownie.forEach(pracownia => {\n    pracownia.addEventListener('click', handlePracowniaClick);\n    \n    \/\/ Dodatkowe touch event dla lepszej responsywno\u015bci na mobile\n    pracownia.addEventListener('touchend', function(e) {\n      if (isMobile) {\n        e.preventDefault();\n        handlePracowniaClick(e);\n      }\n    }, { passive: false });\n  });\n\n  \/\/ Klikni\u0119cie poza obszarem pracowni resetuje stan\n  document.addEventListener('click', function(e) {\n    if (isMobile && activePracownia && !pracownieWrapper.contains(e.target)) {\n      activePracownia.classList.remove('hovered');\n      activePracownia = null;\n      if (clickTimer) {\n        clearTimeout(clickTimer);\n        clickTimer = null;\n      }\n    }\n  });\n<\/script>\n\n\n\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>Pracownia artystyczna Pracownia gospodarstwa domowego Pracownia komputerowa Pracownia krawiecka Pracownia modelarska Pracownia zaradno\u015bci osobistej i treningu ekonomicznego Sala rehabilitacyjna<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ngg_post_thumbnail":0,"footnotes":""},"class_list":["post-22541","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages\/22541","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/comments?post=22541"}],"version-history":[{"count":20,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages\/22541\/revisions"}],"predecessor-version":[{"id":22953,"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/pages\/22541\/revisions\/22953"}],"wp:attachment":[{"href":"http:\/\/sionbartoszyce.pl\/en\/wp-json\/wp\/v2\/media?parent=22541"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}