superdesk/superdesk-client-core

View on GitHub
styles/sass/search-list.scss

Summary

Maintainability
Test Coverage
.search-list {
    position: relative;
    width: 100%;
    border: 1px solid #d0d0d0;

    .search-list-button {
        width: 98%;
        padding: 4px;
        background-color: $white;
        border: 0;
        border-radius: 2px !important;
        text-align: start;
        .caret {
            position: absolute;
            inset-block-start: 12px;
            inset-inline-end: 10px;
        }
    }

    .search-list-content {
        position: absolute;
        z-index: $zindexDropdown;
        inset-block-start: 100%;
        width: 100%;
        margin: 0px;
        padding: 4px;
        background-color: $white;
        @include box-shadow(0 3px 5px rgba(0,0,0,.2));
        box-sizing: border-box;
        border: 1px solid #dcdcdc;

        .close-list {
            position: absolute;
            inset-inline-end: 5px;
            inset-block-start: 5px;
            border: 0;
            background: none;
            border-radius: 2px;
            line-height: 15px;
            height: 15px;
        }

        .selected-list {
            margin-inline-end: 2px;
            border-block-end: 1px solid #d0d0d0;
            width:98%;
            box-sizing: border-box;
            .selected-helper {
                margin-inline-start: 40px;
            }
        }

        .unselected-list {
            input {
                margin-inline-start: 20px;
                width: 200px;
                inset-inline-start: 0;
                inset-inline-end: 0;
                inset-block-start: 0;
                height: 28px;
                border: 1px solid #dcdcdc !important;
                box-sizing: border-box;
            }
            .pagination {
                button {
                    border: 0;
                    color: $black;
                    inset-inline-start: 0;
                    inset-inline-end: 0;
                    inset-block-start: 0;
                    border-radius: 2px;
                    line-height: 15px;
                    height: 15px;
                }
            }
            .page-info {
                margin-inline-end: 2px;
                border-block-end: 1px solid #d0d0d0;
                box-sizing: border-box;
                width:98%;
            }
        }
        .select-button {
            padding: 4px;
            margin-inline-start: 10px;
            background-color: $white;
            border: 0;
            text-align: start;
            width:97%;
            &:hover {
                background-color: #f0f0f0;
            }
        }
    }
}