generate

в onclick добавить event.stopPropagation();

и слушать клик на body:

document.body.addEventListener('click', () => {
    if (newdiw.classList.contains("active")) newdiw.classList.remove("active");
  });

codepen

Добавьте pointer-events: none; в класс картинки.

https://jsfiddle.net/62a1zLh5/
unwrap(); - убивает родителя, но при этом сохраняет детей.
clid.unwrap();

Ваша тень ограничена самим flex. Как вариант можно просто сделать больше margin блоков от самого flex, думаю с такой тенью 50px будет достаточно.

SELECT * 
FROM `table`
WHERE `field` LIKE 'a%' /*английская*/
OR `field` LIKE 'а%' /*русская*/

Какая кодировка таблицы (полей) ?
Если так сработает (имею ввиду, что найдутся и большие и маленькие), то профит...
Иначе через OR добавляй ещё и большие буквы...

WHERE `text` LIKE 'a%'

Посмотрите в настройках браузера:

Спец. возможности -> Навигация по страницам с помощью курсора

Если включено, то выключите.

Изучите основы позиционирования.
fixed - относительно документа.
absolute - относительно ближайшего не static элемента.
А судя по вопросу Вам стоит посмотреть на position: sticky; bottom: 0;

Вот есть решение на всех известных ботов:

function isBot(&$botname = ''){
/* Эта функция будет проверять, является ли посетитель роботом поисковой системы */
  $bots = array(
    'rambler','googlebot','aport','yahoo','msnbot','turtle','mail.ru','omsktele',
    'yetibot','picsearch','sape.bot','sape_context','gigabot','snapbot','alexa.com',
    'megadownload.net','askpeter.info','igde.ru','ask.com','qwartabot','yanga.co.uk',
    'scoutjet','similarpages','oozbot','shrinktheweb.com','aboutusbot','followsite.com',
    'dataparksearch','google-sitemaps','appEngine-google','feedfetcher-google',
    'liveinternet.ru','xml-sitemaps.com','agama','metadatalabs.com','h1.hrn.ru',
    'googlealert.com','seo-rus.com','yaDirectBot','yandeG','yandex',
    'yandexSomething','Copyscape.com','AdsBot-Google','domaintools.com',
    'Nigma.ru','bing.com','dotnetdotcom'
  );
  foreach($bots as $bot)
    if(stripos($_SERVER['HTTP_USER_AGENT'], $bot) !== false){
      $botname = $bot;
      return true;
    }
  return false;
}

Использование:

if( isBot($bname) ) {
   // Перебрасываем на Москву
}

Там на webgl сделано, и вряд ли есть какие-то готовые библиотеки с именно таким эффектом.
Упрощенный вариант можно сделать с использованием CSS mix-blend-mode

В ноде всё делается элементарно

crypto.createHash('sha1').update(str).digest('latin1'); // raw_output
crypto.createHash('sha1').update(str).digest('base64'); // сразу base64

В браузере чуть сложнее

async function sha1(str) {
    const buf = Uint8Array.from(unescape(encodeURIComponent(str)), c=>c.charCodeAt(0)).buffer;
    const digest = await crypto.subtle.digest('SHA-1', buf);
    const raw = String.fromCharCode.apply(null, new Uint8Array(digest));
    return raw; // 20-символьная строка
    // или
    return btoa(raw); // base64
}

SVG

Обычный jpg внутрь круглого div запихнуть.
Круглым он делается с помощью width и height, равных между собой + border-radius: 50%

У вас 1 promise, как только он разрешился - все сразу выводится.

т.е. await ждет только 1 раз, дальше он использует результат уже разрешенного промиса, чего ему ждать ?

Ваш пример, но рабочий:

function getPromise() {
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve('готово'), 1000);
  });
}

async function asyncCall() {
  for (let i=0; i < 100; i++) { 
    console.log(await getPromise());
  }
}

См.
https://developer.mozilla.org/en-US/docs/Web/JavaS...

global может использоваться только внутри методов или функций, т.е.

$a = 'test';

class Cls {

  public function __construct($a) {
    global $a;
    $this->a = $a;
  }
  public function printer(){
    global $a;
    echo $this->a;
  }
}

$get = new Cls($a);
$get->printer();

Использование global - очень неверная стратегия, и ее нужно избегать всеми силами....

В крайнем случае используй static (если нужно чтобы переменная была единая для всех экземпляров класса), причем его можно использовать как в пределах описания переменных и методов класса так и внутри функции при определении переменной

Если прямо надо сильно глобальную переменную и лень писать global в каждом методе, пользуйся функциями, определенных глобально, их будет видно везде. Пример реализации сиквенса:

function next_seq() {
  static id=0;
  return id++;
}

или даже возвращающего целые объекты или массивы

function yoyo() {
  static $o=false;
  if($o===false) $o=new MyCoolObject();
  return $o;
}
использовать:
yoyo()->myCoolMethod();

Еще раз глобальная область видимости - бад практикс, везде старайтесь заворачивать весь функционал вокруг класса или хотя бы неймспейса. Это просто как ходить опрятно и не пованивать.

1. Передать их аргументами в конструктор класса
2. $GLOBALS - плохой выбор, крайне не рекомендую использовать.

<?php
$a = 'test';

class Cls {

  public function __construct($a) {
     $this->a = $a;
  }
  public function printer(){
    echo $this->a;
  }
}

$get = new Cls($a);
$get->printer();