HTML, CSS, template engine. Доробки модулів CMS.

В пошуках фрілансера для виконання серії завдань, що пов'язані з розробкою HubSpot CMS theme. Досвід з HubSpot CMS (розробка модулів) не обов'язковий, але буде плюсом.

Вимоги до виконавця: 

1. Гарний рівень знань HTML/CSS, досвід розробки pixel-perfect, responsive макетів з використанням Flexbox та СSS Grid.
2. Слідування Accessibility Principles.
3. Досвід роботи з будь-яким template engine або react/vue/angular, або досвід програмування PHP (як мови, що має вбудовану функцію шаблонізатора).
4. Досвід з JS/jQuery. Наразі це не дуже складні функціі накшталт динамічних елементів сторінок (accordion, modals, etc.).
5. Досвід роботи створення макетів сторінок у visual page editors (будь-які,  де використовується сітка та блоки/компоненти/модулі/віджети).
6. Досвід роботи з Git та GitHub.
7. Досвід роботи з Sass/SCSS/Less буде плюсом.
8. Досвід розробки themes для будь-якої CMS, наприклад WordPress, буде плюсом.
9. Досвід розробки custom блоків/компонентів/модулів/віджетів для visual page editors, наприклад WP Bakery або WordPress Gutenberg (або інших) буде великим плюсом.

Intro:

Робота над темою для HubSpot CMS, що містить набір page templates, sections, modules. 

Шаблони сторінок складаються з секцій. Секції включають в себе модулі, сітки (СSS Bootstrap-like grid with rows and 12 columns) та drag'n'drop areas. При створенні нової сторінки користувач обирає один з шаблонів та редагує сторінку у візуальному редакторі. CMS надає набір стандартних модулів, які можуть бути додані до d'n'd зон. Тема, яку ми розробляємо, включає в себе набір custom modules для редагування/відображення форматованих даних.

Код templates/sections/modules це HTML з вбудованою мовою-шаблонізатором HubL. CSS код також використовує HubL як pre-processor. Hubl підтримує макроси (можуть бути відомі вам у інших технологіях як "mixins"). Розробка відбувається у Visual Studio Code з плагіном для підсвітки синтаксису.

Модулі мають набір fields (полів), що редагуються у візуальному редакторі cторінки. Структура, типи полів та їх default values задаються у наборі JSON файлів. Модулі можуть включати в себе правила відображення  JSON файли є великими та не дуже зручними для редагування, але CMS має вбудований додатковий візуальний редактор редагування полів.

Кожне поле модуля має значення за замовчуванням, поля об'єднуються у групи, тож групи також мають значення за замовчуванням, що є у пріорітеті над значенням окремих полів. Модулі мають параметри, секції через параметри модулів можуть задавати значення полів за замовчуванням, що мають ще більший приорітет.

Важливо розуміти, що CMS не може бути розгорнута локально, тобто кожен файл теми має бути завантажений на сервер CMS. Втім, для зручності локальної розробки використовуються CLI інструмент з функцією Watcher, тобто усі локальні зміни автоматично завантажуються на сервер розробки.

Завдання:

Код теми для доробки буде наданий обраному виконавцю.

Завдання №1:
Create preset drop-down for button styles (solid, outline, arrow, underline, simple link) in the Custom Button module.
Додати додаткове поле для модулю, що стилізує custom модуль кнопки та задає її стиль.
Імплементація за аналогією з вбудованою функцією Presets у default темі "Growth theme".
Спеціфікація стилів та приклад коду з Growth theme буде наданий обраному виконавцю.

Завдання №2:

Trust Marks module - Add logo alignment style control.

Додати поля для вирівнювання логотипу всередині модулю (left, center, right) за допомогою flexbox. Модуль має два режими відображення (Card and Simple modes) - вже існуюча функціональність. 

Деталі співпраці

1. Оплата договірна, будь-ласка пишіть ваші фіксовані оцінки та/або уточнюючі питання. 

2. Наразі я маю ще декілька завдань у цьому ж проекті, та їх буде більше. Завдання 1 та 2 я розцінюю як оплачуване тестове завдання для початку більш тривалої співпраці.

3. Розраховую на прозорість зі сторони Виконавця. Прошу надавати інформацію: коли ви можете бути на зв'язку (дні та години), коли ви можете розпочати роботу, очікуваний час завершення роботи, зміни статусу та прогресу завдань, деталі щодо ускладнень у роботі та можливих затримок результату (щось йде не так - скажіть, і ми знайдемо рішення).

4. Робота на результат. Це включає в себе обговорення та виконання правок. Можливість доплати за правки обговорюється у кожному випадку окремо та є нормальною практикою у разі доповнення завдання (з'являються нові деталі або ТЗ має прогалини).

5. Уважність до деталей. У відгуку до проекту приведіть ваш найбільш релевантний досвід та (дякую за розуміння) напишіть назву однієї з HubL functions (довільний вибір з документації), таким чином Ваша пропозиція не загубиться серед copy&paste повідомлень.

Getting Started Guide + Key Concepts Page

If you haven’t already found it, this guide for developers should be your first stop. You’ll learn how to set up our local development tooling, download boilerplate files, and create and edit your first project. Next, take a look at this Key Concepts page for a high-level look at how the CMS is designed to work.

HubL functions documentation