Igor Bodyagin

Потому что

v-model игнорирует начальное значение атрибутов value, checked или selected на любых элементах форм.

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

Думаю можно попробовать с помощью фильтра style_loader_tag.

add_filter( 'style_loader_tag', 'add_attribute', 10, 2 );

function add_attribute($link, $handle) {
    if( $handle == 'fontawesome' ) {
        $link = str_replace( '/>', 'integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous" />', $link );
    }
    return $link;
}

$handle — это значение первого параметра в функции wp_enqueue_style.

Псевдоэлементы + немного изврата на svg и радиальных градиентах

:before и :after добавляет контент к содержимому элемента, а у img же как такового содержимого нет.
Решение - завернуть img в div и к нему уже применять псевдоэлементы.

Также псевдоэлементы нельзя применить к input

По поводу «import vs LINK» есть статья на хабре, там рекомендуют подключать через «LINK».

В css шрифты подключают через свойство @font-face.
Форматы файлов:
.eot - IE6+
.woff2 - Android 37, Chrome 41+, Opera 27+
.woff - IE9+, FF3.6+, Chrome 6+, Opera 11.10+
.ttf - FF3.5+, Chrome 4+, Safari 3.1+
.svg - Chrome 4+, Opera 10+, iPhone, iPad, Safari

Есть много онлайн конвертеров, для конвертации одного формата в другие, например:
www.fontsquirrel.com/tools/webfont-generator
https://www.web-font-generator.com/

Если вы используете кириллические шрифты, то после конвертации обязательно проверяйте файлы, потому что некоторые конвертеры не умеют работать с кириллицей.

Откуда сомнения? Вы стали проверять и что-то нашли?

А если не нашли, то как вы гуглите?
Как узнать, какой шрифт платный, а какой нет?
+проверка на www.myfonts.com
+проверка на www.parachutefonts.com
+другие сайты... Гуглите старательно.

Вообще лицензия должна быть скачана вместе со шрифтом. Или даже может находиться в самом шрифтовом файле. Ищите её или ссылку на сайт автора - а там уже точно информацию можно найти.

А если после всех усилий найти не удаётся, то можно не переживать насчёт использования.

var linkNav = document.querySelectorAll('[href^="#"]'), //выбираем все ссылки к якорю на странице
    V = 1;  // скорость, может иметь дробное значение через точку (чем меньше значение - тем больше скорость)
for (var i = 0; i < linkNav.length; i++) {
    linkNav[i].addEventListener('click', function(e) { //по клику на ссылку
        e.preventDefault(); //отменяем стандартное поведение
        var w = window.pageYOffset,  // производим прокрутка прокрутка
            hash = this.href.replace(/[^#]*(.*)/, '$1');  // к id элемента, к которому нужно перейти
        t = document.querySelector(hash).getBoundingClientRect().top,  // отступ от окна браузера до id
            start = null;
        requestAnimationFrame(step);  // подробнее про функцию анимации [developer.mozilla.org]
        function step(time) {
            if (start === null) start = time;
            var progress = time - start,
                r = (t < 0 ? Math.max(w - progress/V, w + t) : Math.min(w + progress/V, w + t));
            window.scrollTo(0,r);
            if (r != w + t) {
                requestAnimationFrame(step)
            } else {
                location.hash = hash  // URL с хэшем
            }
        }
    }, false);
}

<a id="scroll" href="#one">⇩</a> <!-- ссылка, по клику на которую осуществляется прокрутка к якорю -->
<a id="one" name="one"></a> <!-- якорь, расположенный в произвольном месте страницы -->

Если вы об этом

Если объект .brick2 будет повторяться на странице, тогда id first и last использовать будет нельзя, т.к. id должен быть уникальным для страницы.

Замените их на class.

Решение Ваше задачи лежит через использование метода .parent(), например:

$(this).parent('.brick2').find('.first');

ceil — округляет все в большую сторону,
floor — в меньшую,
round — меньше 0.5 — в меньшую, больше 0.5 — в большую.

для li задать white-space: nowrap;

Без запятой

transform: rotate(180deg) scale(0.5);

$('.glass').attr('name', 'Mike');

// vanilla js
const input = document.querySelector('.glass');
input.setAttribute('name', 'param-pam-pam');
// jQuery
$('.glass').attr('name', 'param-pam-pam');

Для одного элемента, для коллекции так же просто пройтись циклом:

const $square = $('.seat path') 
const boundingBox = $square[0].getBBox()
const xCenter = (boundingBox.width / 2) + boundingBox.x
const yCenter = (boundingBox.height / 2) + boundingBox.y
$square.css('transform-origin', `${xCenter}px ${yCenter}px`)

Объяснение: насколько я понимаю вам нужен scale именно от центра элемента, то есть если бы это был HTML transform-origin: 50% 50%; спасло бы ситуацию, однако для частей SVG, насколько я знаю, transform-origin считается от всего <svg> элемента, а не от самого элемента на котором он применен, поэтому верные значения надо высчитать с помощью JS или заинлайнить.

Вы не так поняли принцип работы с media queries.

CSS стили оформленные с помощью media queries не имеют приоритета применения. Они применяются ровно в том месте где указаны, но при заданных условиях.

Чтобы все заработало так как вам нужно, необходимо перенести
@import 'media'
в конец main.sаss файла.