abrahadabra

гриды, конечно вкусные. Ощутимо гибче того же флекса.

Но…

… отбросить на задний план поддержку браузерами …

это как?

так формулировка такая, что вызывает недоверие.

О себе ничего, кроме того, что офис в лондоне.

не чудо, а обыкновенная магия

а зачем так сложно?

li.dropdown(class = active ? 'active' : '')  a(href='#') Ссылка 

заказчики о таком уже просят? Ну круто!

Почему нельзя сбросить отступы у html, body — не знаю, это загадка.

Но сбрасывать отступы разом у всего не надо уже хотя бы потому что потом придётся этому всему их вручную прописывать.

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

использовать лучше что-нибудь вроде normalize.css

 

Наоборот, некоторые действия выполнить нужно, чтобы сделать страницу не адаптивной.

Это не писать никаких классов кроме .lg-* для колонок?

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

А все эти классы .lg-* не нужны вообще в реальной работе, они только для быстрого прототипирования годятся.

ключевое слово :target

А чо, бутстрап автоматом адаптивность предполагает?

именно так.

Наоборот, некоторые действия выполнить нужно, чтобы сделать страницу не адаптивной.

следует разместить на jsfiddle

А то тут уже не очень удобно разбираться.

ну во-первых, я бы стили определила в стили. То есть:

.popup {  opacity: 0;  visibility: hidden;  transition: all .3s ease;  &.active {    opacity: 1;    visibility: visible;  }}

А по клику только добавлять класс:

$(".clickMe").on("click", function(){  $(".popup").addClass("active");});$(".close_order").on("click", function(){  $(".popup").removeClass("active");});

довольно просто.

Во-первых, он изначально должен быть скрытым, а по клику просто меняете свойства opacity и visible.

приватные свойства и методы, их получается пока нет в es6 в классах?

нет

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

А что будете продавать? Ноутбук?)

А товары тоже бесплатно раздавать будете?

для начала сайт вы этими файлами не загружаете. Или загружаете?

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

последую примеру alexriz, и тоже оставлю отзыв о сотрудничестве.

Повторять слова Алекса не буду, хотя и подпишусь под каждым словом. Всё так, и постановка задачи была такая, что не оставляла вопросов, и с оплатой полный порядок, и никаких попыток схитрить. Хороший цивилизованный подход к работе.

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

А вот пара моментов, которые удивили. 

1. программист, путающий VCS с компилятором;
2. менеджер, понимающий в вёрстке и программировании, с кем можно общаться техническими терминами, а не подбирать слова попроще.

В общем всё весьма здорово. Только положительные впечатления.

такое ощущение, что этот макет уже где-то встречался.
 
Значит поругать… ок, попробуем.
Градиент на фоне в данном случае не обязательно делать картинкой, можно именно градиентом.
Навешивать стили на тэги имеет смысл тогда, когда все тэги должны выглядеть именно так. Условно говоря, h1 { font-size: 32px; } — это нормально. span { color: #900; } — уже не очень. Даже когда это #content h1 span { color: #900; } Ссылки должны реагировать на наведение. Особенно в главном меню.
Надпись в футере неправильно прилипла к контенту.
 
По вопросам.

не могу понять vertical-align?

с ходу что-то не получилось найти, но есть классная статья на css-live.ru, где эта тема разобрана детально. Рекомендую.
 

начал определять стили для a:visited все ссылки указывающие на # приняли статус посещенных. Как вернуть им статус линк?  Я даже на хост сайт выложил а они все виситед.

ну а как определяется, посещена ли ссылка? По адресу.
 

как верстать, чтобы sidebar и content были равной высоты

Правильный способ — flexbox. Но если поддерживать ископаемые браузеры, то display: table-cell
 

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

делать градиент градиентом.

уууу!!! Мне уж в какой-то момент показалось, что и придраться не к чему, типа всё хорошо.

Однако ж нет, получилось.

Итак. Ближе к концу карта. Она обрезана под углом. И вот этот угол сделан прозрачной картинкой, то есть, в этом месте не схватиться за карту.

Автор кода же точно-точно знает свойство transform: rotate()

Ну а кроме этого не знаю, к чему придраться. Всё здорово.

… только потому что … кому-то очень нравится =)

чушь ведь. Именно об этом первое предложение заглавного поста. Вы же его прочитали, не так ли?

… хз, 1 т.р. за 8 часов мне кажется рабским трудом. Да и тема в флейме, можно и флудить

труд — да. А практика лучше чем бесплатная.

Нашлись же даже люди, которых предложение заинтересовало.

вообще-то всем.

Попробую ещё раз. Что-то плохо у меня пока получается мысль донести видимо

Во-первых, есть колоссальная разница между декларативным и императивным стилем.

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

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

Во-вторых, сама идея отделения данных от представления. Это же идея хорошая и правильная.

Ну так в приведённых тобой примерах jQuery ничего полезного кроме делегирования не делает. С таким же успехом можно было всё написать на пьюр  JS /

Можно. Но смысл? В случае pure js то же самое: либо архитектуру выстраивать своими руками под проект, что в большинстве случаев не оправдывается никак и ничем, либо будет непотребная каша из кода.

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

А компонентный подход на jQ ?

а подробнее?

про себя говорим, что ок, здорово, человек слышал где-то модное слово.

Заказчику говорим: ок, посадим.

И сажаем. Бутстрап — это же не только сетка. А сетка в нём настолько гибкая, что ею можно абсолютно любую компоновку сделать.

jquery проста для понимания и по скорости освоения

спору нет. Можно за несколько минут освоить, как прикрутить слайдер. Но дальше-то что?

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

А тем временем jQuery дико бороздит DOM, проверяются условия наличия классов или дата-атрибутов у элементов. Сами данные где попало, взаимодействие — как ЛММ на душу положит. Это же самому разработчику неудобно, я об этом. И ладно бы за это неудобство платили огромные деньги. Так ведь именно что большие деньги за нашу работу в принципе не особо часто платят.

это довольно правильная темка

Так ведь тот же реакт тоже давно себя зарекомендовал. Или ангуляр (ничуть его не умаляю, просто его толком не знаю).

А вот про фронтэндщика на 25тыщ не совсем понятно. И зачем контент-менеджеру jQuery — тоже не совсем ясно.

Да и одно другого ведь не исключает. Если уж прям действительно надо контент-менеджеру воткнуть скрипт на jQuery в текст статьи, то если сайт на реакте, делается это точно так же, как и на сайте без оного. Непонятно только зачем.

Речь в первую очередь не об этом, а о процессе разработки.