Задать вопрос
Местоположение
Украина

Достижения

Все достижения (5)

Наибольший вклад в теги

Все теги (33)

Лучшие ответы пользователя

Все ответы (61)
  • Как стилизовать панель браузера на телефоне?

    Hyubert
    @Hyubert
    JS
    вроде так

    <!-- Chrome, Firefox OS and Opera -->
    <meta name="theme-color" content="#000">
    <!-- Windows Phone -->
    <meta name="msapplication-navbutton-color" content="#000">
    <!-- iOS Safari -->
    <meta name="apple-mobile-web-app-status-bar-style" content="#000">
    Ответ написан
    5 комментариев
  • Стратегия разбиения верстки на блоки?

    Hyubert
    @Hyubert
    JS
    Подскажите как вы разбиваете вашу верстку на блоки
    Вот возьмем, например, header.

    Хедере это конкретный блок со своим классом и модификаторами (если нужно). Далее все намного проще - позиционирование мы не включаем в стили модификатора, это скорее изменение его внешнего вида, об этом следует помнить.

    Предположим внутри блока есть кнопка, которая есть и в других блоках.

    Ну так и делайте ее отдельным блоком, например с классом .btn или .button и у нее будут свои модификаторы. Чаще всего у блока кнопки их много. Пример как делаю я:
    .btn {}
    /* style */
    .btn--primary {}
    .btn--secondary {}
    /* size */
    .btn--sm {}
    .btn--md {}
    .btn--xl {}
    /* special */
    .btn--link {}


    Маргины мы прописываем в стилях к этой кнопке и добавляем соответствующий модификатор?

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

    .header .btn {}
    или например такой класс сделать
    .header__btn {}

    Я предпочитаю вложенность (но не больше 1 уровня)

    А как эти кусочки потом собрать? С помощью pug includes или gulp


    Ну тут уже по разному, как вам удобней и зависит от конкретного инструмента, если говорить о pug, то я делал так
    1. объявление миксина в отдельном файле
    mixin button(caption)
      button.button&attributes(attributes)!= caption

    2. Подключал в глобальный скоуп через шаблоны (include)
    3. Пользовался миксином в любом места.

    Предположим еще в этом блоке есть меню, которое больше нигде не используется, его мы уже верстаем не отдельно, а вместе?


    Сделайте отдельным компонентом - не пожалеете. Во первых держать весь код в порядке (в одном понятном виде) удобно. Во вторых - если будет нужно расширение проекта или почти такое же меню но в другом месте, это вам пригодиться.
    Ответ написан
    7 комментариев
  • Как сделать HTML-код гугл формы адаптивным?

    Hyubert
    @Hyubert
    JS
    Лучше сделать форму самому , а с готовой максимум что можно ето прописать width="%"

    (насколько я помню содержимое фрейма не является элементом дом , потому к нему обращаться нельзя)

    codepen.io/anon/pen/OMxLPG
    Ответ написан
    1 комментарий
  • Верстка с нуля: какие основные этапы работы?

    Hyubert
    @Hyubert
    JS
    - win+r
    - cmd
    - cd ../
    - git clone
    - npm i
    - sblm project_name
    - npm start
    Ответ написан
    3 комментария

Лучшие вопросы пользователя

Все вопросы (48)