Добавляет рецепт с написанием попапа и демку к нему

[AnnaBaraulina]

Описание

Добавляет рецепт с реализацией попапа на и демку к нему

Closes #2733

https://content-4805.dev.doka.guide/recipes/popup/

Чек-лист

• Текст оформлен согласно руководству по стилю
• Ссылки на внутренние материалы начинаются со слеша и заканчиваются слэшем либо якорем на заголовок (/css/color/, /tools/json/, /tools/gulp/#kak-ponyat)
• Ссылки на картинки, видео и демки относительные (images/example.png, demos/example/, ../demos/example/)

[AnnaBaraulina]

@TatianaFokina привет! Я хотела посоветоваться насчет демки, мне она не очень нравится в нынешнем варианте. Если не открывать ее в отдельной вкладке, не очевидно, что там вообще что-то есть, так как до кнопки приходится скроллить вниз. При этом мне хотелось показать в статье, как с помощью модалки заблокировать скролл страницы. Может быть мне сделать две демки: в начале статьи оставить нынешнюю , но удалив у body высоту, а в том месте, где пишу про блокировку скролла добавить демку как у меня была изначально?

[solarrust]

Привет! Подкину идею. Можно добавить на «страницу» демки какой-то контент. Например, несколько фотографий котиков. А кнопку открытия попапа, например, фиксированным позиционированием повесить в нижнем правом углу. Тогда и страница будет скроллиться и кнопка открытия всегда будет «под рукой».

[AnnaBaraulina]

Привет! Подкину идею. Можно добавить на «страницу» демки какой-то контент. Например, несколько фотографий котиков. А кнопку открытия попапа, например, фиксированным позиционированием повесить в нижнем правом углу. Тогда и страница будет скроллиться и кнопка открытия всегда будет «под рукой».

Это без проблем, только Таня перед этим наоборот попросила спозиционировать кнопку по центру (изначально была в верхнем левом углу). Делаю в правом нижнем тогда?

[AnnaBaraulina]

Фиксированным будет симпатичнее всего,конечно, так и сделаю, спасибо

[TatianaFokina]

Это без проблем, только Таня перед этим наоборот попросила спозиционировать кнопку по центру (изначально была в верхнем левом углу). Делаю в правом нижнем тогда?

Таня перед этим тупанула 😅 Мне нравится идея Алёны.

[AnnaBaraulina]

Каждый раз я не прохожу тест на форматирование. При этом ошибка, которую он выдает - recipes/popup/demos/popup-demo/index.html:
Wrong line endings or no final newline - я не могу обнаружить на глаз, а prettier не помогает. Как мне с этим бороться, подскажите мне, пожалуйста.

[AnnaBaraulina]

Привет, всем! От меня нужны какие-то еще доработки?
Вижу конфликт файлов, но не могу понять, откуда взялся .yaspeller.json

[TatianaFokina]

@AnnaBaraulina, я там слегка переделала демку. Пока, наверное, лучше не заменять примеры в тексте на более актуальные, Света может что-то добавить и изменить.

Пока предлагаю выбрать топ-4 самых мемных котика, а остальные картинки удалить.

[skorobaeus]

Ребята, вы такие классные 🥺

Поддерживаю Таню, четырёх котиков достаточно, чтобы скролл был даже на исполинском десктопе.

От себя предлагаю на мобилках кнопку выровнять по центру по горизонтали, всё-таки. А то при малой ширине экрана такой сдвиг выглядит странно:

[TatianaFokina]

Я добавила папочку автора, можешь что-то написать о себе в файлике, если хочешь.

[AnnaBaraulina]

Я добавила папочку автора, можешь что-то написать о себе в файлике, если хочешь.

Я написала там чуть, спасибо!:)

[TatianaFokina]

@solarrust, посмотришь этот пиар?

[StarHamster]

Турбо-пушка! Можно только мемы через tinypng прогнать и вообще будет супер

[github-actions]

Превью контента из 941db43 опубликовано.

[solarrust]

🤩