Сергей delphinpro

https://transfonter.org/

В любой непонятной ситуации в первую очередь обращайтесь к документации
Но если вам лень, то:

Events: change and input.
Methods: select(), stepDown(), and stepUp().

А вы точно программист? ))

Это русские символы в юникоде.

Чтобы не кодировать юникод, используйте опцию JSON_UNESCAPED_UNICODE

function pre($var) {
  echo '<pre>';
  var_dump($var);
  echo '</pre>';
}

=))

ещё у меня есть самописная хреновина https://github.com/delphinpro/dumper
если получится завести без описания =)

Почему все молчат о том, что второй вариант нарушает синтаксис CSS и не будет работать в принципе?!

Автор не упоминает препроцессоры, в тегах тоже нет. Значит речь идёт о нативном css, в котором только первый вариант и возможен.

НО, даже в первом варианте я категорически не рекомендую писать так, как вы написали. Гораздо лучше и удобнее будет так:

/*== Какой-то блок на странице */
.class-1 {
  /* стили для экранов 767px и менее */
}
@media (max-width: 767px) {
  .class-1 {
    /* стили для экранов 767px и менее */
  }
}

/*== Какой-то другой блок на странице */
.class-2 {
  /* стили для экранов 767px и менее */
}
@media (max-width: 767px) {
  .class-2 {
    /* стили для экранов 767px и менее */
  }
}

/*== И так далее… */
…

Код должен быть структурирован. Стили, описывающие отдельный селектор, всегда должны быть все вместе и рядом.

А если вы собираете стили препроцессором, то наверняка у вас описания всех селекторов будут раскиданы по отдельным файлам. Медиазапрос для селектора пишете в том же файле, где и основной стиль.

Повторю ещё раз: главное — структурированность кода! Пишете один раз, читаете и дорабатываете — сотни. Облегчайте себе будущие чтение и модификацию кода, который пишете.

Bd - Bold (700)
Cn - Condensed (Сжатый)
Blk - Black (900)
Lt - Light (300)
Th - Thin (100)
It - Italic
UltLt - UltraLight (200)

ну и так далее.

еще можно два раза кликнуть и в окне просмотра шрифта глянуть его полное название

function myfunc($filename){
    return array(
        'filename' => $filename,
        'content' => base64_encode(file_get_contents($filename))
    );
}

$filesContentArray = array_map('myfunc', glob('/fonts/*.*'));
file_put_contents('1.json', json_encode($filesContentArray));

<nav class="menu">
  <ul class="menu__list">
    <li class="menu__item menu__item_state_active"><a class="menu__link" href=""></a></li>
    <li class="menu__item"><a class="menu__link" href=""></a></li>
    <li class="menu__item"><a class="menu__link" href=""></a></li>
  </ul>
</nav>

CDN vs свой билд — экономия на спичках.
Тем более если вам не нужен весь пакет.

Начну с самого плохого, неправильного и убогого варианта использования:
Это когда люди подключают бутстрап.мин.цсс, а потом в своем файлике начинают переопределять стили. Получается полный неподдерживаемый пиздец (я как раз сейчас натягиваю на сайт купленный (!) такой шаблон, нервы на пределе).
Люди, которые так делают приводят гнилой аргумент: а вдруг мы захотим обновить бутстрап? Серьезно, блять? Как часто вы это делали? ставлю сто баксов, что ни разу.

Как делать по феншую.

Для начала, естественно, использовать препроцессорные исходники (не будем выбирать конкретный порт, есть и lеss, и sсss, и stylus, кому что нравится).

Далее миксины. Не нужно подключать отдельные. Подключите valiables.scss и mixins.scss. Миксины не попадают сами по себе в билд, так пусть они все будут доступны.

Компоненты. Отключите ненужные, закомментировав импорты соответствующих файлов.

Кнопки. Если бутстраповские не нужны, отключите их. Напишите свои, используя миксины и даже копипасту части кода из бутстрапа. Это нормально.
Отличный вариант, если вы напишете свой миксин для кнопки (который и бутстраповские миксины может использовать). Ибо в бутстрапе, к сожалению, нет миксина make-button().

Если вам нужно переделать компонент или стиль (часто приходится модифицировать навбар, таблицы, навигацию, табы), не стесняйтесь исправить исходник. Но лучше исходнить отключить, скопипастить и подключить свой вариант (возможно даже поменяв классы, но это не всегда прокатит, ибо связанность ужасная). Править нужно, понимая что вы делаете. Потому что бутстрап внутри устроен через жопу. Взять хотя бы класс .nav — лютый пиздец, дикая связанность.

Пагинация, крошки. Никогда вас не попросят поставить исходные стили. Если по макету эти элементы имеют определенный стиль, этот стиль будет сохраняться. Смело меняйте. Или делайте дубликат.

Хелперы использовать нужно как можно меньше. Они нужны для быстрых набросков или правок "здесь и сейчас". Лучше опишите новый класс.
Опять же если вам нужен класс list-inline в единственном месте, то почему бы его не прописать?

Ссылки и статьи типа "как верстать под бутстрап" — это исключительно отстойный материал, написанный чаще всего такими же новичками, как и те, кто ищет подобную тему. Хотя базовую инфу вы конечно получите.

Конкретно здесь проще, и я бы даже сказал, нужно сделать страницу на jquery =))

------------------------

Если же вас интересует как в принципе заменить jquery на vue, то постараюсь ответить.

1. Как и в случае jquery, ищем подключаем подходящий пакет. Например этот.

2. Аккордеон реализуется вручную парой строчек

<div>
  <h2 @click="toggle"></h2>
  <div v-if="stateOpen">
    Скрытое содержимое
  </div>
</div>

{
  data() {
    return {
      stateOpen: false,
    }
  },
  methods: {
    toggle(){
      this.stateOpen = !this.stateOpen;
    }
  }
}

Анимации раскрытия по вкусу, с помощью обёртки transition

3. Аналогично предыдущему пункту. 10 минут на реализацию.
4. Аналогично первому пункту.
5. Аналогично первому пункту.
6. Блин, ну тут то же самое =)) Мне нравится этот пакет: vue-form

Вот и всё. jQuery можно не подключать.

Вероятно он скрыт настройкой ManagerManager
Смотрите чанк mm_rules (дефолтное название)

Есть такой грязный хак

<MyComponent :foo="bar">
  <div class="my-component">
    <h3>Разметка компонента, генерируемая сервером по старинке</h3>
  </div>
</MyComponent>

Сам компонент стандартно описан в vue файле. Разметка что внутри выведена, будет замещена рендером компонента.
Само собой тег MyComponent будет невалидным с точки зрения html, но зато и содержимое компонента будет отдано сервером. Ну и тот факт, что нужно делать двойную работу (дублирование шаблонов на клиенте и сервере), тоже печалит. Однако когда нет возможности/желания разворачивать полноценный SSR может быть приемлемым компромиссом.

Регистр имеет значение

Небольшой прямоугольник с overflow:hidden и два его абсолютно позиционированных псевдо-элемента с подобранным положением и border-radius
Суть на картинке:


https://jsfiddle.net/ywh2fd3f/56/

как-то так =)

Воспользуйтесь конструктором fontello.com
Соберите шрифт сами с необходимым набором иконок.

Как сделать во все scss файлы автозапуск другого scss в nuxt?

https://jsfiddle.net/m0z59dxa/21/
https://jsfiddle.net/m0z59dxa/25/