react-zeanium-ui-ui/src/ui/BottomPopupView.less

Zeanium UI Framework for React.js

@pop-bg-color: #FFFFFF;

.c-bottom-popup-view{
    position: relative;
    /*background-color: @pop-bg-color;*/
    &>.popup{
        display: none;
        margin-top: 1px;
        position: absolute;
        width: 100%;
        background-color: @pop-bg-color;
        box-shadow: 0 2px 12px rgba(0,0,0,.175);
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        -webkit-transition: .45s;
        transition: .45s;
        border-radius: 3px;
    }
    &[data-active=true]{
        &>.popup{
            display: block;
            z-index: 10;
            height: auto;

            -webkit-transform: translate(0);
            transform: translate(0);
        }
    }
    &>.view{
        overflow: hidden;
        cursor: pointer;
        &>.input{
            &>.label{
                float: left;
                min-height: 22px;
                line-height: 22px;
            }
            &>.icon{
                display: none;
                width: 24px;
                position: absolute;
                right: 0px;
                &>.fa{
                    margin: 5px;
                }
            }
            &:hover{
                &>.icon{
                    display: block;
                }
            }
        }
    }
}