Задать вопрос

strelok011

Комментарии

  • Можно ли так называть классы по БЭМ?

    @strelok011
    Genri_Rus, можно и так, но я бы все же иконку вытащил в отдельный компонент, не зависящий от места размещения.
    Только
    <span class="menu-mobile__open_line">0</span>

    БЭМ четко говорит - не делать в стилях вложение элемента в элемент. Плоский список классов должен быть. open_line - полное название элемента. Либо просто "menu-mobile__line"
    Написано

  • Разработчик недисциплинированно трекает время. Что делать?

    @strelok011
    Выше, но не сильно, я этим вопросом не задавался давно, коэффициент не скажу.
    Помимо чисто финансовой составляющей есть еще мотиваторы.
    Написано

  • Можно ли так называть классы по БЭМ?

    @strelok011
    4. стараюсь максимально избегать обезличенной дивной верстки - это тупо не удобно разглядывать миллионы закрывающихся </div></div></div>....</div> (мне еще зачастую и интегрировать в шаблоны приходится)
    5. смотрю на рекомендации БЭМ - по поводу вложенности и именования элементов в блоке, выделение отдельных блоков, выделение переиспользуемых компонентов и проч.
    6. иконки - это отдельный компонент, описанный, собранный в спрайт и т.д. и т.п.

    Так же советую использовать aria атрибуты (по крайней мере почитать при них вот тут например)
    Написано

  • Можно ли так называть классы по БЭМ?

    @strelok011 
    <nav class="navbar-center">
  <div class="menu-mobile">
    <button type="button" class="menu-mobile__open">
      <i class="icons__open_menu"></span>
    </button >
    <div class="menu-mobile__container">
      <div class="menu-mobile__header">
        <h2="menu-mobile__title">Меню</h2>
        <button type="button" class="menu-mobile__close">
          <i class="icons__close_menu"></span>
        </button>
      </div>
        <ul class="menu-mobile__links">
          <li class="menu-mobile__item">
            <a class="link" href="#">link</span>
          </li>
          <li class="menu-mobile__item">
            <a class="link" href="#">link</span>
          </li>
        </ul>
    </div>
  </div>
</nav>


    Я бы верстал как-то так. Сейчас объясню почему:
    1. если объект должен выполнить какую-то активность без перехода на другую страницу, то это кнопка, соответственно лучше использовать тег button.
    2. если контейнер содержит навигацию по сайту - использую тег nav.
    3. не использую пустые декоративные обертки, когда достаточно разметки для оформления. Основной посыл - контейнер стоит добавлять в том случае, если подразумевается, что внутри будет вложенных контейнеров больше 1.
    Написано

  • Можно ли так называть классы по БЭМ?

    @strelok011
    Вы увлекаетесь технической реализацией, а я вам советую обратить внимание на семантическую часть. ЧТО вы заворачиваете в этот всплывающий функционал. Так-то и выпадающий селектор на телефоне можно модалкой обозвать, т.к. он перекроет весь экран. По ссылке почитайте, что обычно вкладывают в понятие модалки.
    Вам надо по смыслу содержания выписывать стили, чтобы было понятно, что же в этом контейнере содержится, а не как он будет отображаться. В зависимости от разрешения я могу заставить этот блок и выводиться просто в теле документа на большом экране, и превращаться во всплывающее окно на телефоне (например).
    Написано

  • Можно ли так называть классы по БЭМ?

    @strelok011
    Я понимаю, что вы вызываете его как модальное. И если у вас активация по классу происходит, то вам должно быть виднее.
    Но с точки зрения функциональности - это не модальное окно. Это мобильное меню с навигацией. Модальное окно обычно соответствует определенным требованиям. Например
    Написано

  • Какой движок выбрать для интернет магазина?

    @strelok011
    Zigzag, альтернативы не нашел с подобной гибкостью шаблонов. Переезжать буду уже в реакт spa с ssr, благо научился...
    Написано

  • Как изменить высоту блока для адаптивной верстки?

    @strelok011
    Рустам Байназаров, есть предложение пинать UI-UX доработать шапку, добавить ссылки и информативности при создании вопроса. Под лежачий камень вода не течет. Объединили с хабром тостер и.... приплыли?
    Написано

  • Здравствуйте ни кто ни знает как обычный css переделать в css styled components react?

    @strelok011
    на этот вопрос Вы можете найти ответ разобравшись в замыканиях и в областях видимости переменных :)
    Написано

  • Как изменить высоту блока для адаптивной верстки?

    @strelok011
    Кураторов набежало :)
    Надо правила для разделов заводить, что ли, с рекомендациями и примерами :)
    Написано

  • Здравствуйте ни кто ни знает как обычный css переделать в css styled components react?

    @strelok011
    группированные классы будут работать только внутри компонента, если они в таком виде в разметке лежат.
    За пределы компонента стили не уйдут.
    Либо же писать такие группы глобально, но при этом компонент должен содержать такие элементы в чистом виде, либо классы комбинировать отрендренные через styled + обычный цсс стиль вида:
    <div className={`${className} your-oldstyle-class`}>

const Untitled = styled.div`
display: block
&.your-oldstyle-class {
some styles...
}

`
;


    Но если уж взялись за styled компоненты - готовьте их правильно.
    И кстати, так не надо делать .untitled__shutters:before, .untitled__shutters:after

    В стайлед компоненте это будет выглядеть проще

    .untitled {
 &:before, &:after {
 ....
 }
}
    Написано

  • Здравствуйте ни кто ни знает как обычный css переделать в css styled components react?

    @strelok011
    function App*() { - тут символ * не нужен, промахнулся пока набирал скобки...
    Написано

  • Как показать всплывающее окно по центру видимой области на мобильном устройстве?

    @strelok011
    Я исключительно про те проблемы, которые всплывают при создании фиксированного или спозиционированного окна в телефоне. Если вы фиксируете блок, возникает куча проблем.
    Про условно - я в том ключе, что сделать можно, но при этом придется решать колоссальный вал присоединенных проблем, тестировании на куче устройств с различными разрешениями.
    Т.е. иной раз лучше продумать UX чем махнуть рукой и сказать - нехай верстальщик наверстает, ему за это плотют и он обещал адаптив за дешево.
    Я только хочу подсветить ожидаемые проблемы.
    Если у вас решится всё обычной всплывашкой и это всех устроит - будет отлично.

    Возможно лучше продумать условные сектора, выбор места не кликом по карте, а в селекторах с отображением на миникарте... прямое решение а-ля десктоп, думаю, не стоит тут городить.
    Вывели блоки 3х4 кресла, по клику подсветили, далее отображение отдельной формы с вводом всех данных. Всплывашку тут не вижу необходимости даже городить (это исключительно ИМХО, может у вас свои резоны, не знаю)
    Желаю справиться с этой проблемой!
    Написано

  • Как сделать такое переключение?

    @strelok011
    В общем, если без анимации заголовка - всё ложится в кейс табов. Но реализация навигации на табах - либо все данные всех страниц грузятся сразу, либо на ajax либо фреймворках подтягиваются/создаются в момент клика по навигации.

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

  • Как показать всплывающее окно по центру видимой области на мобильном устройстве?

    @strelok011
    Ну и еще - таблица 16 на 27? на мобиле? серьезно?? Данные надо перестраивать в колонки по два, слева легенда, справа значение. Хотите - третья колонка с кнопкой для клика. Ближе к пользователю нужно быть а не устраивать локальный ад.
    Написано

  • Как показать всплывающее окно по центру видимой области на мобильном устройстве?

    @strelok011
    Модалку - делать на полный экран, накрывать весь контент, чтобы это выглядело отдельным экраном, быть готовым к тому, что снизу неотлавливаемые кнопки браузера могут перекрывать контент на андроиде, добавлять пустое место для отступа, если внизу будет сабмит.
    И да - табличные данные на мобиле? Однозначно "иди на ПК". У вас не курсор а палец, который может накрыть 10% экрана. Дизайнер, который придумывает такие кейсы... ну, сомнительный дизайнер.
    Гайдлайны - да на сайтах гугла и эппла для разработчиков. У гугла material-ui, у эппла свое, связанное с интерфейсом. Нужно и на гайды для мобильных приложений смотреть. Модалки на телефоне? :)))

    Альтернативное предложение - почему бы под строкой, куда ткнули, не добавлять строку с формой, раздвигающей контент и подсвечивать клетку нажатую? Всё равно извращаться...
    Написано

  • Как преобразуется html (svg и div) в видео формат в сервисах типа SUPA?

    @strelok011
    headless браузеры умеют делать скрины отрендренных страниц, думаю, что и анимацию переснять, написав скрипт, не должно быть проблемой.
    Хром, PhantomJS, даже у мозиллы есть плагин для консольного рендера страницы.
    Если на бэке запустить такой браузер, получить из него пакет изображений, то совсем уж мелкая задача натравить ffmpeg на секвенцию изображений для рендера видео.

    Вариантов получения изображения из html много, вот еще несколько ресурсов:
    https://stackoverflow.com/questions/10721884/rende...
    https://github.com/bpsagar/css2video
    https://stackoverflow.com/questions/4618048/best-w...
    Написано

  • Как оценить расстояние от одного адреса до другого?

    @strelok011
    Алексей Аминодов-Борисов, тем более. Спасибо за дополнение. Давно не брал в руки мат. книжек
    Написано

  • Есть ли сервис для превращение html в краткое визуальное дерево с классами?

    @strelok011
    sashabeep, в вашей вселенной :)
    Написано

  • Как сделать анимацию смены месяца в календаре?

    @strelok011
    Андрей, может можно всё же тз глянуть? демонтаж слайда - фейд оут, монтаж следующего слайда - фейд ин. не вижу необходимости лепить абс. позиционирование.
    Написано