add cookies
This commit is contained in:
13
src/js/cookie-consent.js
Normal file
13
src/js/cookie-consent.js
Normal file
@@ -0,0 +1,13 @@
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Проверяем, дал ли пользователь согласие ранее
|
||||
if (!localStorage.getItem('cookie_consent_accepted')) {
|
||||
const banner = document.getElementById('cookie-consent-banner');
|
||||
banner.style.display = 'block';
|
||||
|
||||
document.getElementById('cookie-consent-accept').addEventListener('click', function() {
|
||||
// Сохраняем согласие в localStorage
|
||||
localStorage.setItem('cookie_consent_accepted', 'true');
|
||||
banner.style.display = 'none';
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -1,11 +1,11 @@
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
document.querySelectorAll('[aria-label]').forEach(el => {
|
||||
// если tooltip уже задан вручную — не трогаем
|
||||
// Выбираем все элементы [aria-label] только внутри .share-panel-buttons
|
||||
document.querySelectorAll('.share-panel-buttons [aria-label]').forEach(el => {
|
||||
if (el.classList.contains('has-tooltip')) return;
|
||||
|
||||
|
||||
const label = el.getAttribute('aria-label');
|
||||
if (!label) return;
|
||||
|
||||
|
||||
el.classList.add('has-tooltip');
|
||||
el.setAttribute('data-title', label);
|
||||
});
|
||||
|
||||
@@ -10,7 +10,9 @@ import './styles/components/social.css'
|
||||
import './styles/components/subscripts.css'
|
||||
import './styles/components/pagination.css'
|
||||
import './styles/components/post-tags.css'
|
||||
import './styles/components/cookie-consent.css'
|
||||
|
||||
import './js/cookie-consent.js'
|
||||
import './js/current-datetime.js'
|
||||
import './js/mobilemenu.js'
|
||||
import './js/js-copy-link.js'
|
||||
@@ -21,3 +23,4 @@ import './js/tooltip.js'
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
40
src/styles/components/cookie-consent.css
Normal file
40
src/styles/components/cookie-consent.css
Normal file
@@ -0,0 +1,40 @@
|
||||
.cookie-consent {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: #000;
|
||||
color: #fff;
|
||||
padding: 15px;
|
||||
z-index: 9999;
|
||||
box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
|
||||
text-align: center;
|
||||
opacity: .82;
|
||||
}
|
||||
|
||||
|
||||
.cookie-consent-content {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.cookie-consent-button {
|
||||
background: red;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 8px 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
.cookie-consent-button:hover {
|
||||
background-color: color-mix(in srgb, red 90%, black 10%);
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
@@ -43,6 +43,7 @@
|
||||
background-color: #E2E2E2;
|
||||
}
|
||||
|
||||
|
||||
.social-icon-vk{
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='36' height='36' rx='10' fill='%23006842'/%3E%3Cpath d='M18.8932 25C12.06 25 8.1624 20.1201 8 12H11.4229C11.5353 17.96 14.0587 20.4845 16.0575 21.005V12H19.2805V17.1401C21.2542 16.9189 23.3279 14.5766 24.0275 12H27.2505C26.9869 13.3363 26.4614 14.6015 25.7069 15.7166C24.9524 16.8317 23.9852 17.7726 22.8657 18.4805C24.1153 19.1273 25.2191 20.0428 26.1041 21.1666C26.9891 22.2904 27.6353 23.597 28 25H24.4522C24.1248 23.7814 23.4594 22.6905 22.5394 21.8641C21.6194 21.0376 20.4858 20.5125 19.2805 20.3544V25H18.8932Z' fill='white'/%3E%3C/svg%3E");
|
||||
}
|
||||
@@ -73,6 +74,7 @@
|
||||
|
||||
|
||||
|
||||
|
||||
.has-tooltip{ position:relative; }
|
||||
|
||||
.has-tooltip::after{
|
||||
|
||||
@@ -11,4 +11,32 @@
|
||||
border-radius: 10px;
|
||||
padding: 8px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.btn_sub_social:hover{
|
||||
border: 2px solid red;
|
||||
color: red;
|
||||
}
|
||||
|
||||
|
||||
.subscripts-promo{
|
||||
display: flex;
|
||||
margin: 18px 0;
|
||||
gap: 4px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn_sub_social_wh{
|
||||
display: inline-block;
|
||||
border: 2px solid white;
|
||||
color: white;
|
||||
margin-right: 5px;
|
||||
border-radius: 10px;
|
||||
padding: 8px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.btn_sub_social_wh:hover{
|
||||
border: 2px solid red;
|
||||
color: red;
|
||||
}
|
||||
|
||||
@@ -81,7 +81,7 @@ header {
|
||||
}
|
||||
|
||||
.sportpressa-logo IMG{
|
||||
width: 40px;
|
||||
width: 35px;
|
||||
}
|
||||
|
||||
.redword{
|
||||
@@ -186,7 +186,7 @@ footer{
|
||||
position: absolute;
|
||||
right: 20%;
|
||||
top: 0;
|
||||
transform: translate(-40%,-70%);
|
||||
transform: translate(-50%,-50%);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -207,6 +207,14 @@ footer{
|
||||
|
||||
@media (max-width: 768px) {
|
||||
|
||||
.desc{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mob{
|
||||
display: block;
|
||||
}
|
||||
|
||||
body{
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
@@ -234,6 +242,10 @@ footer{
|
||||
content: none;
|
||||
}
|
||||
|
||||
.site-header::after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.sportpressa-logo {
|
||||
font-size: 2rem;
|
||||
font-weight: bold;
|
||||
|
||||
Reference in New Issue
Block a user