{"id":6670,"date":"2026-01-23T15:23:30","date_gmt":"2026-01-23T12:23:30","guid":{"rendered":"https:\/\/ba.edu.sa\/?page_id=6670"},"modified":"2026-01-25T11:24:48","modified_gmt":"2026-01-25T08:24:48","slug":"%d8%a7%d9%84%d9%85%d8%b9%d8%b1%d8%b6","status":"publish","type":"page","link":"https:\/\/ba.edu.sa\/ar\/%d8%a7%d9%84%d9%85%d8%b9%d8%b1%d8%b6\/","title":{"rendered":"Gallery"},"content":{"rendered":"\n<div class=\"wp-block-uagb-container uagb-block-9cb16298 alignfull uagb-is-root-container\"><div class=\"uagb-container-inner-blocks-wrap\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<div class=\"wp-block-uagb-advanced-heading uagb-block-6474a04d\"><h3 class=\"uagb-heading-text\">\u0627\u0644\u0645\u0639\u0631\u0636<\/h3><\/div>\n<\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-uagb-container uagb-block-vtqyhhlx alignfull uagb-is-root-container\">\n<div class=\"wp-block-uagb-container uagb-block-5379afef\">\n<style>\n    :root {\n        --primary-blue: #1d3557;\n        --accent-gold: #b89241; \/* \u0644\u0648\u0646 \u0630\u0647\u0628\u064a \u0645\u0644\u0643\u064a *\/\n        --white: #ffffff;\n        --smooth: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);\n    }\n\n    \/* \u0633\u0643\u0634\u0646 \u0627\u0644\u0635\u0648\u0631 \u0627\u0644\u0645\u0637\u0648\u0651\u0631 *\/\n    .wp-custom-gallery {\n        display: grid;\n        grid-template-columns: repeat(4, 1fr);\n        gap: 30px;\n        padding:20px;\n        margin: 0 auto;\n        background: #fdfdfd;\n    }\n\n    .wp-img-card {\n        position: relative;\n        height: 380px;\n        border-radius: 24px;\n        overflow: hidden;\n        cursor: pointer;\n        background: #eee;\n        transition: var(--smooth);\n        \/* \u0638\u0644 \u0646\u0627\u0639\u0645 \u062c\u062f\u0627\u064b \u0641\u064a \u0627\u0644\u062d\u0627\u0644\u0629 \u0627\u0644\u0639\u0627\u062f\u064a\u0629 *\/\n        box-shadow: 0 10px 30px rgba(0,0,0,0.05);\n    }\n\n    .wp-img-card img {\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        transition: var(--smooth);\n    }\n\n    \/* \u062a\u0623\u062b\u064a\u0631 \u0627\u0644\u0640 Hover \u0627\u0644\u062c\u0630\u0627\u0628 *\/\n    .wp-img-card:hover {\n        transform: translateY(-12px); \/* \u0631\u0641\u0639\u0629 \u0628\u0633\u064a\u0637\u0629 \u0644\u0644\u0623\u0639\u0644\u0649 *\/\n        box-shadow: 0 25px 50px rgba(29, 53, 87, 0.2);\n    }\n\n    .wp-img-card:hover img {\n        transform: scale(1.15) rotate(1deg); \/* \u062a\u0643\u0628\u064a\u0631 \u0645\u0639 \u062f\u0648\u0631\u0627\u0646 \u0628\u0633\u064a\u0637 \u062c\u062f\u0627\u064b *\/\n        filter: brightness(0.8) contrast(1.1);\n    }\n\n    \/* \u0637\u0628\u0642\u0629 \u0632\u062c\u0627\u062c\u064a\u0629 \u062a\u0638\u0647\u0631 \u0639\u0646\u062f \u0627\u0644\u062a\u0645\u0631\u064a\u0631 *\/\n    .wp-img-card::after {\n        content: '';\n        position: absolute;\n        inset: 0;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        background: linear-gradient(to top, rgba(29, 53, 87, 0.7), transparent);\n        color: white;\n        font-weight: 600;\n        font-size: 1.1rem;\n        opacity: 0;\n        transition: var(--smooth);\n        transform: translateY(20px);\n    }\n\n    .wp-img-card:hover::after {\n        opacity: 1;\n        transform: translateY(0);\n    }\n\n    \/* \u0646\u0627\u0641\u0630\u0629 \u0627\u0644\u0640 Popup \u0627\u0644\u0627\u062d\u062a\u0631\u0627\u0641\u064a\u0629 *\/\n    #customPopupOverlay {\n        position: fixed !important;\n        inset: 0 !important;\n        width: 100vw !important;\n        height: 100vh !important;\n        background: rgba(10, 15, 25, 0.92) !important;\n        display: none;\n        justify-content: center;\n        align-items: center;\n        z-index: 9999999 !important;\n        backdrop-filter: blur(12px);\n        animation: fadeIn 0.4s ease;\n    }\n\n    @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }\n\n    .wp-popup-content {\n        position: relative;\n        width: 90%;\n        height: 90%;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n    }\n\n    #wpPopupImg {\n        max-width: 100%;\n        max-height: 80vh;\n        object-fit: contain;\n        border: 4px solid rgba(255,255,255,0.1);\n        border-radius: 15px;\n        box-shadow: 0 30px 60px rgba(0,0,0,0.5);\n        transform: scale(0.9);\n        animation: scaleUp 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;\n    }\n\n    @keyframes scaleUp { to { transform: scale(1); } }\n\n    \/* \u0623\u0632\u0631\u0627\u0631 \u0627\u0644\u062a\u0646\u0642\u0644 \u0628\u0634\u0643\u0644 \u0639\u0635\u0631\u064a *\/\n    .wp-close {\n        position: absolute;\n        top: 30px; left: 40px;\n        color: white; font-size: 40px;\n        cursor: pointer; z-index: 1000001;\n        transition: 0.3s;\n    }\n    .wp-close:hover { color: var(--accent-gold); transform: rotate(90deg); }\n\n    .wp-nav-btn {\n        position: absolute;\n        top: 50%; transform: translateY(-50%);\n        background: rgba(255, 255, 255, 0.1);\n        backdrop-filter: blur(5px);\n        border: 1px solid rgba(255, 255, 255, 0.2);\n        width: 60px; height: 60px;\n        border-radius: 50%;\n        cursor: pointer;\n        color: white; font-size: 24px;\n        transition: 0.3s;\n        z-index: 1000002;\n    }\n    .wp-nav-btn:hover { background: var(--accent-gold); border-color: var(--accent-gold); }\n\n    .wp-prev { right: 40px; }\n    .wp-next { left: 40px; }\n\n    #wpCounter {\n        color: white;\n        margin-top: 25px;\n        background: rgba(255, 255, 255, 0.1);\n        border: 1px solid rgba(255, 255, 255, 0.2);\n        padding: 8px 25px;\n        border-radius: 30px;\n        font-family: monospace;\n        letter-spacing: 2px;\n    }\n@media screen and (max-width:991px) {\n        .wp-custom-gallery { grid-template-columns: repeat(2, 1fr); }\n    \n}\n    @media (max-width: 768px) {\n        .wp-nav-btn { bottom: 40px; top: auto; width: 50px; height: 50px; }\n        .wp-prev { right: 30%; }\n        .wp-next { left: 30%; }\n        .wp-custom-gallery { grid-template-columns: repeat(1, 1fr); }\n    }\n<\/style>\n\n<div class=\"wp-custom-gallery\" id=\"wpGalleryGrid\"><\/div>\n\n<div id=\"customPopupOverlay\">\n    <span class=\"wp-close\">&times;<\/span>\n    <button class=\"wp-nav-btn wp-prev\" title=\"\u0627\u0644\u0633\u0627\u0628\u0642\u0629\">&#10095;<\/button>\n    <div class=\"wp-popup-content\" id=\"wpPopupContent\">\n        <img decoding=\"async\" src=\"\" id=\"wpPopupImg\">\n        <div id=\"wpCounter\">01 \/ 26<\/div>\n    <\/div>\n    <button class=\"wp-nav-btn wp-next\" title=\"\u0627\u0644\u062a\u0627\u0644\u064a\u0629\">&#10094;<\/button>\n<\/div>\n\n<script>\n    (function() {\n        const images = [\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.41-PM-300x225.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.41-PM-1-300x225.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.40-PM-300x225.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.40-PM-2-300x225.jpeg\",\n\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.37-PM-225x300.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.37-PM-1-300x225.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.36-PM-2-300x225.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.36-PM-1-225x300.jpeg\",\n\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.35-PM-225x300.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.34-PM-300x225.jpeg\",\n\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.33-PM-300x225.jpeg\",\n            \"https:\/\/ba.edu.sa\/wp-content\/uploads\/2026\/01\/WhatsApp-Image-2026-01-08-at-6.25.33-PM-2-300x225.jpeg\"\n        ];\n\n        function toHighRes(url) { return url.replace(\/-\\d+x\\d+(?=\\.(jpg|jpeg|png|gif))\/i, \"\"); }\n        const highResImages = images.map(toHighRes);\n        \n        const grid = document.getElementById('wpGalleryGrid');\n        const overlay = document.getElementById('customPopupOverlay');\n        const pImg = document.getElementById('wpPopupImg');\n        const counter = document.getElementById('wpCounter');\n        let currentIdx = 0;\n\n        highResImages.forEach((url, i) => {\n            const card = document.createElement('div');\n            card.className = 'wp-img-card';\n            card.innerHTML = `<img decoding=\"async\" src=\"${url}\" loading=\"lazy\" alt=\"Gallery Image\">`;\n            card.onclick = () => open(i);\n            grid.appendChild(card);\n        });\n\n        function open(i) {\n            currentIdx = i;\n            update();\n            overlay.style.display = 'flex';\n            document.body.style.overflow = 'hidden';\n        }\n\n        function update() {\n            pImg.style.opacity = '0';\n            pImg.src = highResImages[currentIdx];\n            counter.innerText = `${(currentIdx + 1).toString().padStart(2, '0')} \/ ${highResImages.length}`;\n            pImg.onload = () => pImg.style.opacity = '1';\n        }\n\n        function close() {\n            overlay.style.display = 'none';\n            document.body.style.overflow = 'auto';\n        }\n\n        document.querySelector('.wp-close').onclick = close;\n        document.querySelector('.wp-prev').onclick = (e) => { e.stopPropagation(); currentIdx = (currentIdx + 1) % highResImages.length; update(); };\n        document.querySelector('.wp-next').onclick = (e) => { e.stopPropagation(); currentIdx = (currentIdx - 1 + highResImages.length) % highResImages.length; update(); };\n        \n        overlay.onclick = (e) => { if(e.target === overlay || e.target.id === 'wpPopupContent') close(); };\n        pImg.onclick = (e) => e.stopPropagation();\n\n        document.addEventListener('keydown', (e) => {\n            if(overlay.style.display === 'flex') {\n                if(e.key === 'Escape') close();\n                if(e.key === 'ArrowLeft') document.querySelector('.wp-next').click();\n                if(e.key === 'ArrowRight') document.querySelector('.wp-prev').click();\n            }\n        });\n    })();\n<\/script>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-uagb-container uagb-block-lfpgteru alignfull uagb-is-root-container\"><div class=\"uagb-container-inner-blocks-wrap\">\n<div class=\"wp-block-uagb-info-box uagb-block-qmmo4bje uagb-infobox__content-wrap  uagb-infobox-icon-above-title uagb-infobox-image-valign-top\"><div class=\"uagb-ifb-content\"><div class=\"uagb-ifb-title-wrap\"><p class=\"uagb-ifb-title-prefix\">\u0643\u0646 \u0639\u0644\u064a \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627<\/p><h2 class=\"uagb-ifb-title\">\u0644\u0646\u0635\u0646\u0639 \u0634\u064a\u0626\u0627 \u0645\u0639\u0627<\/h2><\/div><p class=\"uagb-ifb-desc\">\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0644\u0627\u0633\u062a\u0643\u0634\u0627\u0641 \u0643\u064a\u0641 \u064a\u0645\u0643\u0646\u0646\u0627 \u062a\u062d\u0648\u064a\u0644 \u0631\u0624\u064a\u062a\u0643 \u0625\u0644\u0649 \u0648\u0627\u0642\u0639. \u0627\u0646\u0636\u0645 \u0625\u0644\u064a\u0646\u0627 \u0641\u064a \u0635\u064a\u0627\u063a\u0629 \u0627\u0644\u0645\u0633\u062a\u0642\u0628\u0644.<\/p><\/div><\/div>\n\n\n\n<div class=\"wp-block-uagb-buttons uagb-buttons__outer-wrap uagb-btn__default-btn uagb-btn-tablet__default-btn uagb-btn-mobile__default-btn uagb-block-jbcto3ly\"><div class=\"uagb-buttons__wrap uagb-buttons-layout-wrap \">\n<div class=\"wp-block-uagb-buttons-child uagb-buttons__outer-wrap uagb-block-968a6142 wp-block-button\"><div class=\"uagb-button__wrapper\"><a class=\"uagb-buttons-repeater wp-block-button__link\" aria-label=\"\" href=\"contact\/\" rel=\"follow noopener\" target=\"_self\" role=\"button\"><div class=\"uagb-button__link\">\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627<\/div><\/a><\/div><\/div>\n<\/div><\/div>\n<\/div><\/div>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u0627\u0644\u0645\u0639\u0631\u0636 &times; &#10095; 01 \/ 26 &#10094;<\/p>\n","protected":false},"author":7,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"unboxed","site-sidebar-style":"unboxed","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":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"enabled","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":""}},"footnotes":""},"class_list":["post-6670","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"Abdelrahman Developer","author_link":"https:\/\/ba.edu.sa\/ar\/author\/abdoahmed132001gmail-com\/"},"uagb_comment_info":0,"uagb_excerpt":"\u0627\u0644\u0645\u0639\u0631\u0636 &times; &#10095; 01 \/ 26 &#10094;","_links":{"self":[{"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/pages\/6670","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/comments?post=6670"}],"version-history":[{"count":19,"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/pages\/6670\/revisions"}],"predecessor-version":[{"id":6743,"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/pages\/6670\/revisions\/6743"}],"wp:attachment":[{"href":"https:\/\/ba.edu.sa\/ar\/wp-json\/wp\/v2\/media?parent=6670"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}