gaf-mobile/app/styles/modules/InfoCard.less

GAF mobile Web site

@import (reference) '../themes/variables';

/* Card Module
 * Used to build all cards
 * NOTE: File is current named InfoCard.less, as card.less already exists.
 *       Once card.less is phased out, rename this to Card.less.
 */

@Card-horizontalPadding: 20px;
@Card-border: 1px solid @quaternary-color-xxxxlight;

.Card {
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 10px;
    box-shadow: 0 0 8px -3px fadeout(@quaternary-color-xlight, 10%);

    &-header,
    &-footer {
        padding: 16px @Card-horizontalPadding;
    }

    &-header,
    &-footer {
        background: @septenary-color-xxxlight;
    }

    &-title {
        margin: 0;
        font-size: @type-size;
        font-weight: @type-weight-bold;
        color: @text-color-xdark;
        text-transform: uppercase;
    }

    &-bodySection {
        padding: 12px @Card-horizontalPadding;
        border-top: @Card-border;
        background: @septenary-color-xxxlight;
        line-height: 1.4;
    }

    &-footer {
        border-top: @Card-border;
    }
}