{"id":5540,"date":"2026-05-06T15:33:26","date_gmt":"2026-05-06T13:33:26","guid":{"rendered":"https:\/\/milczas.pl\/?page_id=5540"},"modified":"2026-07-29T23:50:46","modified_gmt":"2026-07-29T21:50:46","slug":"dokumentygalerie","status":"publish","type":"page","link":"https:\/\/rod-borowka.pl\/nowy_panel\/dokumentygalerie\/","title":{"rendered":"dokumentygalerie"},"content":{"rendered":"\n<meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>ROD &#8211; Dokumenty i Galeria<\/title>\n    <!-- Biblioteka ikon FontAwesome -->\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0\/css\/all.min.css\">\n    \n    <style>\n        \/* --- KONFIGURACJA KOLOR\u00d3W --- *\/\n        :root {\n            --primary-green: #2e7d32;\n            --light-green: #f1f8e9;\n            --border-color: #c8e6c9;\n            --bg-color: #f5f5f5;\n            --text-color: #333;\n        }\n\n        \/* --- RESET I BODY --- *\/\n        body {\n            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n            background-color: var(--bg-color);\n            margin: 0;\n            padding: 0;\n            color: var(--text-color);\n        }\n\n        \/* --- KONTENER G\u0141\u00d3WNY (Poprawione centrowanie) --- *\/\n        .container {\n            max-width: 1200px;\n            margin: 0 auto;\n            padding: 40px 20px 100px 20px;\n            display: flex;\n            gap: 25px;\n            flex-wrap: wrap;\n            justify-content: center;\n            align-items: flex-start;\n        }\n\n        \/* --- STYL POJEDYNCZEJ KARTY --- *\/\n        .card {\n            flex: 1;\n            min-width: 300px;\n            max-width: 550px;\n            background: white;\n            border-radius: 12px;\n            padding: 25px;\n            box-shadow: 0 4px 15px rgba(0,0,0,0.05);\n            border: 1px solid #eee;\n            box-sizing: border-box;\n        }\n\n        h2 {\n            color: var(--primary-green);\n            border-bottom: 2px solid var(--primary-green);\n            padding-bottom: 10px;\n            margin-top: 0;\n            display: flex;\n            align-items: center;\n            gap: 12px;\n            font-size: 1.3em;\n        }\n\n        \/* --- SEKCJA DOKUMENTY --- *\/\n        .doc-section {\n            display: flex;\n            flex-direction: column;\n            gap: 15px;\n            margin-top: 20px;\n        }\n\n        .btn-download {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            background-color: var(--light-green);\n            color: var(--primary-green);\n            padding: 15px 20px;\n            text-decoration: none;\n            border-radius: 8px;\n            border: 1px solid var(--border-color);\n            font-weight: 600;\n            transition: all 0.3s ease;\n        }\n\n        .btn-download:hover {\n            background-color: var(--primary-green);\n            color: white;\n            transform: translateY(-2px);\n            box-shadow: 0 4px 12px rgba(46, 125, 50, 0.2);\n        }\n\n        .btn-label {\n            display: flex;\n            align-items: center;\n            gap: 15px;\n        }\n\n        \/* --- SEKCJA GALERIA --- *\/\n        .gallery-grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));\n            gap: 20px;\n            margin-top: 20px;\n        }\n\n        .gallery-folder {\n            text-align: center;\n            cursor: pointer;\n            transition: transform 0.3s ease;\n            text-decoration: none; \/* Dodane dla obs\u0142ugi link\u00f3w *\/\n        }\n\n        .gallery-folder:hover { transform: translateY(-5px); }\n\n        .img-wrapper {\n            position: relative;\n            width: 100%;\n            padding-top: 75%;\n            overflow: hidden;\n            border-radius: 10px;\n            border: 3px solid white;\n            box-shadow: 0 3px 8px rgba(0,0,0,0.15);\n        }\n\n        .img-wrapper img {\n            position: absolute;\n            top: 0; left: 0; width: 100%; height: 100%;\n            object-fit: cover;\n        }\n\n        .folder-title {\n            display: block;\n            margin-top: 10px;\n            font-size: 0.9em;\n            font-weight: 600;\n            color: #555;\n        }\n\n        \/* --- TWOJA IKONA POWROTU (P\u0142ywaj\u0105ca) --- *\/\n        .btn-home-sub {\n            position: fixed;\n            bottom: 30px;\n            right: 30px;\n            width: 60px;\n            height: 60px;\n            background-color: var(--primary-green);\n            color: white;\n            border-radius: 50%;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            text-decoration: none;\n            font-size: 30px;\n            box-shadow: 0 5px 15px rgba(0,0,0,0.3);\n            transition: all 0.3s ease;\n            z-index: 1000;\n            line-height: 1;\n        }\n\n        .btn-home-sub:hover {\n            background-color: #1b5e20;\n            transform: scale(1.1);\n        }\n\n        \/* --- MOBILNO\u015a\u0106 (RWD) --- *\/\n        @media (max-width: 768px) {\n            .container {\n                flex-direction: column;\n                align-items: center;\n            }\n            .card {\n                width: 100%;\n                max-width: 100%;\n            }\n            .btn-home-sub {\n                bottom: 20px;\n                right: 20px;\n                width: 55px;\n                height: 55px;\n                font-size: 26px;\n            }\n        }\n    <\/style>\n\n\n\n<!-- PRZYCISK POWROTU -->\n<a href=\"\/nowy_panel\/\" class=\"btn-home-sub\" title=\"Powr\u00f3t do strony g\u0142\u00f3wnej\">&#x1f3e0;<\/a>\n\n<div class=\"container\">\n    \n    <!-- LEWY BOKS: DOKUMENTY -->\n    <div class=\"card\">\n        <h2><i class=\"fas fa-folder-open\"><\/i> Dokumenty do pobrania<\/h2>\n        <div class=\"doc-section\" id=\"dokumenty-publiczne\">\n    <span style=\"color: #777; font-size: 0.9em;\">\u0141adowanie dokument\u00f3w\u2026<\/span>\n<\/div>\n\n<script>\n(function () {\n    const container = document.getElementById('dokumenty-publiczne');\n\n    if (!container) {\n        return;\n    }\n\n    const iconByExtension = {\n        pdf: 'fa-file-pdf',\n        doc: 'fa-file-word',\n        docx: 'fa-file-word',\n        xls: 'fa-file-excel',\n        xlsx: 'fa-file-excel'\n    };\n\n    fetch('\/nowy_panel\/borowka\/api_dokumenty.php?t=' + new Date().getTime(), {\n        cache: 'no-store'\n    })\n        .then(function (response) {\n            if (!response.ok) {\n                throw new Error('B\u0142\u0105d pobierania dokument\u00f3w');\n            }\n\n            return response.json();\n        })\n        .then(function (data) {\n            const documents = Array.isArray(data.documents) ? data.documents : [];\n            container.textContent = '';\n\n            if (documents.length === 0) {\n                const emptyMessage = document.createElement('span');\n                emptyMessage.style.color = '#777';\n                emptyMessage.style.fontSize = '0.9em';\n                emptyMessage.textContent = 'Obecnie nie ma dokument\u00f3w do pobrania.';\n                container.appendChild(emptyMessage);\n                return;\n            }\n\n            documents.forEach(function (documentData) {\n                const link = document.createElement('a');\n                link.className = 'btn-download';\n                link.href = documentData.url;\n                link.setAttribute('download', '');\n\n                const label = document.createElement('div');\n                label.className = 'btn-label';\n\n                const fileIcon = document.createElement('i');\n                const iconClass = iconByExtension[documentData.extension] || 'fa-file';\n                fileIcon.className = 'fas ' + iconClass + ' fa-lg';\n\n                const title = document.createElement('span');\n                title.textContent = documentData.title;\n\n                const downloadIcon = document.createElement('i');\n                downloadIcon.className = 'fas fa-cloud-download-alt';\n\n                label.appendChild(fileIcon);\n                label.appendChild(title);\n                link.appendChild(label);\n                link.appendChild(downloadIcon);\n                container.appendChild(link);\n            });\n        })\n        .catch(function () {\n            container.textContent = '';\n\n            const errorMessage = document.createElement('span');\n            errorMessage.style.color = '#777';\n            errorMessage.style.fontSize = '0.9em';\n            errorMessage.textContent = 'Dokumenty s\u0105 chwilowo niedost\u0119pne.';\n            container.appendChild(errorMessage);\n        });\n})();\n<\/script>\n    <\/div>\n\n    <!-- PRAWY BOKS: GALERIA -->\n    <div class=\"card\">\n        <h2><i class=\"fas fa-camera-retro\"><\/i> Galeria i Wydarzenia<\/h2>\n        <div class=\"gallery-grid\">\n          <div id=\"galerie-publiczne\" style=\"display: contents;\"><\/div>\n\n<style>\n    .rod-gallery-lightbox {\n        position: fixed;\n        inset: 0;\n        z-index: 999999;\n        display: none;\n        align-items: center;\n        justify-content: center;\n        padding: 24px;\n        background: rgba(0, 0, 0, 0.9);\n    }\n\n    .rod-gallery-lightbox.is-open {\n        display: flex;\n    }\n\n    .rod-gallery-lightbox-content {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        width: min(1100px, 100%);\n        max-height: calc(100vh - 48px);\n    }\n\n    .rod-gallery-lightbox-image {\n        display: block;\n        max-width: 100%;\n        max-height: calc(100vh - 125px);\n        border-radius: 8px;\n        box-shadow: 0 8px 35px rgba(0, 0, 0, 0.55);\n        object-fit: contain;\n    }\n\n    .rod-gallery-lightbox-caption {\n        margin-top: 12px;\n        color: #fff;\n        font-size: 14px;\n        font-weight: 600;\n        text-align: center;\n    }\n\n    .rod-gallery-lightbox-close,\n    .rod-gallery-lightbox-prev,\n    .rod-gallery-lightbox-next {\n        position: absolute;\n        z-index: 2;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border: 0;\n        border-radius: 50%;\n        background: rgba(255, 255, 255, 0.18);\n        color: #fff;\n        cursor: pointer;\n        transition: background 0.2s ease, transform 0.2s ease;\n    }\n\n    .rod-gallery-lightbox-close:hover,\n    .rod-gallery-lightbox-prev:hover,\n    .rod-gallery-lightbox-next:hover {\n        background: rgba(255, 255, 255, 0.32);\n        transform: scale(1.06);\n    }\n\n    .rod-gallery-lightbox-close {\n        top: -15px;\n        right: -15px;\n        width: 44px;\n        height: 44px;\n        font-size: 27px;\n    }\n\n    .rod-gallery-lightbox-prev,\n    .rod-gallery-lightbox-next {\n        top: 50%;\n        width: 50px;\n        height: 50px;\n        font-size: 31px;\n        transform: translateY(-50%);\n    }\n\n    .rod-gallery-lightbox-prev:hover,\n    .rod-gallery-lightbox-next:hover {\n        transform: translateY(-50%) scale(1.06);\n    }\n\n    .rod-gallery-lightbox-prev {\n        left: 10px;\n    }\n\n    .rod-gallery-lightbox-next {\n        right: 10px;\n    }\n\n    .rod-gallery-lightbox button[hidden] {\n        display: none;\n    }\n\n    @media (max-width: 700px) {\n        .rod-gallery-lightbox {\n            padding: 12px;\n        }\n\n        .rod-gallery-lightbox-content {\n            max-height: calc(100vh - 24px);\n        }\n\n        .rod-gallery-lightbox-image {\n            max-height: calc(100vh - 100px);\n        }\n\n        .rod-gallery-lightbox-close {\n            top: 5px;\n            right: 5px;\n        }\n\n        .rod-gallery-lightbox-prev,\n        .rod-gallery-lightbox-next {\n            width: 42px;\n            height: 42px;\n            font-size: 26px;\n        }\n\n        .rod-gallery-lightbox-prev {\n            left: 3px;\n        }\n\n        .rod-gallery-lightbox-next {\n            right: 3px;\n        }\n    }\n<\/style>\n\n<script>\n(function () {\n    const container = document.getElementById('galerie-publiczne');\n\n    if (!container) {\n        return;\n    }\n\n    const overlay = document.createElement('div');\n    overlay.className = 'rod-gallery-lightbox';\n    overlay.setAttribute('role', 'dialog');\n    overlay.setAttribute('aria-modal', 'true');\n    overlay.setAttribute('aria-label', 'Podgl\u0105d galerii zdj\u0119\u0107');\n\n    const content = document.createElement('div');\n    content.className = 'rod-gallery-lightbox-content';\n\n    const image = document.createElement('img');\n    image.className = 'rod-gallery-lightbox-image';\n    image.alt = '';\n\n    const caption = document.createElement('div');\n    caption.className = 'rod-gallery-lightbox-caption';\n\n    const closeButton = document.createElement('button');\n    closeButton.type = 'button';\n    closeButton.className = 'rod-gallery-lightbox-close';\n    closeButton.setAttribute('aria-label', 'Zamknij');\n    closeButton.textContent = '\u00d7';\n\n    const previousButton = document.createElement('button');\n    previousButton.type = 'button';\n    previousButton.className = 'rod-gallery-lightbox-prev';\n    previousButton.setAttribute('aria-label', 'Poprzednie zdj\u0119cie');\n    previousButton.textContent = '\u2039';\n\n    const nextButton = document.createElement('button');\n    nextButton.type = 'button';\n    nextButton.className = 'rod-gallery-lightbox-next';\n    nextButton.setAttribute('aria-label', 'Nast\u0119pne zdj\u0119cie');\n    nextButton.textContent = '\u203a';\n\n    content.appendChild(image);\n    content.appendChild(caption);\n    content.appendChild(closeButton);\n    content.appendChild(previousButton);\n    content.appendChild(nextButton);\n    overlay.appendChild(content);\n    document.body.appendChild(overlay);\n\n    let currentPhotos = [];\n    let currentTitle = '';\n    let currentIndex = 0;\n    let previousBodyOverflow = '';\n\n    function showPhoto(index) {\n        if (currentPhotos.length === 0) {\n            return;\n        }\n\n        currentIndex = (index + currentPhotos.length) % currentPhotos.length;\n        image.src = currentPhotos[currentIndex].full;\n        image.alt = currentTitle;\n        caption.textContent = currentTitle\n            + ' \u2014 '\n            + (currentIndex + 1)\n            + ' \/ '\n            + currentPhotos.length;\n\n        const hasSeveralPhotos = currentPhotos.length > 1;\n        previousButton.hidden = !hasSeveralPhotos;\n        nextButton.hidden = !hasSeveralPhotos;\n    }\n\n    function openGallery(gallery) {\n        currentPhotos = Array.isArray(gallery.photos) ? gallery.photos : [];\n        currentTitle = gallery.title || '';\n\n        if (currentPhotos.length === 0) {\n            return;\n        }\n\n        previousBodyOverflow = document.body.style.overflow;\n        document.body.style.overflow = 'hidden';\n        overlay.classList.add('is-open');\n        showPhoto(0);\n        closeButton.focus();\n    }\n\n    function closeGallery() {\n        overlay.classList.remove('is-open');\n        image.removeAttribute('src');\n        document.body.style.overflow = previousBodyOverflow;\n        currentPhotos = [];\n    }\n\n    closeButton.addEventListener('click', closeGallery);\n    previousButton.addEventListener('click', function () {\n        showPhoto(currentIndex - 1);\n    });\n    nextButton.addEventListener('click', function () {\n        showPhoto(currentIndex + 1);\n    });\n\n    overlay.addEventListener('click', function (event) {\n        if (event.target === overlay) {\n            closeGallery();\n        }\n    });\n\n    document.addEventListener('keydown', function (event) {\n        if (!overlay.classList.contains('is-open')) {\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            closeGallery();\n        } else if (event.key === 'ArrowLeft') {\n            showPhoto(currentIndex - 1);\n        } else if (event.key === 'ArrowRight') {\n            showPhoto(currentIndex + 1);\n        }\n    });\n\n    fetch('\/nowy_panel\/borowka\/api_galerie.php?t=' + new Date().getTime(), {\n        cache: 'no-store'\n    })\n        .then(function (response) {\n            if (!response.ok) {\n                throw new Error('B\u0142\u0105d pobierania galerii');\n            }\n\n            return response.json();\n        })\n        .then(function (data) {\n            const galleries = Array.isArray(data.galleries) ? data.galleries : [];\n            container.textContent = '';\n\n            galleries.forEach(function (gallery) {\n                const galleryLink = document.createElement('a');\n                galleryLink.href = '#';\n                galleryLink.className = 'gallery-folder';\n                galleryLink.setAttribute('aria-label', 'Otw\u00f3rz galeri\u0119 ' + gallery.title);\n\n                const imageWrapper = document.createElement('div');\n                imageWrapper.className = 'img-wrapper';\n\n                const coverImage = document.createElement('img');\n                coverImage.src = gallery.cover;\n                coverImage.alt = gallery.title;\n                coverImage.loading = 'lazy';\n\n                const title = document.createElement('span');\n                title.className = 'folder-title';\n                title.textContent = gallery.title;\n\n                imageWrapper.appendChild(coverImage);\n                galleryLink.appendChild(imageWrapper);\n                galleryLink.appendChild(title);\n\n                galleryLink.addEventListener('click', function (event) {\n                    event.preventDefault();\n                    openGallery(gallery);\n                });\n\n                container.appendChild(galleryLink);\n            });\n        })\n        .catch(function () {\n            container.textContent = '';\n        });\n})();\n<\/script>  \n            <!-- Podpi\u0119ta galeria 2017 przez shortcode -->\n            \n           \n\n \n\n\n\n\n           \n\n        <\/div>\n    <\/div>\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>ROD &#8211; Dokumenty i Galeria &#x1f3e0; Dokumenty do pobrania \u0141adowanie dokument\u00f3w\u2026 Galeria i Wydarzenia<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5540","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/pages\/5540","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/comments?post=5540"}],"version-history":[{"count":29,"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/pages\/5540\/revisions"}],"predecessor-version":[{"id":6039,"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/pages\/5540\/revisions\/6039"}],"wp:attachment":[{"href":"https:\/\/rod-borowka.pl\/nowy_panel\/wp-json\/wp\/v2\/media?parent=5540"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}