mirror of
https://github.com/inverse-inc/sogo.git
synced 2026-05-14 07:55:28 +00:00
Restructure Sass files and folders for proper application Sass development
This commit is contained in:
@@ -0,0 +1,25 @@
|
||||
<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>
|
||||
@@ -0,0 +1,14 @@
|
||||
angular.module('progressCircularDemo1', ['ngMaterial'])
|
||||
.controller('AppCtrl', ['$scope', '$interval',
|
||||
function($scope, $interval) {
|
||||
$scope.mode = 'query';
|
||||
$scope.determinateValue = 30;
|
||||
|
||||
$interval(function() {
|
||||
$scope.determinateValue += 1;
|
||||
if ($scope.determinateValue > 100) {
|
||||
$scope.determinateValue = 30;
|
||||
}
|
||||
}, 100, 0, true);
|
||||
}
|
||||
]);
|
||||
@@ -0,0 +1,11 @@
|
||||
body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
h4 {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
md-progress-circular {
|
||||
margin-bottom:20px;
|
||||
}
|
||||
Reference in New Issue
Block a user