# The title shown on the component page
title: Hero
# Label shown on index pages
label: Hero
status: beta
preview: "@preview--nogrid"
# The template used from /components/_previews
#
# Per-variant options
# variants:
# - name: default
#   hidden: true
context:
  component-type: container



variants:
  - name: default
    context:
      vf_hero_kicker: <a href="JavaScript:Void(0);">VF Hamburg</a> | Structural Biology
      vf_hero_heading: About the Hentze group!
      vf_hero_heading_href: JavaScript:Void(0);
      vf_hero_subheading: an example of some ancillary text
      vf_hero_text:
        - The Hentze group combines biochemical and <a href="JavaScript:Void(0);">systems–level approaches</a> to investigate the connections between <a href="JavaScript:Void(0);">gene expression</a> and <a href="JavaScript:Void(0);">cell metabolism</a>, and their roles in human disease.
      vf_hero_link_text: Learn more
      vf_hero_link_href: JavaScript:Void(0);
      vf_hero_image_size: auto 28.5rem
      angular:
        <vf-hero
        [vf_hero_kicker]="'<a href=JavaScript:Void(0);>VF Hamburg</a> | Structural Biology'"
        [vf_hero_heading]="'About the Hentze group!'"
        [vf_hero_heading_href]="'JavaScript:Void(0);'"
        [vf_hero_subheading]="'an example of some ancillary text'"
        [vf_hero_text]="['The Hentze group combines biochemical and <a href=JavaScript:Void(0);>systems–level approaches</a> to investigate the connections between <a href=JavaScript:Void(0);>gene expression</a> and <a href=JavaScript:Void(0);>cell metabolism</a>, and their roles in human disease.']"
        [vf_hero_link_text]="'Learn more'"
        [vf_hero_link_href]="'JavaScript:Void(0);'"
        [vf_hero_image_size]="'auto 28.5rem'">
        </vf-hero>

  - name: default with image
    context:
      vf_hero_kicker: <a href="JavaScript:Void(0);">VF Hamburg</a> | Structural Biology
      vf_hero_heading: About the Hentze group!
      vf_hero_subheading: an example of some ancillary text
      vf_hero_text:
        - The Hentze group combines biochemical and <a href="JavaScript:Void(0);">systems–level approaches</a> to investigate the connections between <a href="JavaScript:Void(0);">gene expression</a> and <a href="JavaScript:Void(0);">cell metabolism</a>, and their roles in human disease.
      vf_hero_link_text: Learn more
      vf_hero_link_href: JavaScript:Void(0);
      vf_hero_image: url('https://acxngcvroo.cloudimg.io/v7/https://www.embl.org/files/wp-content/uploads/vf-hero-intense.png');
      angular:
        <vf-hero
        [vf_hero_kicker]="'<a href=JavaScript:Void(0);>VF Hamburg</a> | Structural Biology'"
        [vf_hero_heading]="'About the Hentze group!'"
        [vf_hero_subheading]="'an example of some ancillary text'"
        [vf_hero_text]="['The Hentze group combines biochemical and <a href=JavaScript:Void(0);>systems–level approaches</a> to investigate the connections between <a href=JavaScript:Void(0);>gene expression</a> and <a href=JavaScript:Void(0);>cell metabolism</a>, and their roles in human disease.']"
        [vf_hero_link_text]="'Learn more'"
        [vf_hero_link_href]="'JavaScript:Void(0);'"
        [vf_hero_image]="'url(https://acxngcvroo.cloudimg.io/v7/https://www.embl.org/files/wp-content/uploads/vf-hero-intense.png)'">
        </vf-hero>

  - name: spacing (400)
    context:
      spacing: 400
      vf_hero_heading: A journey through bioinformatics
      vf_hero_text:
        - Explore resources from EMBL-EBI
      vf_hero_image_size: auto 28.5rem
      angular:
        <vf-hero
        [spacing]="400"
        [vf_hero_heading]="'A journey through bioinformatics'"
        [vf_hero_text]="['Explore resources from EMBL-EBI']"
        [vf_hero_image_size]="'auto 28.5rem'"></vf-hero>
  - name: spacing (800)
    context:
      spacing: 800
      vf_hero_heading: About the Hentze group!
      vf_hero_link_text: Learn more
      vf_hero_link_href: JavaScript:Void(0);
      vf_hero_image_size: auto 28.5rem
      angular:
        <vf-hero
        [spacing]="800"
        [vf_hero_heading]="'About the Hentze group!'"
        [vf_hero_link_text]="'Learn more'"
        [vf_hero_link_href]="'JavaScript:Void(0);'"
        [vf_hero_image_size]="'auto 28.5rem'"></vf-hero>
  - name: spacing (1200)
    context:
      spacing: 1200
      vf_hero_heading: About the Hentze group!
      vf_hero_subheading: an example of some ancillary text
      vf_hero_link_text: Learn more
      vf_hero_link_href: JavaScript:Void(0);
      vf_hero_image_size: auto 28.5rem
      angular:
        <vf-hero
        [spacing]="1200"
        [vf_hero_heading]="'About the Hentze group!'"
        [vf_hero_subheading]="'an example of some ancillary text'"
        [vf_hero_link_text]="'Learn more'"
        [vf_hero_link_href]="'JavaScript:Void(0);'"
        [vf_hero_image_size]="'auto 28.5rem'"></vf-hero>
  - name: spacing (1600)
    hidden: true
    context:
      spacing: 1600
      vf_hero_kicker: <a href="JavaScript:Void(0);">VF Hamburg</a> | Structural Biology
      vf_hero_heading: About the Hentze group!
      vf_hero_subheading: an example of some ancillary text
      vf_hero_link_text: Learn more
      vf_hero_link_href: JavaScript:Void(0);
      vf_hero_image_size: auto 28.5rem
      angular:
        <vf-hero
        [spacing]="1600"
        [vf_hero_kicker]="'<a href=JavaScript:Void(0);>VF Hamburg</a> | Structural Biology'"
        [vf_hero_heading]="'About the Hentze group!'"
        [vf_hero_subheading]="'an example of some ancillary text'"
        [vf_hero_link_text]="'Learn more'"
        [vf_hero_link_href]="'JavaScript:Void(0);'"
        [vf_hero_image_size]="'auto 28.5rem'"></vf-hero>
