@for $i from 0 through 60 {
$angle: 180 / 60 * $i * 1deg;
.radial-progress[data-progress="#{$i}"] .circle-block .fill,
.radial-progress[data-progress="#{$i}"] .circle-block .mask.full {
transform: rotate($angle);
}
.radial-progress[data-progress="#{$i}"] .circle-block .fill.fix {
transform: rotate($angle * 2);
}
.radial-progress[data-progress="#{$i}"] .inset .percentage .numbers {
width: 100%;
}
}
const o = e.target.closest('.blog__item')
const duplicateArray = ['a', 'b', 'c', 'a', 'b', 'c', 'q'];
console.log(
Array.from(new Set(duplicateArray))
);
const duplicateArray = ['a', 'b', 'c', 'a', 'b', 'c', 'q'];
console.log(
duplicateArray.reduce(function (carry, item) {
if (!carry.includes(item)) carry.push(item);
return carry;
}, [])
);
const duplicateArray = ['a', 'b', 'c', 'a', 'b', 'c', 'q'];
console.log(
[...duplicateArray.reduce((carry, item) => [...carry].includes(item) ? carry : carry + item, '')]
);
interface FieldContract {
public function render(Repository $repository): ViewContract;
}
<button class="open" data-target="b1">Open1</button>
<button class="open" data-target="b2">Open2</button>
<div class="hidden-block" id="b1">
<ul>
<li>Первый</li>
</ul>
<button class="close">Close</button>
</div>
<div class="hidden-block" id="b2">
<ul>
<li>Второй</li>
</ul>
<button class="close">Close</button>
</div>
// 1. Константа, значение не меняется
// 2. Это кнопка, а не блок (название фиговое)
// 3. Их может быть несколько на странице
const openButtons = document.querySelectorAll('.open');
// Закрывашка находится внутри блока, поэтому искать ее нужно именно внутри блока
// чтобы она закрывала только свой блок. Это выкидываем
// let backBlock = document.querySelector('.close');
// Вешаем клики на все открывашки
openButtons.forEach(btn => {
btn.addEventListener('click', e => {
// дергаем ID из data-атрибута
const targetId = e.target.dataset.target;
document.getElementById(targetId).classList.add('open-hidden-block');
});
});
// Перебираем все блоки и ищем в них закрывашки
document.querySelectorAll('.hidden-block').forEach(block => {
const closer = block.querySelector('.close');
closer.addEventListener('click', () => {
block.classList.remove('open-hidden-block');
});
});
<?php if (have_rows('gallery')):
$i = 1;
?>
<?php while (have_rows('gallery')): the_row();
$image_big = get_sub_field('image_big'); ?>
<div class="modal fade" id="galleryModal-b-<?php echo $i; ?>" tabindex="-1">
<div class="modal-dialog modal-dialog-centered w-auto">
<div class="modal-content">
<img class="img-fluid mx-auto" src="<?php echo $image_big; ?>"
alt="Image">
<div data-dismiss="modal" style="top:0;right:0;"
class="position-absolute modal-close font-alt fw-600 text-uppercase cursor-pointer z-index-1 text-white">
X Close
</div>
</div>
</div>
</div>
<?php if (have_rows('image_small')):
$j = 1; // Другое название
?>
<?php while (have_rows('image_small')): the_row();
$image = get_sub_field('image');
?>
<div class="modal fade" tabindex="-1"
id="galleryModal-s-<?php echo $i; ?>-<?php echo $j; ?>"> <!-- А здесь двойной индекс -->
<div class="modal-dialog modal-dialog-centered w-auto">
<div class="modal-content">
<img class="img-fluid mx-auto" src="<?php echo $image; ?>"
alt="Image">
<div data-dismiss="modal" style="top:0;right:0;"
class="position-absolute modal-close font-alt fw-600 text-uppercase cursor-pointer z-index-1 text-white">
X Close
</div>
</div>
</div>
</div>
<?php $j++; endwhile; ?> <!-- Другое название -->
<?php endif; ?>
<?php $i++; endwhile; ?>
<?php endif; ?>