Segment

Example

<Segment
  actions={frontmatter.actions}
  className="u-font-size-1 u-gap-s s-flex-row"
  element="button"
  globals={globals}
  pageUrl="/demo-b"
/>

Example

<Segment
  actions={frontmatter.actions}
  actionClassName="fat-link"
  className="u-gap-s s-flex-row"
  element="a"
  globals={globals}
  pageUrl="/demo-b"
/>

Example

<Segment
  actions={frontmatter.actions}
  className="u-font-size-1 u-gap-s s-flex-row"
  element="a"
  globals={globals}
  pageUrl="/demo-b"
/>

Example

<Segment
  actions={frontmatter.actions}
  className="s-flex-column u-gap-s"
  element="button"
  globals={globals}
  pageUrl="/demo-b"
/>

Example

<Segment
  actions={frontmatter.actions}
  className="u-gap-2xs s-flex-row"
  element="a"
  globals={globals}
  pageUrl="/demo-b"
/>

Frontmatter

navigation:
  parent: Components
  url: /override/default/url

actions:
  - heading: Item A
    icon: archive
    url: /demo-a
  - heading: Item B
    icon: clock
    url: /demo-b
  - heading: Item C
    url: /demo-c
  - heading: Item D
    url: /demo-d
  - heading: Item E
    url: /demo-e