📕
[ARCHIVED] Cape Agulhas App
  • Home
  • User guide
    • Installation
    • User accounts and service requests
    • Supported devices
    • Troubleshooting
    • How do I reset notification preferences?
    • Enable Notifications from Settings Page
  • Administrator guide
    • Managing content
    • Pages
      • Councillors
      • Services
    • Snippets
    • Notices and Notifications
    • Important Contacts
    • Icons
    • App Environments
    • Administrator accounts
  • API
    • Overview
    • Web hooks
    • Web push
    • Accounts
    • User authentication (JWT Token)
    • Service Requests
  • Development
  • Software Development
  • Architectural Decision Records
    • ADR01: Single page app vs server-side templating
    • ADR02: custom web push backend or which service
  • Collaborator Service Requests Integration
  • Deployment
  • Design System and Component Library
    • Webflow exports & changelog
    • Component library
    • Link Blocks
    • Form Elements
    • Grids
Powered by GitBook
On this page
  • Default grid:
  • Container classes
  • Usage
  • Thirds grid:
  • Container classes
  • Usage

Was this helpful?

  1. Design System and Component Library

Grids

PreviousForm Elements

Last updated 4 years ago

Was this helpful?

Default grid:

Container classes

grid--default

Usage

This grid should be used within each tab-content and page-content element. It is used to ensure that the default spacing between elements is correct.

Thirds grid:

Container classes

grid--thirds

Usage

This grid should be placed within the default grid in order to create a 3 across layout.

The thirds grid being used to correctly space action blocks
The thirds grid within a default grid containing action blocks