Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2025-12-17 16:00:14 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(spinner): use updated size and status names

Browse source
This commit is contained in:
Sergey Andrievskiy 2019-06-20 13:01:29 +03:00
parent 0f67b8f684
commit 966367d0c2
5 changed files with 18 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/app/pages/extra-components/spinner/spinner-color/spinner-color.component.html
View file

@ -1,22 +1,4 @@
<nb-card [nbSpinner]="true" nbSpinnerStatus="active">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerStatus="disabled">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerStatus="warning">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerStatus="danger">
<nb-card [nbSpinner]="true" nbSpinnerStatus="primary">
<nb-card-body>
Some card content.
</nb-card-body>
@ -34,7 +16,13 @@
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerStatus="primary">
<nb-card [nbSpinner]="true" nbSpinnerStatus="warning">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerStatus="danger">
<nb-card-body>
Some card content.
</nb-card-body>

2
src/app/pages/extra-components/spinner/spinner-in-buttons/spinner-in-buttons.component.html
View file

@ -30,7 +30,7 @@
</button>
<button nbButton status="primary" size="medium" (click)="toggleLoadingMediumGroupAnimation()"
[nbSpinner]="loadingMediumGroup" nbSpinnerStatus="primary" nbSpinnerSize="xsmall" nbSpinnerMessage="">
[nbSpinner]="loadingMediumGroup" nbSpinnerStatus="primary" nbSpinnerSize="tiny" nbSpinnerMessage="">
Download
</button>
</div>

4
src/app/pages/extra-components/spinner/spinner-in-buttons/spinner-in-buttons.component.scss
View file

@ -4,9 +4,9 @@
button {
margin: 1rem;
}
.size-medium-group {
margin-top: 2rem;
border-top: 1px solid nb-theme(separator);
border-top: 1px solid nb-theme(divider-color);
}
}

4
src/app/pages/extra-components/spinner/spinner-in-tabs/spinner-in-tabs.component.html
View file

@ -1,14 +1,14 @@
<nb-card size="xsmall">
<nb-card-body>
<nb-tabset fullWidth (changeTab)="toggleLoadingAnimation()">
<nb-tab tabTitle="Tab 1" [nbSpinner]="loading" nbSpinnerStatus="success" nbSpinnerSize="xxlarge">
<nb-tab tabTitle="Tab 1" [nbSpinner]="loading" nbSpinnerStatus="success" nbSpinnerSize="giant">
<p>
A nebula is an interstellar cloud of dust, hydrogen, helium and other ionized gases.
Originally, nebula was a name for any diffuse astronomical object.
</p>
</nb-tab>
<nb-tab tabTitle="Tab 2" [nbSpinner]="loading" nbSpinnerStatus="info" nbSpinnerSize="xxlarge">
<nb-tab tabTitle="Tab 2" [nbSpinner]="loading" nbSpinnerStatus="info" nbSpinnerSize="giant">
<p>
Nebular's primary goal is to assemble together and connect the most awesome features and libraries
creating an efficient ecosystem to speed up and simplify the development.

22
src/app/pages/extra-components/spinner/spinner-sizes/spinner-sizes.component.html
View file

@ -1,40 +1,28 @@
<nb-card [nbSpinner]="true" nbSpinnerSize="xxsmall">
<nb-card [nbSpinner]="true" nbSpinnerSize="tiny" nbSpinnerStatus="primary">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerSize="xsmall">
<nb-card [nbSpinner]="true" nbSpinnerSize="small" nbSpinnerStatus="primary">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerSize="small">
<nb-card [nbSpinner]="true" nbSpinnerSize="medium" nbSpinnerStatus="primary">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerSize="medium">
<nb-card [nbSpinner]="true" nbSpinnerSize="large" nbSpinnerStatus="primary">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerSize="large">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerSize="xlarge">
<nb-card-body>
Some card content.
</nb-card-body>
</nb-card>
<nb-card [nbSpinner]="true" nbSpinnerSize="xxlarge">
<nb-card [nbSpinner]="true" nbSpinnerSize="giant" nbSpinnerStatus="primary">
<nb-card-body>
Some card content.
</nb-card-body>