Потрібно відредагувати css значення @media для адаптивного меню
Добрий день. Потрібна людина яка розбирається в адаптивній html верстці, css, scss, js щоб зробити деякі правки в шаблоні які стосуються меню.
Я спробую максимально детально розписати всі моменти.
Є html шаблон: https://welly.dexignzone.com/xhtml/index.html
Він адаптований під різні екрани. Зліва є вертикальне меню з логотипом та гамбургером. В залежності від ширини екрану всі ці 3 елементи змінюються. Як ви можете бачити є три варіанти ширини:
- меню 1 яке з'являється до ширини в 768px
- меню 2 яке з'являється після ширини в 768px і до ширини 1300px
- меню 3 яке з'являється після ширини в 1300px
Також видно як зі зміною меню міняються розміри логотипа на різних екранах.
Тапер задачі:
1. Потрібно видалити меню 2 із діапазону від 768px до 1300px + видалити правила для логотипа і гамбургера для цього діапазону.
2. Збільшити (змінити) діапазон меню 3. Щоб воно показувалось починаючи з 1000 px, а разом з ним відповідний логотип і гамбургер.
3. Збільшити (змінити) діапазон меню 1, щоб воно показувалось до ширини в 1000 px, а разом з ним логотип, який показується на ширині від 576 px і гамбургер.
Таким чином, має залишитися меню 1 з двома розмірами логотипів та гамбургером на ширині до 1000 px та меню 3 з логотипом та гамбургером на ширині від 1000 px.
4. Для меню 3. Коли натиснути на гамбургер для меню 3, то саме меню та логотип звузиться до лівого краю екрану і буде утворювати вузький вертикальній блок з іконками і випадаючим з правого боку списком при наведенні на деякі іконки. Так ось, з цього вертикального вузького блоку (списку, меню) потрібно видалити той випадаючий список з правого боку при наведенні на іконку. Також потрібно видалити зелений колір бекграунду при наведенні на іконку в цьому блоці. Іншими словами, цей блок має бути сугубо як декоративний елемент без випадаючих списків та зміни кольору при наведені на іконку.
5. Для меню 1, при його визові по копці гамбургера потрібно під ним затемнити екран та прибрати меню по кліку по темному екрану. Приклад такого затемнення можна побачити в відомому шаблоні https://adminlte.io/themes/v3/index.html, на маленькому екрані.
Здається все. Я надам файли шаблону для редагування. Пропонуйте свої ціни та терміни. Дякую.
Заявки фрилансеров


