How to remove the notification counter?

Question

css

document.querySelector('.button-offer-a').addEventListener('click', function(){
    var count = Number(el.getAttribute('data-count')) || 0;
    el.setAttribute('data-count', count + 1);
    el.classList.remove('notify');
    el.offsetWidth = el.offsetWidth;
    el.classList.add('notify');
    if(count >= 0){
        el.classList.add('show-count');
        $('.notif-block-notZero').css('display','flex');
        $('.notif-block-zero').css('display','none');
        $('.notif-block-notZero').css('overflow-y','scroll');
        var todos = $('.todo-list').html();
        localStorage.setItem('todos',todos)
    }
    if(count == 0 ){
        $('.notif-block-zero').css('display','flex');
        $('.notif-block-notZero').css('display','none');
        $('.show-count').attr('data-content','bar').fadeOut('slow');
    }
}, false);

Answer 1

These are standard features of a mobile browser. However, it contradicts the canons of mobile design - the text should be clearly visible to the user of the mobile device immediately, without any taps. Accordingly, sites where there is such an opportunity are most likely not adapted for mobile.
I don’t even know if it’s worth trying to achieve this effect. Any additional action that the user needs to take will be annoying. In addition, it is not always obvious, not everyone knows that a double tap has such an effect. Here you need to either teach the user, or, again, immediately do it so that everything can be seen without taps.

Answer 2

use bootstrap grid during layout