<div class="people-header people-header--network">
    <div class="people-header__back-button">
        This is navigation
    </div>
    <div class="people-header__content">
        <div class="people-header__primary-info">
            This is content
        </div>
        <div class="people-header__photo">
            This is photo
        </div>
    </div>
</div>
<div class="people-header people-header--{{ siteUnit }}">
    <div class="people-header__back-button">
        {% block navigation %}
This is navigation
        {% endblock %}
    </div>
    <div class="people-header__content">
        <div class="people-header__primary-info">
            {% block content %}
    This is content
            {% endblock %}
        </div>
        <div class="people-header__photo">
            {% block photo %}
    This is photo
            {% endblock %}
        </div>
    </div>
</div>
{
  "siteUnit": "network",
  "departmentName": "Network",
  "background": "light"
}
  • Content:
    .people-header
        full = 1000px
        medium = backButtonBreakpoint
        background-color cloud
        padding-top 42px
        padding-bottom 64px
    
        &--college
            background-color white
    
        &--durp
            border-top 8px solid illiniOrange
    
        &--music
            background-color almaMaterDark
    
        &__back-button
            margin-bottom 32px
            @extends $contentContainer
        &__content
            +above(medium)
                display flex
            @extends $contentContainer
        &__primary-info
            flex 1
            max-width 520px
            order 2
        &__photo
            align-self flex-start
            flex 0 0 23%
            order 1
            +above(medium)
                max-width 208px
            +below(medium)
                margin-top 48px
            +above(medium)
                margin-right 4.6%
    
        &--music .captioned-image__caption
            color rgba(255, 255, 255, 0.75)
    
  • URL: /components/raw/people-header/people-header.styl
  • Filesystem Path: components/templates/people-header/people-header.styl
  • Size: 864 Bytes

There are no notes for this item.