Как перевести весь сайт в vw?

Question

[Анастасия]

Здравствуйте. Это небольшое ответвление другого моего вопроса.

Ситуация: есть сайт, который свёрстан под экран 1280px. Все размеры там указаны в px. Мне хочется, чтобы на экранах свыше 1280px сайт выглядел также, как и на 1280 (, тянулся, т.е. занимал всегда условные 80% ширины экрана).

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

Можно ли как-нибудь это дело автоматизировать? Грубо говоря, мне нужен плагин/сервис/что-то, который мне вернёт мой css файл, но где все размеры будут указаны в vw (разумеется относительно определённого размера экрана)

Comments

[Сергей delphinpro]

Берем scss. Пишем функции. Используем их в в стилях.

[Ankhena]

Зачем на глаз?
Обычные пропорции.

Пример:
у блока ширина 320 при 1280
1280 это 100vw
Итого: 320х100/1280 = 25vw

[Анастасия]

Ankhena, это что? ещё и считать что-то нужно? я за интернет плачу, чтобы деградировать, а не это вот всё.

[Ankhena]

Анастасия, мне показалось, что вы его в некотором роде делаете :)

И не думаю, что студент на фрилансе дорого возьмет за "вот это всё". И вы сможете платить ему и продолжать наслаждаться жизнью (я решила заменить ваше слово)

[Анастасия]

Ankhena, формулы, это, конечно, хорошо, но я подумала, что вы поняли, о чём я говорю. Мне нужен готовый результат на выходе, а не подсчёт каждой строки. Давайте аналогию проведу: у меня сломалась машина и я спрашиваю "подскажите, есть ли у нас сервисы по ремонту машин, чтобы я дальше могла ездить?", на что мне отвечают: "езди на такси, студенты-таксисты дорого не возьмут". Спасибо, но это не решение проблемы

[Ankhena]

Анастасия,
Собственно, эту же формулу вы можете засунуть в JS.
Вариантов несколько: галпом при сборке или просто прогнать css (ту часть, которая при >1200) через скрипт.
Взять все px, умножить на 0.078125 (если пляшете от 1280) и заменить единицы измерения. С rem чуть сложнее.

[Saboteur]

Анастасия, так а чем вам фриланс не сервис?

[Анастасия]

Saboteur, ну а зачем вы тогда здесь вопросы задаёте? шли бы вы на фриланс и там бы задания создавали

[Saboteur]

Анастасия, А я почти не задаю вопросов, вдобавок, мои вопросы не похожи на задания.

[Анастасия]

Saboteur, более чем похожи. и если я спрашиваю сервис автоматизации, это не значит, что я требую от тебя его написать

[Saboteur]

Анастасия, Можно конкретный пример моего похожего вопроса?

Answer 1

[Анастасия]

https://hezedu.github.io/px2vw/