Mercurial > hg > ugly-duckling
changeset 101:d5256e8309ab
Remove everything but the play / pause button, and use smaller icons - this will now be used in the toolbar.
| author | Lucas Thompson <dev@lucas.im> |
|---|---|
| date | Thu, 02 Mar 2017 15:07:07 +0000 |
| parents | bf8826d4e2c6 |
| children | 5f7896f2fad7 |
| files | src/app/playback-control/playback-control.component.css src/app/playback-control/playback-control.component.html |
| diffstat | 2 files changed, 3 insertions(+), 28 deletions(-) [+] |
line wrap: on
line diff
--- a/src/app/playback-control/playback-control.component.css Thu Mar 02 15:06:24 2017 +0000 +++ b/src/app/playback-control/playback-control.component.css Thu Mar 02 15:07:07 2017 +0000 @@ -1,14 +0,0 @@ -.play { - width: 60px; - height: 60px; -} - -.play md-icon { - font-size: 48px; - width: 48px; -} - -.seek-controls { - display: block; - margin: auto; -}
--- a/src/app/playback-control/playback-control.component.html Thu Mar 02 15:06:24 2017 +0000 +++ b/src/app/playback-control/playback-control.component.html Thu Mar 02 15:07:07 2017 +0000 @@ -1,17 +1,6 @@ -<button md-icon-button class="play" (click)="emitPlayPause()"> +<button md-icon-button (click)="emitPlayPause()"> <md-icon> - <template [ngIf]="isPlaying()">pause_circle_outline</template> - <template [ngIf]="!isPlaying()">play_circle_outline</template> + <template [ngIf]="isPlaying()">pause</template> + <template [ngIf]="!isPlaying()">play_arrow</template> </md-icon> </button> -<span class="seek-controls"> - <button md-icon-button (click)="emitFastRewindStart()"><md-icon>skip_previous</md-icon></button> - <button md-icon-button (click)="emitFastRewind()"><md-icon>fast_rewind</md-icon></button> - <button md-icon-button (click)="emitFastForward()"><md-icon>fast_forward</md-icon></button> - <button md-icon-button (click)="emitFastForwardEnd()"><md-icon>skip_next</md-icon></button> -</span> -<md-slider #volume - (slide)="emitVolumeChanged(volume.percent)" - (click)="emitVolumeChanged(volume.percent)" - value="50"> -</md-slider>