@import "variables.less";

registry-image-layers {
    border: 1px solid @sidebar-pf-border-color;
    display: block;
    overflow-y: auto;
    max-height: 200px;
}

ul.registry-image-layers {
    list-style: none;
    background-image: -webkit-linear-gradient(top, #fff 12px, #d3d3d3 15px);
    background-image: -moz-linear-gradient(top, #fff 12px, #d3d3d3 15px);
    background-image: -o-linear-gradient(top, #fff 12px, #d3d3d3 15px);
    background-image: linear-gradient(top, #fff 12px, #d3d3d3 15px);
    background-size: 2px 100%;
    background-repeat: no-repeat;
    margin: 8px 10px 15px 15px;
    padding-left: 0px;
    font-size: 13px;

    li {
        clear: both;
    }

    li:before {
        content: "\f111"; /* circle */
        font-family: FontAwesome;
        font-size: 19px;
        line-height: 19px;
        float: left;
        display: block;
        color: #0099ff;
        position: relative;
        left: -7px;
        top: 1px;
        padding-bottom: 9px;
    }

    li.hint-add:before {
        color: #555753;
    }

    li.hint-run:before {
        color: #4e9a06;
    }

    li:first-child:before {
        content: "\f0ab"; /* fa-circle-arrow */
    }

    li:last-child:before {
        top: 2px;
        background-color: white;
    }

    span {
        display: block;
        float: right;
    }

    p {
        font-family: monospace;
        margin-bottom: 0px;
        overflow: hidden;
        text-overflow: ellipsis;
        padding-right: 15px;
        white-space: nowrap;
        font-size: 12px;
    }
}