Потрібно зробити HTML/CSS/Javascript шаблони відповідно до доданих описів і візуалізацій. Наш взірець UI дизайну це Jira. Дані шаблони будуть використовуватись для нашого вже наявного вебдодатку:
https://demo.atropim.com/
Всі шаблони мають бути зроблені на основі Pico.css і в плані UI дизайну очікується максимальне дотримання стандартів Pico.css. Розробка UI дизайну не є складовою цього проекту (дизайн задається Pico.css), але все потрібно зробити так, щоб не було враження про "недоробленість" чи "непрофесійність". Розробка додаткових елементів UI, які тут не розписані буде виписана в наступному проекті.
Детальні вимоги:
- Якісне виконання та відсутність багів
- Використовуємо Pico.css як базовий і єдиний фреймворк
- дотримуємось правил, філософії і стилістики picocss (невикористання функціонала пікоцсс і створення альтернативного рішення, якщо такий є буде розцінюватись як баг)
- всі кольори (розрізняємо колір шрифта, колір ліній, колір фону) мають бути параметрами, щоб було чітке розуміння скільки кольорів використовується
- невикористання мардженів і падінгів - вони всі вже прописані в пікоцсс для html елементів
- абсолютна мінімізація використання цсс класів
- максимум 3 розміри шрифта, і 3 кольори шрифта
- кнопочки можуть мати легку закругленість (3пкс)
- для іконок використовуєм тільки Google Fonts Material Symbols - https://fonts.google.com/icons?icon.style=Outlined&icon.set=Material+Symbols
- ніяких тіней і градієнтів
- максимально короткий код цсс
- можливість перемикнутися між світлим і темним модом (базові речі вже передбачені в пікоцсс)
- максимальне використання можливостей СSS3: змінні, apply для mixins, Selectors, Transformations, Grids, Flexbox, ітд
- чіткість UI (відсутність ледве видних елементів, користувач не повинен приглядатись, мружитись і тд)
- мінімальне використання Javascript (Javascript потрібен обовязково для реалізації певниг вимог, зображених на візуалізаціях)
- шаблони потрібно заповнити lorem ipsum'ами і іншими плейсхолдерами так, щоб було видно всі необхідні елементи (наприклад де розташовується скролбар)
- в елементах де використовується текст з іконкою, іконка має бути вертикально посередині тексту
- елементи UI повинні завжди бути візуально по чомусь вирівняні вертикально і/або горизонтально
- виконавець повинен повідомити про джерела де він взяв використаний код (наприклад Javascript), якщо релевантно
- масштаб елементів на макетах є неточним (його не потрібно дотримуватись)
Очікуваний результат:
Реалізовані шаблони 4х html сторінок.
Буду реагувати лише на пропозиції з конкретною ціною.
З радістю відповім на всі запитання.
