title: Box
label: Box
status: deprecated
component-type: deprecated
hidden: true
context:
  component-type: deprecated
variants:
  - name: default
    hidden: true
  - name: very-easy
    hidden: true
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      box_modifier: vf-box--very-easy
  - name: easy
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: easy
  - name: easy primary
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: primary
      variant: easy
  - name: easy secondary
    hidden: true
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: secondary
      variant: easy
  - name: easy tertiary
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: tertiary
      variant: easy
  - name: easy quaternary
    hidden: true
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: quaternary
      variant: easy
  - name: easy quinary
    hidden: true
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: quinary
      variant: easy
  - name: normal
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: normal
  - name: normal primary
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: primary
      variant: normal
  - name: normal secondary
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: secondary
      variant: normal
  - name: normal tertiary
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: tertiary
      variant: normal
  - name: normal quaternary
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: quaternary
      variant: normal
  - name: normal quinary
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: quinary
      variant: normal
  - name: hard
    hidden: true
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: hard
  - name: extreme
    hidden: true
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: extreme
  - name: intense
    hidden: true
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: intense
  - name: "400"
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: normal
      theme: primary
      box_spacing: 400
  - name: "600"
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: normal
      theme: primary
      box_spacing: 600
  - name: "800"
    context:
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      variant: normal
      theme: primary
      box_spacing: 800
  - name: easy primary is a link
    context:
      box_href: "JavaScript:Void(0);"
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: primary
      variant: easy
  - name: normal primary is a link
    context:
      box_href: "JavaScript:Void(0);"
      box_heading: Did you know?
      box_text: This is some more content that would be in the box.
      theme: primary
      variant: normal
  - name: normal primary is a link inner text link
    context:
      box_href: "JavaScript:Void(0);"
      box_heading: Did you know?
      box_text: This is some more <a href="https://www.emblg.org">content with a link</a> that would be in the box.
      theme: primary
      variant: normal