The “Ratio” module allows applying different aspect ratios to images. CSS property padding-top is employed.

Classes

Ratio / Square

Ratio / Square Tab

Ratio / Square Mob

Ratio / Panorama

Ratio / Panorama Tab

Ratio / Panorama Mob

Ratio / Landscape

Ratio / Landscape Tab

Ratio / Landscape Mob

Ratio / Standard

Ratio / Standard Tab

Ratio / Standard Mob

Ratio / Tall

Ratio / Tall Tab

Ratio / Tall Mob

Ratio / Skyscaper

Ratio / Skyscaper Tab

Ratio / Skyscaper Mob

Ratio / Cover

Index

• The System
  1. 4 class types
     1. Basic classes
     2. Component classes
     3. Structural classes
        1. Custom
        2. Page
        3. Section
        4. Container
        5. Grid
     4. Functional Classes
        1. Vertical
        2. Horizontal
        3. Padding
        4. Heading
        5. Color
        6. Font Size
        7. Font Style
        8. Font
        9. Bg
        10. Line Height
        11. Align
        12. Position
        13. Display
        14. Ratio
  2. Class combination
     1. Combo-classes
     2. Muti-classes
  3. Foundational scales
     1. Foundational scale for headings
     2. Foundational scale for heading in Rich Text
     3. Foundational scale for body text
     4. Foundational scale for spacing
  4. Grid
  5. Gap