Можно ли сделать интерфейс адаптивным, не переписывая весь CSS через media query's?

Question

[stariydead]

Столкнулся с проблемой. У интерфейса приложения есть полностью готовая desktop-версия. Необходимым стало создание мобильной версии, но нет желания полностью переписывать весь CSS код, т.к львиная доля всех значений написана через px, а значит статична. Есть ли способ не переписывать все под мобильные устройства отдельно?

Comments

[Антон Литвиненко]

не совсем понятен вопрос. довольно часто так и делают, сначала верстают десктоп версию, потом пишут всю адаптивку. даже если нет желания. но такая у нас работа

[stariydead]

Антон Литвиненко, есть ли какой-нибудь способ упростить (ускорить) этот процесс?

[ThunderCat]

stariydead, Писать быстрее?

[Модератор]

Склоку следует прекратить.

Answer 1

[Сергей delphinpro]

Обычно нет других вариантов. Если верстка гавно (в эту категорию входит верстка с использованием пикселей), то придется все переопределять в медиазапросах.

Но даже если размеры задаются в rem, то не всегда достаточно прописать только font-size для :root. Всё же приходится кое-что переопределять, хотя и значительно меньше.

Comments

[stariydead]

Окей, в целом, теперь ясно

[Северное Сияние]

а почему пиксели в адаптивной верстке плохо и с чего начать изменение макета под десктоп? какие величины для шрифтов ставить?

[Román Mirilaczvili]

Сергей delphinpro
А можно ли каким-либо образом просканировать CSS на предмет пиксельных значений и заменить всех их на rem? Может, для этих целей есть какая-то автоматизация, инструменты.

[WapSter]

Верстка в пикселях не говно, если уметь ее применять. Говно оно будет если явно указывать к примеру width 1030px или что-то подобное.

[WapSter]

Román Mirilaczvili, rem теже пиксели, и очень часто верстка может ехать если пихать их где нужно и не нужно

[Сергей delphinpro]

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

[Сергей delphinpro]

Román Mirilaczvili,

А можно ли каким-либо образом просканировать CSS на предмет пиксельных значений и заменить всех их на rem?

Да ну, не надо так делать. может оно и прокатит, а может и испортит всё. Верстка - это организм, все части должны быть согласованы между собой. То есть нужно не просто поменять значения, а отладить и перепроверить всё, по сути переверстать.

[Сергей delphinpro]

часто верстка может ехать если пихать их где нужно и не нужно

ну это само собой. в крайности тоже не нужно кидаться. Где-то и пиксели нужны, где-то и другие единицы измерения. Но в целом верстку лучше основывать на ремах.

Answer 2

[Sketch Phantom]

вместо px ставь % и использую гриды или флексы. Я использую такой подходт :)