/* -------------------------------- */ /* START ADD TOP BAR */ /* -------------------------------- */ document.addEventListener("appLoaded", function () { // Step 1: Create the top bar div and prepend it to #view-header const topBar = document.createElement('div'); topBar.className = 'top-bar'; document.querySelector('#view-header').prepend(topBar); // Step 2: Create sub-divs for left and right sections const topBarLeft = document.createElement('div'); topBarLeft.className = 'top-bar-left'; const topBarRight = document.createElement('div'); topBarRight.className = 'top-bar-right'; topBar.appendChild(topBarLeft); topBar.appendChild(topBarRight); // Step 3: Create a link with an image in the .top-bar-left const link = document.createElement('a'); link.classList.add("districtLink"); link.href = 'https://www.scuc.txed.net/scucisd'; // Change the URL to your desired link const image = document.createElement('img'); image.src = 'https://cmsv2-shared-assets.apptegy.net/Schools/Decatur-City-Schools-2175/images/DCSLogo.png'; // Change src to your desired image URL image.alt = "DECATUR CITY SCHOOLS"; link.appendChild(image); topBarLeft.appendChild(link); // Step 4: Clone and append social media elements to .top-bar-right const socialMediaLinks = document.querySelector('#cms-footer .footer-social-links').cloneNode(true); topBarRight.appendChild(socialMediaLinks); }); /* -------------------------------- */ /* END ADD TOP BAR */ /* -------------------------------- */ /* -------------------------------- */ /* START Custom Spotlight V1 with diamonds */ /* -------------------------------- */ document.addEventListener('appLoaded', () => { const spotlightV1Slider = document.querySelector('.spotlight-v1-slider'); if (!spotlightV1Slider) return; // Exit early if the element doesn't exist // Add 'swiper-slide' class to graduate slides const graduateSlides = spotlightV1Slider.querySelectorAll('.spotlight-v1-wrapper > div'); graduateSlides.forEach(slide => slide.classList.add('swiper-slide')); // SVG markup const svgMarkup = `

`; // Add SVG markup to graduate images const graduateImages = spotlightV1Slider.querySelectorAll('.graduate-image'); graduateImages.forEach(image => image.insertAdjacentHTML('beforeend', svgMarkup)); // Initialize Swiper new Swiper(spotlightV1Slider, { slidesPerView: 1, loop: false, grabCursor: false, slideToClickedSlide: true, centeredSlides: true, rewind: true, navigation: { nextEl: '.js-custom-spotlight-v1-arrow-next', prevEl: '.js-custom-spotlight-v1-arrow-prev', }, breakpoints: { 768: { slidesPerView: 3, spaceBetween: 20, allowTouchMove: false, initialSlide: 1, }, 2100: { slidesPerView: 5, spaceBetween: 30, initialSlide: 2, }, }, }); }); /* -------------------------------- */ /* END Custom Spotlight V1 with diamonds */ /* -------------------------------- */

Decatur City Schools

Our Mission

Events

Spotlight