This repository has been archived by the owner on Sep 5, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 3.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(slider): vertical slider, UI fixes and bug fixes
- Added vertical slider - Improved UI - Fixed dynamic min/max with values not in range - Made value rounding to 6 zeros after the dot - Added discrete readonly mode - Added disabled on slider container fixes #4371, #3259, #2421, #1221, #4576, #6996 closes #5874, #5872, #6051
- Loading branch information
1 parent
d75d6e7
commit 0f41386
Showing
10 changed files
with
920 additions
and
201 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
<div ng-controller="AppCtrl" ng-cloak> | ||
<md-content layout="row" layout-padding> | ||
<md-slider-container flex> | ||
<md-input-container> | ||
<input flex type="number" ng-model="vol" aria-label="volume" aria-controls="volume-slider"> | ||
</md-input-container> | ||
<md-slider ng-model="vol" min="0" max="100" aria-label="volume" id="volume-slider" class="md-accent" md-vertical | ||
md-range></md-slider> | ||
</md-slider> | ||
<h5>Volume</h5> | ||
</md-slider-container> | ||
<md-slider-container flex> | ||
<md-input-container> | ||
<input flex type="number" ng-model="bass" aria-label="bass" aria-controls="bass-slider"> | ||
</md-input-container> | ||
<md-slider md-discrete ng-model="bass" min="0" max="100" step="10" aria-label="bass" class="md-primary" | ||
md-vertical></md-slider> | ||
</md-slider> | ||
<h5>Bass</h5> | ||
</md-slider-container> | ||
<div flex layout="column" layout-align="center center"> | ||
<md-slider-container ng-disabled="readonly"> | ||
<md-input-container> | ||
<input flex type="number" ng-model="master" aria-label="master" aria-controls="master-slider"> | ||
</md-input-container> | ||
<md-slider flex ng-model="master" md-discrete aria-label="Master" md-vertical step="10" | ||
ng-readonly="readonly"></md-slider> | ||
<h5>Master</h5> | ||
</md-slider-container> | ||
<md-checkbox ng-model="readonly">Read only</md-checkbox> | ||
</div> | ||
</md-content> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
|
||
angular.module('sliderDemo2', ['ngMaterial']) | ||
|
||
.controller('AppCtrl', function($scope) { | ||
|
||
$scope.vol = Math.floor(Math.random() * 100); | ||
$scope.bass = Math.floor(Math.random() * 100); | ||
$scope.master = Math.floor(Math.random() * 100); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.