From 6e5d6ea3bb2202874ecd520d6db026115c497e7a Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Thu, 10 May 2018 16:13:53 +0100 Subject: [PATCH] [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) --- demo-shell/src/app/app.component.scss | 38 +----------- .../trashcan/trashcan.component.html | 13 ++--- docs/core/empty-content.component.md | 54 ++++++++++++++++++ .../images/empty-content-favorites.png | Bin 0 -> 35808 bytes .../images/empty-content-trashcan.png | Bin 0 -> 36149 bytes .../empty-content.component.html | 6 ++ .../empty-content.component.scss | 33 +++++++++++ .../empty-content/empty-content.component.ts | 39 +++++++++++++ lib/core/core.module.ts | 13 ++++- .../datatable/datatable.component.html | 3 +- .../datatable/datatable.component.scss | 22 +++++-- lib/core/index.ts | 2 + .../login/components/login.component.scss | 4 ++ lib/core/login/components/login.component.ts | 7 ++- lib/core/styles/_index.scss | 2 + lib/core/styles/_mixins.scss | 17 ++++++ 16 files changed, 199 insertions(+), 54 deletions(-) create mode 100644 docs/core/empty-content.component.md create mode 100644 docs/docassets/images/empty-content-favorites.png create mode 100644 docs/docassets/images/empty-content-trashcan.png create mode 100644 lib/core/components/empty-content/empty-content.component.html create mode 100644 lib/core/components/empty-content/empty-content.component.scss create mode 100644 lib/core/components/empty-content/empty-content.component.ts diff --git a/demo-shell/src/app/app.component.scss b/demo-shell/src/app/app.component.scss index bdccc4c219..3d0c82987c 100644 --- a/demo-shell/src/app/app.component.scss +++ b/demo-shell/src/app/app.component.scss @@ -1,39 +1,3 @@ -.empty-list { - .adf-data-table { - height: 100%; - - tr:hover, tr:focus { - cursor: default; - } - } - - &__block { - display: flex; - flex-direction: column; - align-items: center; - - p { - line-height: 0; - } - } - - &__title { - font-size: 18px; - font-weight: 600; - } - - &__subtitle { - font-size: 14px; - font-weight: 300; - } - - &__block > mat-icon { - font-size: 52px; - height: 52px; - width: 52px; - } -} - router-outlet[name="overlay"] + * { width: 100%; height: 100%; @@ -53,7 +17,7 @@ router-outlet[name="overlay"] + * { .adf-data-table-cell:first-child, .adf-data-table-cell:nth-child(2) { display: table-cell; - } + } } } } diff --git a/demo-shell/src/app/components/trashcan/trashcan.component.html b/demo-shell/src/app/components/trashcan/trashcan.component.html index bfb1a192b1..38160376d1 100644 --- a/demo-shell/src/app/components/trashcan/trashcan.component.html +++ b/demo-shell/src/app/components/trashcan/trashcan.component.html @@ -29,7 +29,6 @@
-
- delete -

{{ 'TRASHCAN.EMPTY_STATE.TITLE' | translate }}

-

{{ 'TRASHCAN.EMPTY_STATE.FIRST_TEXT' | translate }}

-

{{ 'TRASHCAN.EMPTY_STATE.SECOND_TEXT' | translate }}

-
+ +

{{ 'TRASHCAN.EMPTY_STATE.FIRST_TEXT' | translate }}

+

{{ 'TRASHCAN.EMPTY_STATE.SECOND_TEXT' | translate }}

+ diff --git a/docs/core/empty-content.component.md b/docs/core/empty-content.component.md new file mode 100644 index 0000000000..72b068b0a8 --- /dev/null +++ b/docs/core/empty-content.component.md @@ -0,0 +1,54 @@ +--- +Added: v2.4.0 +Status: Active +Last reviewed: +--- + +# 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 + +```html + + + + + + + + +``` + +![Favorites screen](../docassets/images/empty-content-favorites.png) + +You can also use multiple lines instead of the subtitle section: + +```html + + + + +

{{ 'APP.BROWSE.TRASHCAN.EMPTY_STATE.FIRST_TEXT' | translate }}

+

{{ 'APP.BROWSE.TRASHCAN.EMPTY_STATE.SECOND_TEXT' | translate }}

+ + + + +``` + +![Trashcan screen](../docassets/images/empty-content-trashcan.png) diff --git a/docs/docassets/images/empty-content-favorites.png b/docs/docassets/images/empty-content-favorites.png new file mode 100644 index 0000000000000000000000000000000000000000..8f96f3fed8c3f56e8e5bab6ef1bcd93b7870dc0a GIT binary patch literal 35808 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%0D{}tANdKv zCDAPev*JIX6_w!Tf{j5+568(3G{aR`z)0)y^}AO|M9@y`NIDx(En`D z`Hug)x}K~03E%qd;@rkhu=KZ!b8tK32+kt&IjaAwV9wpyStU8+o6i0CzYFG^z?@N% zGcM_zz?>79-z0F(+|F3X8Q*ix+pp*7uwnH^ literal 0 HcmV?d00001 diff --git a/docs/docassets/images/empty-content-trashcan.png b/docs/docassets/images/empty-content-trashcan.png new file mode 100644 index 0000000000000000000000000000000000000000..ce072deb9e2a489f5fd4c39c570b95b8a6043cd3 GIT binary patch literal 36149 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 Drb@2C literal 0 HcmV?d00001 diff --git a/lib/core/components/empty-content/empty-content.component.html b/lib/core/components/empty-content/empty-content.component.html new file mode 100644 index 0000000000..67ac339d12 --- /dev/null +++ b/lib/core/components/empty-content/empty-content.component.html @@ -0,0 +1,6 @@ +
+ {{ icon }} +

{{ title | translate }}

+

{{ subtitle | translate }}

+ +
diff --git a/lib/core/components/empty-content/empty-content.component.scss b/lib/core/components/empty-content/empty-content.component.scss new file mode 100644 index 0000000000..c7204f72d8 --- /dev/null +++ b/lib/core/components/empty-content/empty-content.component.scss @@ -0,0 +1,33 @@ +@mixin adf-empty-content-theme($theme) { + + $config: mat-typography-config(); + $foreground: map-get($theme, foreground); + + .adf-empty-content { + color: mat-color($foreground, text, 0.54); + display: flex; + flex-direction: column; + align-items: center; + + &__icon { + font-size: mat-font-size($config, display-3); + height: mat-font-size($config, display-3) !important; + width: mat-font-size($config, display-3) !important; + } + + p { + line-height: 0; + } + + &__title { + font-size: 18px; + font-weight: 600; + } + + &__subtitle, + &__text { + font-size: 14px; + font-weight: 300; + } + } +} diff --git a/lib/core/components/empty-content/empty-content.component.ts b/lib/core/components/empty-content/empty-content.component.ts new file mode 100644 index 0000000000..3667d9cda0 --- /dev/null +++ b/lib/core/components/empty-content/empty-content.component.ts @@ -0,0 +1,39 @@ +/*! + * @license + * Copyright 2016 Alfresco Software, Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input } from '@angular/core'; + +@Component({ + selector: 'adf-empty-content', + templateUrl: './empty-content.component.html', + styleUrls: ['./empty-content.component.scss'], + changeDetection: ChangeDetectionStrategy.OnPush, + encapsulation: ViewEncapsulation.None, + host: { class: 'adf-empty-content' } +}) +export class EmptyContentComponent { + + @Input() + icon = 'cake'; + + @Input() + title = ''; + + @Input() + subtitle = ''; + +} diff --git a/lib/core/core.module.ts b/lib/core/core.module.ts index ed078e7d5c..8b3389e0e2 100644 --- a/lib/core/core.module.ts +++ b/lib/core/core.module.ts @@ -80,6 +80,7 @@ import { UploadService } from './services/upload.service'; import { UserPreferencesService } from './services/user-preferences.service'; import { SearchConfigurationService } from './services/search-configuration.service'; import { startupServiceFactory } from './services/startup-service-factory'; +import { EmptyContentComponent } from './components/empty-content/empty-content.component'; export function createTranslateLoader(http: HttpClient, logService: LogService) { return new TranslateLoaderService(http, logService); @@ -161,6 +162,9 @@ export function providers() { } }) ], + declarations: [ + EmptyContentComponent + ], exports: [ ViewerModule, SideBarActionModule, @@ -188,7 +192,8 @@ export function providers() { DataColumnModule, DataTableModule, TranslateModule, - ButtonsMenuModule + ButtonsMenuModule, + EmptyContentComponent ] }) export class CoreModuleLazy { @@ -230,6 +235,9 @@ export class CoreModuleLazy { } }) ], + declarations: [ + EmptyContentComponent + ], exports: [ ViewerModule, SideBarActionModule, @@ -257,7 +265,8 @@ export class CoreModuleLazy { DataColumnModule, DataTableModule, TranslateModule, - ButtonsMenuModule + ButtonsMenuModule, + EmptyContentComponent ], providers: [ ...providers(), diff --git a/lib/core/datatable/components/datatable/datatable.component.html b/lib/core/datatable/components/datatable/datatable.component.html index 7cc4b304a9..d185c16a70 100644 --- a/lib/core/datatable/components/datatable/datatable.component.html +++ b/lib/core/datatable/components/datatable/datatable.component.html @@ -1,7 +1,8 @@
+ [class.adf-data-table]="display === 'list'" + [class.adf-data-table--empty]="isEmpty()">
diff --git a/lib/core/datatable/components/datatable/datatable.component.scss b/lib/core/datatable/components/datatable/datatable.component.scss index 1cfc40a7a5..68a1e91ef1 100644 --- a/lib/core/datatable/components/datatable/datatable.component.scss +++ b/lib/core/datatable/components/datatable/datatable.component.scss @@ -14,14 +14,9 @@ $data-table-selection-color: mat-color($background, 'selected-button') !default; $data-table-dividers: 1px solid $data-table-divider-color !default; $data-table-row-height: 56px !default; - // $data-table-last-row-height: 56px !default; - // $data-table-header-height: 56px !default; $data-table-column-spacing: 36px !default; $data-table-column-padding: $data-table-column-spacing / 2; - // $data-table-card-header-height: 64px !default; - // $data-table-card-title-top: 20px !default; $data-table-card-padding: 24px !default; - // $data-table-button-padding-right: 16px !default; $data-table-cell-top: $data-table-card-padding / 2; $data-table-drag-border: 1px dashed rgb(68, 138, 255); @@ -472,4 +467,21 @@ } } } + + .adf-data-table--empty { + @include flex-column; + justify-content: center; + align-items: center; + + .adf-datatable-body { + .adf-datatable-row { + background-color: mat-color($background, card); + + &:hover, &:focus { + background-color: unset; + cursor: default; + } + } + } + } } diff --git a/lib/core/index.ts b/lib/core/index.ts index f48f9ee3b9..dabfd5a901 100644 --- a/lib/core/index.ts +++ b/lib/core/index.ts @@ -35,6 +35,8 @@ export * from './sidenav-layout/index'; export * from './comments/index'; export * from './buttons-menu/index'; +export * from './components/empty-content/empty-content.component'; + export * from './pipes/index'; export * from './services/index'; export * from './directives/index'; diff --git a/lib/core/login/components/login.component.scss b/lib/core/login/components/login.component.scss index 1885e3d2e9..1367bff22a 100644 --- a/lib/core/login/components/login.component.scss +++ b/lib/core/login/components/login.component.scss @@ -6,6 +6,10 @@ $foreground: map-get($theme, foreground); $text-color-primary: mat-color($foreground, text); + .adf-login { + @include flex-column; + } + .adf-login-content { background-size: cover; background-position: center; diff --git a/lib/core/login/components/login.component.ts b/lib/core/login/components/login.component.ts index 09b34bb1c6..57f47e03ac 100644 --- a/lib/core/login/components/login.component.ts +++ b/lib/core/login/components/login.component.ts @@ -48,8 +48,11 @@ enum LoginSteps { selector: 'adf-login', templateUrl: './login.component.html', styleUrls: ['./login.component.scss'], - host: { '(blur)': 'onBlur($event)' }, - encapsulation: ViewEncapsulation.None + encapsulation: ViewEncapsulation.None, + host: { + 'class': 'adf-login', + '(blur)': 'onBlur($event)' + } }) export class LoginComponent implements OnInit { diff --git a/lib/core/styles/_index.scss b/lib/core/styles/_index.scss index 3755c43023..1a521cb95b 100644 --- a/lib/core/styles/_index.scss +++ b/lib/core/styles/_index.scss @@ -26,6 +26,7 @@ @import '../comments/comment-list.component'; @import '../comments/comments.component'; @import '../sidenav-layout/components/layout-container/layout-container.component'; +@import "../components/empty-content/empty-content.component"; @mixin adf-core-theme($theme) { @include adf-colors-theme($theme); @@ -54,6 +55,7 @@ @include adf-task-list-comment-list-theme($theme); @include adf-task-list-comment-theme($theme); @include adf-layout-container-theme($theme); + @include adf-empty-content-theme($theme); } diff --git a/lib/core/styles/_mixins.scss b/lib/core/styles/_mixins.scss index d7e7525139..2e9e0c28b6 100644 --- a/lib/core/styles/_mixins.scss +++ b/lib/core/styles/_mixins.scss @@ -48,3 +48,20 @@ width: 100%; } } + +@mixin flex-column { + display: flex; + flex-direction: column; + flex: 1; + height: 100%; + overflow: hidden; + min-height: 0; +} + +@mixin flex-row { + display: flex; + flex-direction: row; + flex: 1; + height: 100%; + overflow: hidden; +}