Зі структурою HTML для нижнього колонтитула ми маємо те, що нам потрібно, щоб почати стиль і отримати цей нижній колонтитул схожим на те, що ми розробили в Photoshop.
Ми створюємо новий файл SCSS лише для нижнього колонтитула, тому що це просто має сенс продовжувати модулювати, і саме це ми робили для всього іншого. Ми @імпортуємо його в основну таблицю стилів внизу.
Ми затемнюємо нижній колонтитул, використовуючи лише невеликий фон RGBa. Sass нам трохи допомагає, тому що ви можете зробити це в Sass, що надзвичайно круто rgba(black, 0.5):; Ми використовуємо тінь вставного вікна, щоб створити ефект, схожий на полицю.
Ми відсуваємо вміст подалі від країв за допомогою лівого та правого відступів. Відразу нам потрібно відрегулювати кількість цього заповнення на основі поточної точки зупинку.
Нижній нижній колонтитул ми оформляємо приблизно так само. Тільки трохи темніше, щоб виглядати на інший рівень нижче.