index.styl

/**
 * @file flex-stylus-class
 * @author zhangsiyuan(1021808625@qq.com)
 */

// for android 4.3-
.c__flex > *
    display: block

.c__flex
    display flex
    flex-direction row
    height 100%
    width 100%
    &.c__flex-auto > *
        flex auto
    &.c__flex-equal > *
        flex 1 1 0
    &.c__vertical
        flex-direction column
    &.c__wrap-reverse
        flex-wrap wrap-reverse
    &.c__wrap
        flex-wrap wrap
    &.c__start
        justify-content flex-start
    &.c__end
        justify-content flex-end
    &.c__center
        justify-content center
    &.c__between
        justify-content space-between
    &.c__around
        justify-content space-around
    &.c__top
        align-items flex-start
    &.c__bottom
        align-items flex-end
    &.c__middle
        align-items center
    &.c__baseline
        align-items baseline
    &.c__stretch
        align-items stretch
    & .i__top
        align-self flex-start
    & .i__bottom
        align-self flex-end
    & .i__middle
        align-self center
    & .i__baseline
        align-self baseline
    & .i__stretch
        align-self stretch