\---
title: Patterns
\---
.breezeblocks-patterns
  %a.js-menu-trigger-breezeblocks.breezeblocks-menu-anchor.fixedsticky
    %img{alt: "Menu icon", src: "/images/menu.png"}/
  .js-menu-screen-breezeblocks.breezeblocks-menu-screen
  = partial "breezeblocks-hero"
  = partial "breezeblocks-menu"
  #example
    %section#accordion-tabs.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Accordion / Tabs
        = partial "accordion_tabs"
      .refill-snippet= code_for("accordion_tabs")
      .breezeblocks-wrapper
        = partial "accordion_tabs_minimal"
      .refill-snippet= code_for("accordion_tabs_minimal")
    %section#cards.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Cards
        .refill-centering= partial "cards"
      .refill-snippet= code_for("cards")
    %section#centered-navigation.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Centered Navigation
        = partial "centered_navigation"
      .refill-snippet= code_for("centered_navigation")
    %section#comment.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Comments
        .refill-centering
          .refill-smaller= partial "comment"
      .refill-snippet= code_for("comment")
    %section#device.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Device
        = partial "device"
      .refill-snippet= code_for("device")
    %section#flex-boxes.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Flex Boxes
        = partial "flex_boxes"
      .refill-snippet= code_for("flex_boxes")
    %section#footer.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Footers
        .refill-centering= partial "footer"
      .refill-snippet= code_for("footer")
      .breezeblocks-wrapper
        .refill-centering= partial "footer_2"
      .refill-snippet= code_for("footer_2")
    %section#grid-items.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Grid Items
        .refill-centering= partial "grid_items"
      .refill-snippet= code_for("grid_items")
      .breezeblocks-wrapper
        .refill-centering= partial "grid_items_lines"
      .refill-snippet= code_for("grid_items_lines")
    %section#hero.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Hero Unit
        = partial "hero"
      .refill-snippet= code_for("hero")
    %section#icon-bullet-points.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Icon Bullet Points
        = partial "icon_bullet_points"
      .refill-snippet= code_for("icon_bullet_points")
    %section#maps.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Maps
        = partial "maps"
      .refill-snippet= code_for("maps")
    %section#navigation.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Navigation
        = partial "navigation"
      .refill-snippet= code_for("navigation")
    %section#scroll-on-page.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Scroll On Page
        .refill-centering
          .refill-smaller= partial "scroll_on_page"
      .refill-snippet= code_for("scroll_on_page")
    %section#search-tools.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Search Tools
        = partial "search_tools"
      .refill-snippet= code_for("search_tools")
    %section#side-image.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Side Image
        = partial "side_image"
      .refill-snippet= code_for("side_image")
    %section#tables.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Tables
        = partial "tables"
      .refill-snippet= code_for("tables")
      .breezeblocks-wrapper
        = partial "tables_minimal"
      .refill-snippet= code_for("tables_minimal")
    %section#vertical-tabs.refill
      .breezeblocks-wrapper
        .line-behind-text
          %h6 Vertical Tabs
        = partial "vertical_tabs"
      .refill-snippet= code_for("vertical_tabs")
= partial "breezeblocks-page-scripts"