alfresco-ng2-components/lib/content-services/document-list/components/document-list.component.scss

@mixin adf-document-list-theme($theme) {
    $foreground: map-get($theme, foreground);
    $background: map-get($theme, background);
    $accent: map-get($theme, accent);
    $primary: map-get($theme, primary);

    .mat-icon.adf-datatable-selected {
        height: 100%;
        width: 100%;
        margin-left: -2px;
        margin-top: 2px;
    }

    .adf-sticky-document-list {
        height: 310px;
        overflow-y: auto;
    }

    .adf-datatable-selected > svg {
        fill: mat-color($accent);
        width: 32px;
        height: 32px;
    }

    .adf-document-list_empty_template {
        text-align: center;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .adf-no-permission__template {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        width: 100%;
        height: 100%;
        min-height: 300px;

        mat-icon {
            font-size: 52px;
            height: 52px;
            width: 52px;
        }

        &--text {
            color: mat-color($foreground, text);
            font-size: 16px;
        }
    }

    .adf-document-list__this-space-is-empty {
        height: 32px;
        opacity: 0.26;
        font-size: 24px;
        line-height: 1.33;
        letter-spacing: -1px;
        color: mat-color($foreground, text);
    }

    .adf-document-list__drag-drop {
        height: 56px;
        opacity: 0.54;
        font-size: 56px;
        line-height: 1;
        letter-spacing: -2px;
        color: mat-color($foreground, text);
        margin-top: 40px;
    }

    .adf-document-list__any-files-here-to-add {
        height: 24px;
        opacity: 0.54;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: -0.4px;
        color: mat-color($foreground, text) 0;
        margin-top: 17px;
    }

    .adf-document-list__empty_doc_lib {
        width: 565px;
        height: 161px;
        object-fit: contain;
        margin-top: 17px;
    }

    .adf-document-list-loading-margin {
        margin: auto;
    }

    .adf-document-list-loading-container {
        min-height: 300px;
        display: flex;
        flex-direction: row;
        height: 100%;
    }

    .adf-empty-list-header {
        height: 32px;
        opacity: 0.26 !important;
        font-size: 24px;
        line-height: 1.33;
        letter-spacing: -1px;
        color: mat-color($foreground, text);
    }

    .adf-documentlist-pagination {
        color: mat-color($foreground, text);

        .adf-pagination__block {
            border-right: none;
        }
    }

    .adf-empty-folder {

        &-this-space-is-empty {
            height: 32px;
            opacity: 0.26;
            font-size: 24px;
            line-height: 1.33;
            letter-spacing: -1px;
            color: mat-color($foreground, text);
        }

        &-drag-drop {
            min-height: 56px;
            opacity: 0.54;
            font-size: 53px;
            line-height: 1;
            letter-spacing: -2px;
            color: mat-color($foreground, text);
            margin-top: 40px;
            word-break: break-all;
            white-space: pre-line;

            @media screen and ($mat-xsmall) {
                font-size: 48px;
            }
        }

        &-any-files-here-to-add {
            min-height: 24px;
            opacity: 0.54;
            font-size: 16px;
            line-height: 1.5;
            letter-spacing: -0.4px;
            color: mat-color($foreground, text);
            margin-top: 17px;
            word-break: break-all;
            white-space: pre-line;
        }

        &-image {
            width: 565px;
            max-width: 100%;
            object-fit: contain;
            margin-top: 17px;

            @media screen and ($mat-xsmall) {
                width: 250px;
            }
        }
    }

    .adf-datatable-gallery-thumbnails {
        .adf-datatable-card .adf-datatable-row {
            height: 300px !important;

            img {
                height: 100px;
            }

            :first-child .adf-cell-container .adf-cell-value {
                display: flex;
                width: 265px;
                flex: 0 0 auto;
                justify-content: center;
            }

            .adf-datatable-cell.adf-datatable-table-cell.adf-datatable-cell--image {
                flex: 0 0 auto;
                display: flex;
                flex-direction: column-reverse;
                justify-content: space-between;
            }
        }
    }
}