Мобильная версия сайта для интернет-магазина

Нужно разработать мобильную версию сайта vse-apple.ru

ТЗ:

Шапка главной страницы разделена на две части:

1. Меню

2. Контакты

Под шапкой наименование "vse-apple.ru".

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

Отдельный блок "Товарное предложение":

1. Сверху наименование товара.

2. Под ним изображение на всю ширину экрана девайса.

3. Под ним слева - "Стоимость", справа - "Положить в корзину".

4. Ниже текст с описанием в две-три строчки, если оно больше, то можно прочитать с помощью "Подробнее".

5. Если нажимаем на наименование товара, то пользователь переходит на Личную страницу товара.

Личная страница: также содержит кнопки "Меню" и "Контакты", под ними наименование сайта, ниже Хлебные крошки, под ними наименование товара, картинка, несколько картинок предпросмотра этого товара (если они имеются), далее ниже "Стоимость" и "Положить в корзину" и ещё ниже расширенное описание этого товара.

При нажатии на меню выкатывается поле горизонатльно разделенное на две части:

Верхняя часть - главное меню сайта: доставка, контакты, о сайте, гарантия...

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

Также внизу всего этого меню будет кнопочка "Показать все товары", где будут подгружаться все товары в блочной системе по дате добавления на сайт либо обновления на сайте, где загружаются последние 20 товаров, если человек прокручивает ниже, то система автоматически догружает следующие 10.

Контакты - выкатывается поле, где указаны телефоны, адрес и встроенная гугл карта.

В подвале - кнопка "Перейти на полную версию сайта".