Руслан Дасаев

расстояние от боков карточки до боков экрана может отличаться

Если карточка лежит в контейнере-центровщике, то расстояние до краев вьюпорта можно посчитать как 50vw - 50%. В этом случае нужно еще учесть ширину скроллбара, которую придется определять в js.

Focusmate

Разумнее всего обсудить с заказчиком и дизайнером идею, что тексты под картинкой должны быть независимы от текста в оставшихся 2х колонках. Благо первый столбец и так вполне обособлен.
И показывать так как на макете только на очень ограниченной ширине окна, а на остальных перестраивать вариантами попроще.

Из того, что пришло в голову:

Дальше можно дорабатывать, считая высоту и делая так, чтобы картинка не уходила из второго столбика.
Или по сценарию выше, перестраивать через media в другую раскладку.

Проще всего display: grid + подложка на svg и медиа-запросами переключать подложки.

Для блока, в котором происходит скролл, замени min-height на height

Вместе с данными должен лежать какой-то флаг. И в шаблоне, на основе этого флага выводить тот или иной текст.
Например вот так


Или Текст для кнопки должен лежать вместе с данными. По какому-то событию этот текст менять. Вынес в отдельный класс для удобства.

Зачем вам это?
Можете использовать объекты:

const lotteries = {
  1: lottery1Display,
  2: lottery2Display,
};
lotteries[LotType](1, [], 0, []);

Ace

.field__case:hover::before {
    content: '';
    display: block;
    background: #ffeb00;
    position: absolute;
    width: 100%;
    height: 100%;
    /* remove if not needed */
    transform: translate3d(0, -5px, 0);
    opacity: 0.3;
    cursor: pointer;
}

Вроде то, что спрашивают. Сохранение нажатия на поле можно имитировать добавлением класса .is-active, например.

document.querySelector('#bet').oninput = function(e){
    var s = e.target.value;
    s = s.replace(/([^0-9.,]|^[.,]*|[.,]*$)/g,'').replace(/,/g,'.');
    var parts = s.split('.');
    e.target.value = parts.slice(0,-1).join('') + '.' + parts.slice(-1);
}

Забыли передать current в setTimeout, должно быть так:

setTimeout((current) => pika[current].classList.toggle('active'), 100, current)

UPD. А вообще, не очень понятно, зачем этот setTimeout нужен. Можно просто вырезать его.

Потому что после создания новых кнопок вы добавляется только один обработчик события.
Внутри ваших обработчиков должно быть

clone.querySelector('.btn-add').addEventListener('click', addHandler);
clone.querySelector('.btn-delete').addEventListener('click', addHand);

Вы забыли добавить второй обработчик. Вот тут ваш пример, только с добавлением всех событий

Вы добавляете скрываемому элементу класс, переключающий свойство display, одновременно с классом, который задаёт изменение прозрачности - поэтому пронаблюдать последнее вы не успеваете. Переключайте display после того, как анимация будет завершена - для этого можно подписаться на событие transitionend. Например.

Посмотри, Я попробовал сделать и без js:
Вот код

в условии попробуй get_field использовать

Здравствуйте.

Самый простой способ прописать путь полностью /wp-content/themes/ПАПКА_ТЕМЫ/img/arrow-left.png

Если с помощью средств WordPress — передать путь с помощью функции wp_localize_script.
Примерно так:

add_action( 'wp_enqueue_scripts', 'action_function_name_7714', 99 );
function action_function_name_7714(){
	wp_localize_script( 'jquery', 'mytheme', array( 
		'template_url' => get_template_directory_uri(), 
	) );
}

и затем получить в js

$('.feedback__carousel').owlCarousel({
      loop: true,
      nav: true,
      smartSpeed: 900,
      navText: ['<img src="' + mytheme.template_url + '/img/arrow-left.png" alt="Стрелка влево">','<img src="' + mytheme.template_url + '/img/arrow-left.png" alt="Стрелка вправо">'],
    });