mirror of
https://github.com/inverse-inc/sogo.git
synced 2026-02-23 10:26:23 +00:00
26 lines
1.5 KiB
HTML
26 lines
1.5 KiB
HTML
<div ng-controller="AppCtrl" layout="column" layout-margin style="padding:25px;">
|
||
|
||
<h4 style="margin-top:10px">Determinate</h4>
|
||
<p>For operations where the percentage of the operation completed can be determined, use a determinate indicator. They give users a quick sense of how long an operation will take.</p>
|
||
<div layout="row" layout-sm="column" layout-align="space-around">
|
||
<md-progress-circular md-mode="determinate" value="{{determinateValue}}"></md-progress-circular>
|
||
</div>
|
||
|
||
<h4>Indeterminate</h4>
|
||
<p>For operations where the user is asked to wait a moment while something finishes up, and it’s not necessary to expose what's happening behind the scenes and how long it will take, use an indeterminate indicator.</p>
|
||
<div layout="row" layout-sm="column" layout-align="space-around">
|
||
<md-progress-circular md-mode="indeterminate"></md-progress-circular>
|
||
</div>
|
||
|
||
<h4>Theming</h4>
|
||
|
||
<div layout="row" layout-sm="column" layout-align="space-around">
|
||
<md-progress-circular class="md-hue-2" md-mode="indeterminate"></md-progress-circular>
|
||
<md-progress-circular class="md-accent" md-mode="indeterminate"></md-progress-circular>
|
||
<md-progress-circular class="md-accent md-hue-1" md-mode="indeterminate"></md-progress-circular>
|
||
<md-progress-circular class="md-warn md-hue-3" md-mode="indeterminate"></md-progress-circular>
|
||
<md-progress-circular class="md-warn" md-mode="indeterminate"></md-progress-circular>
|
||
</div>
|
||
|
||
</div>
|