Bricks

Setup dùng Style Manager là chính, tận dụng các global font, variables, classes.

Design

Màu sắc

Accent: #ff0000 Gradient: background: linear-gradient(180deg, #E0BE88 0%, #755627 100%);

Font

Font toàn trang là Play (Google Fonts).

Cách setup:

• Edit 1 page bất kỳ (trang chủ)
• Click icon Settings > Font Manager
• Chọn Google Fonts > tìm font Play > Add to Favorites
• Sau đó vào admin > Bricks > Settings > Builder > Control panel, phần Font family: Options chọn Show favorites only để khi edit các element thì chỉ cho phép chọn các font favorite thôi (để tránh chọn nhiều font trên web).

Cách setup font cho các element:

• Edit 1 page bất kỳ (trang chủ)
• Click icon Settings > Style Manager > Tạo 1 style là DongA
• Chỉnh sửa các style cho body, h1, h2, ...

Elements

Setup chung trong Style Manager: Edit 1 page bất kỳ (trang chủ) > Click icon Settings > Style Manager

• Button

Class chung

.text-gradient: chữ màu đồng gradient .section-border: có border gradient cuối section .bg-gradient: background màu đồng gradient .image-zoom: zoom ảnh khi hover. Dùng cho wrapper. Nếu dùng trực tiếp cho ảnh thì set HTML tag của ảnh là figure.

Bricks

Settings:

• Disable Bricks Open Graph meta tags
• Disable Bricks SEO meta tags
• Disable "Skip links"
• Smooth scroll (CSS)

Notes

• LƯU Ý QUAN TRỌNG: cần dùng đúng các elements sau:
  • section: dùng cho các
    (semantic), như ở trang chủ
  • block: tương đương với flex wrapper, dùng cho các block nhỏ
  • div: thẻ div thường
  • container: có container width cho content
• Social icons: ở trong footer, dùng element button + svg
• Header: CSS và JS cho toggle menu đều để ở trong element Code (button open menu) trong template Header.