# Reference

Ready

- HTML
- View
- Context
- Assets
- Info
- Notes

`

    <section class="reference">
        <a href="#" class="reference__link">
            <img class="reference__image" src={context.app.uri("assets/logos/business_technology.svg")} alt="Business technology" />
        </a>
        <p class="reference__description">
            Spicy jalapeno bacon ipsum dolor amet t-bone sirloin culpa, tenderloin tempor ullamco flank rump. Biltong corned beef pork loin et. Labore dolore laborum pork laboris. Do alcatra ball tip consequat venison spare ribs pig. Bresaola boudin chuck, spare ribs officia mollit ut esse est jowl minim.
        </p>
    </section>

`
`

    <section class="reference">
        <a href="#" class="reference__link">
            <img class="reference__image" src={context.app.uri("assets/logos/business_technology.svg")} alt="Business technology" />
        </a>
        <p class="reference__description">
            Spicy jalapeno bacon ipsum dolor amet t-bone sirloin culpa, tenderloin tempor ullamco flank rump. Biltong corned beef pork loin et. Labore dolore laborum pork laboris. Do alcatra ball tip consequat venison spare ribs pig. Bresaola boudin chuck, spare ribs officia mollit ut esse est jowl minim.
        </p>
    </section>

`
`

    /* No context defined. */

`
File:

- Content:
  `

      .reference {
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-bottom: 0;
      }

      .reference__image {
        max-width: 50%;
        margin: 0 auto $spacer-sm;
      }

      .reference__link {
        @extend %block-link;

        text-align: center;
      }

      .reference__description {
        @extend %heading-font-regular;

        margin-right: auto;
        margin-left: auto;
        font-size: $font-size-base;
        text-align: center;
      }

      @media screen and (min-width: $grid-breakpoint-md) {
        .reference {
          margin-bottom: $spacer-lg;
        }

        .reference__image {
          max-width: 40%;
          margin: 0 auto $spacer-base;
        }
      }

  `
- URL: /components/raw/reference/_reference.scss
- Filesystem Path: components/04-molecules/reference/_reference.scss
- Size: 587 Bytes

- Handle: @reference
- Preview:
  - With layout
  - Component only
- Filesystem Path: components/04-molecules/reference/reference.html

No notes defined.