inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-12 17:04:57 +00:00
Code Issues Packages Projects Releases Wiki Activity
alfresco-ng2-components/docs/core/empty-content.component.md
Denys Vuika 6e5d6ea3bb
[ADF-2930] general purpose "Empty Page" component (#3296) 
* empty content component

* fix selector name

* style fixes

* cleanup code

* docs for empty content

* update docs

* update docs

* use typography for icon

* layout fixes for Login (ported from ACA)
2018-05-10 16:13:53 +01:00

1.6 KiB
Raw Blame History

Added, Status, Last reviewed
Added Status Last reviewed
v2.4.0 Active

Empty Content Component

Provides a generic "Empty Content" UI and can used as a placeholder for components that need to show different content when being empty.

Properties

Name Type Description
icon string Material Icon to use
title string String or Resource Key for the title
subtitle string String or Resource Key for the subtitle

Examples

<adf-document-list>
    <empty-folder-content>
        <ng-template>
            <adf-empty-content
                icon="star_rate"
                title="APP.BROWSE.FAVORITES.EMPTY_STATE.TITLE"
                subtitle="APP.BROWSE.FAVORITES.EMPTY_STATE.TEXT">
            </adf-empty-folder>
        </ng-template>
    </empty-folder-content>
</adf-document-list>

Favorites screen

You can also use multiple lines instead of the subtitle section:

<adf-document-list>
    <empty-folder-content>
        <ng-template>
            <adf-empty-content
                icon="delete"
                title="APP.BROWSE.TRASHCAN.EMPTY_STATE.TITLE">
                <p class="adf-empty-content__text">{{ 'APP.BROWSE.TRASHCAN.EMPTY_STATE.FIRST_TEXT' | translate }}</p>
                <p class="adf-empty-content__text">{{ 'APP.BROWSE.TRASHCAN.EMPTY_STATE.SECOND_TEXT' | translate }}</p>
            </adf-empty-content>
        </ng-template>
    </empty-folder-content>
</adf-document-list>

Trashcan screen