Как плавно увеличить svg, на разной ширине экрана, до заданных значений?

Ankhena, спасибо )

В любом из случаев есть media и размеры в процентах.

Так и сделал )

Как плавно увеличить svg, на разной ширине экрана, до заданных значений?

Ankhena,

Ничего подобного. Если ширина меньше высоты, то обрежет наоборот.

Да.

Немного что??

Немного, переусложнено, неоправданно. Если смотреть в контексте, то я говорю о доп контейнерах, и свойствах, которые усложняют восприятие кода и мешают нормальному понимаю того, как это работает. В общем налепил, не разберёшься.

Думаю, что сначала нужно на бумажке нарисовать как именно вы хотите его свободно перемещать и от чего это зависит.
За позиционирование фона отвечает background-position.

Я вчера после моего комментария, всё и сделал. Всё работает хорошо. Всё перемещается.
Но опять же, если смотреть в тот же комментарий, основной вопрос, который меня интересует это альтернативные решения. В частности, я хотел узнать, нет ли возможности задать стартовые 200 пикселей изображению на минимальной ширине окна и конечные 400 пикселей на максимальной ширине. И плавно изменять этот размер в зависимости, от ширины окна по мере приближения от одной крайней точки к другой.

Ну нет так нет. Наверное это к JS.

Как плавно увеличить svg, на разной ширине экрана, до заданных значений?

Я действительно, не до конца понимаю это свойство и приёмы работы с ним.
Что я пробовал, когда был ограничивающий контейнер:
- contain: я добился нужного эффекта, но мне не нравится это решение из-за проблем описанных выше. И мне не хочется, что бы фон был жёстко зажат чем-то. Я хочу свободно перемещать этот фон внутри блока без ограничителей. Единственный ограничитель это ширина блока в котором фон свободно плавает и ширина окна
- cover: заполнит всё доступное пространство. B видимо обращает внимание только на ширину окна, по высоте он мой круг режет.
- Фиксированные значения: пока писал пост, попробовал подобрать процентные значения. Фон меняется, но я не могу его контролировать без брейкпойнтов. В принципе, решение меня устроило бы, немного кастомно, но если ничего лучшего нет, то можно и так.

Что ещё я могу сделать? Есть возможность на экране в 320px получить фон размером в 200px, а на 1100px получить фон размером в 400px, плавно изменяя его? Ну что-то вроде двух точек минимальной и максимальной ширины.

GitHub pages: запушил, структура проекта изменилась, но загружается старая версия. Почему?

Нет, дело не в этом было точно...
Я два дня подождал, не думаю, что этот тайминг, настолько долгий )

GitHub pages: запушил, структура проекта изменилась, но загружается старая версия. Почему?

В общем я всё удалил, перезалил, всё заработало, не знаю в чём было дело.

GitHub pages: запушил, структура проекта изменилась, но загружается старая версия. Почему?

Я зашёл с устройств, с которых никогда не открывал этот проект. А так же, регулярно нажимал ctrl+r, который в теории, должен был скинуть кэш.

NPM, gulp и ssd. Насколько быстро изнашивается ssd при активной работе frontend сред разработки?

АртемЪ, Да? Ну тогда Вы меня успокоили. Это замечательная информация. Объём не такой большой. 400-500 мб. для каждой установки gulp модулей.
Я подержу ещё немного тему, может коллеги заглянут, и скажут, что я опять фигнёй страдаю ) И отмечу ответ решением.

NPM, gulp и ssd. Насколько быстро изнашивается ssd при активной работе frontend сред разработки?

Ну, в текущей редакции, у меня для каждого проекта, устанавливается 20 000 - 30 000 файлов. Это просто небольшой лендинг. В неделю, в среднем, 2-3 лендинга можно делать. Помимо всего прочего, каждый сейв в редакторе кода удаляет папку финального проекта и собирает её заново. 50-100 файлов. За 2-3ч. может до 1000 записей набежать.
Я не знаю, что будет дальше, я не очень долго в этой теме. Наверное надо как-то с кэшем работать.

Gulp: при попытке вложить в медиа выражение псевдо элемент sass не успевает компилить и теряет файл. Что делать?

Другое решение работать на ssd, к такому выводу я пришёл. Хотя, может быть, не совсем мой случай )

Gulp: при попытке вложить в медиа выражение псевдо элемент sass не успевает компилить и теряет файл. Что делать?

svm, в общем спасибо за плагин )
Тайминг помог. Ошибок нет )

Gulp: при попытке вложить в медиа выражение псевдо элемент sass не успевает компилить и теряет файл. Что делать?

Если я их вытащу из медиа, или например, напишу внутри селектора @media, таких проблем не будет.

Gulp: при попытке вложить в медиа выражение псевдо элемент sass не успевает компилить и теряет файл. Что делать?

svm, Конечно. Но всё подключено правильно. Дело в том, что этой ошибки нет, в момент, когда я вытаскиваю из медиа псевдо элементы. Терминал в VScode (git bash) не смог справиться с такой конструкцией совсем, терминал npm из под винды, какое-то время справлялся, с периодическим выпаданием этого сообщения (на один и тот же сейв done или error), но при усложнение конструкции, он тоже вылетел.

Как исправить ошибку gulp-webp?

Спасибо, Ваше решение мне помогло.

VS Code: почему тег img разбивается и переносится на новую строку?

Спасибо, Ваш ответ, навёл на мысль поискать в настройках значение "wrap", увеличение значение wrap line length решило проблему. Возможно, какой-то из плагинов, в совё время переписал этот параметр.

VS Code: почему тег img разбивается и переносится на новую строку?

Если вы про view -> toggle word wrap, то включение и отключение этой опции никак не помогает. Окно развёрнуто на 1080 пикселей. Строку текста ничего не ограничивает.

Gulp-webp-html: как сделать перенос строки, при выводе кода в html?

Froggyweb, Может быть ) Но это лениво будет ) Набирать каждый раз комбинацию, потом заполнить все вариативные и повторяющиеся данные как в img так и в picture, как минимум два раза написать имя файла. Хотя конечно, если имя изображения передавать в оба тега через повторяющийся $1, то проблемы вроде бы и нет, но всё равно это дольше, на первый взгляд. Чем если за тебя это сделает галп )

Как в консоле создать несколько файлов одновременно?

Sergei Nazarenko, действительно )

Gulp-webp-html: как сделать перенос строки, при выводе кода в html?

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

Как в консоле создать несколько файлов одновременно?

wisgest, когда хочется, что-то быстро протестировать, удобно написать touch index.html style.scss fonts.scss script.js. Так может терминал на маке, я позавидовал.

Что должно быть в теге nav?

Genri_Rus, Да, логично, спасибо за Ваш комментарий )
Видимо, так делают, с точки зрения необходимости в конкретном случае.
Я спрашивал, просто потому, что некоторые примеры, крупных ресурсов, сбивают меня с толку. Мне хотелось сделать правильно, если бы это было, чем-то подкреплено. В итоге я понял, что всё зависит от конкретной ситуации, а по умолчанию, делается так, как Вы описали.