FAA Pattern Library - Music

Empty Listing Error 

<div class="empty-listing-error empty-listing-error--music empty-listing-error--light">
    <div class="empty-listing-error__content">
        <h2 class="empty-listing-error__heading">Oh dang, there's no content</h2>
        <div class="empty-listing-error__message">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo.</div>
    </div>
</div>
 
<div class="empty-listing-error empty-listing-error--{{ siteUnit }} empty-listing-error--{{ background }}">
    <div class="empty-listing-error__content">
        <h2 class="empty-listing-error__heading">{{ listingError.heading }}</h2>
        <div class="empty-listing-error__message">{{ listingError.message }}</div>
    </div>
</div>
 
{
  "siteUnit": "music",
  "departmentName": "Music",
  "background": "light",
  "listingError": {
    "heading": "Oh dang, there's no content",
    "message": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo."
  }
}
  • Content: 
    .empty-listing-error
    --backgroundColor cloud
    --textColor greyDarkest

    &--light
        --backgroundColor cloud
        --textColor greyDarkest

    &--dark
        --backgroundColor charcoalLighter
        --textColor white

    padding-bottom 80px

    +above(800px)
        padding-bottom 128px

    &__content
        @extends $componentWithMargin
        background-color var(--backgroundColor)
        fluid(padding-top padding-bottom, 500px, maxContentWidth, 48px, 64px)
        fluid(padding-left padding-right, 500px, maxContentWidth, 24px, 48px)

    &__heading
        @extends $headline1
        color var(--textColor)
        margin-bottom 16px

    &__message
        @extends $detail
        color var(--textColor)
  • URL: /components/raw/empty-listing-error/empty-listing-error.styl
  • Filesystem Path: components/partials/empty-listing-error/empty-listing-error.styl
  • Size: 741 Bytes

There are no notes for this item.