https://petrolina.pe.gov.br/wp-content/themes/Newspaper/alfa_components/js/politica-de-privacidade-template.js

1//Beggin Accordion Mobile (Informações importantes)
2const accordionContent = document.querySelectorAll('.main_privacy_policy .privacy_content_box .content .accordion_content');
3const accordionTitle = document.querySelectorAll('.main_privacy_policy .privacy_content_box .content .accordion_title');
4const contentAll = document.querySelectorAll('.main_privacy_policy .privacy_content_box .content');
5
6contentAll.forEach((content, index) => {
7    content.classList.add('active');
8    content.addEventListener('click', () => {
9        accordionTitle[index].classList.toggle('active');
10        accordionContent[index].classList.toggle('active');
11
12        removeOpenMobile(index);
13    })
14})
15
16//Fecha todos os outros cards quando é clicado numa posição diferente da atual.
17function removeOpenMobile(index) {
18    accordionContent.forEach((content2, index2) => {
19        if(index != index2) {
20            content2.classList.remove("active");
21
22            accordionTitle[index2].classList.remove("active");
23        }
24    })
25}
26
27//End Accordion Mobile
28
29function checkScreenWidth() {
30    const screenWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
31
32    if (screenWidth <= 1023) {
33
34        contentAll.forEach(content => {
35            content.classList.add('active');
36        });
37
38    } else {
39
40        //Navegação por guias
41        const tabsPrivacy = document.querySelectorAll('.main_privacy_policy .privacy_tabs .link');
42
43        tabsPrivacy.forEach((tab, index) => {
44            
45            //Adicionando a primeira posição como ativa
46            contentAll.forEach(content => {content.classList.remove("active")})
47            contentAll[0].classList.add("active");
48
49            var lineHover = document.querySelector('.main_privacy_policy .privacy_tabs .linehover');
50            tab.addEventListener('click', (e) => {
51                tabsPrivacy.forEach(tab => {tab.classList.remove("active")})
52                tab.classList.add("active");
53
54                var line = document.querySelector('.main_privacy_policy .privacy_tabs .line');
55                line.style.width = e.target.offsetWidth + "px";
56                line.style.left = e.target.offsetLeft + "px";
57
58                contentAll.forEach(content => {content.classList.remove("active")})
59                contentAll[index].classList.add("active");
60            })
61
62            tab.addEventListener('mouseover', (e) => {
63                lineHover.style.display = "block";
64                lineHover.style.width = e.target.offsetWidth + "px";
65                lineHover.style.left = e.target.offsetLeft + "px";
66
67                if (tab.classList.contains("active")) {
68                    lineHover.style.display = "none";
69                }
70            })
71
72            tab.addEventListener('mouseout', () => {
73                lineHover.style.display = "none";
74            })
75        })
76    }
77
78}
79
80checkScreenWidth();
81window.addEventListener('resize', checkScreenWidth);
82
83//Accordion Desktop e Mobile (Significado dos Cookies)
84const accordion = document.querySelectorAll(".cookies_mean .accordion");
85
86accordion.forEach((accord, index) => {
87    accord.addEventListener('click', () => {
88        accord.classList.toggle('active');
89
90        removeOpen(index);
91    })
92})
93
94function removeOpen(index) {
95    accordion.forEach((accord2, index2) => {
96        if (index != index2) {
97            accord2.classList.remove("active");
98        }
99    })
100}