docs(animations): renamed animate-show-hide to sample-show-hide

This always throws me off - I think it helps to make it clear that the class name is arbitrary, and
what matters is the .ng-etc classes.

Closes #5848
This commit is contained in:
Rob Wormald 2014-01-16 20:43:34 -06:00 committed by Caitlin Potter
parent 0e4d7cacad
commit 1cdcddb5cc

View file

@ -21,19 +21,19 @@ Below is a quick example of animations being enabled for `ngShow` and `ngHide`:
<label> <label>
<input type="checkbox" ng-model="checked" style="float:left; margin-right:10px;"> Is Visible... <input type="checkbox" ng-model="checked" style="float:left; margin-right:10px;"> Is Visible...
</label> </label>
<div class="check-element animate-show-hide" ng-show="checked" style="clear:both;"> <div class="check-element sample-show-hide" ng-show="checked" style="clear:both;">
Visible... Visible...
</div> </div>
</div> </div>
</file> </file>
<file name="animations.css"> <file name="animations.css">
.animate-show-hide { .sample-show-hide {
padding:10px; padding:10px;
border:1px solid black; border:1px solid black;
background:white; background:white;
} }
.animate-show-hide.ng-hide-add, .animate-show-hide.ng-hide-remove { .sample-show-hide.ng-hide-add, .sample-show-hide.ng-hide-remove {
-webkit-transition:all linear 0.5s; -webkit-transition:all linear 0.5s;
-moz-transition:all linear 0.5s; -moz-transition:all linear 0.5s;
-o-transition:all linear 0.5s; -o-transition:all linear 0.5s;
@ -41,13 +41,13 @@ Below is a quick example of animations being enabled for `ngShow` and `ngHide`:
display:block!important; display:block!important;
} }
.animate-show-hide.ng-hide-add.ng-hide-add-active, .sample-show-hide.ng-hide-add.ng-hide-add-active,
.animate-show-hide.ng-hide-remove { .sample-show-hide.ng-hide-remove {
opacity:0; opacity:0;
} }
.animate-show-hide.ng-hide-add, .sample-show-hide.ng-hide-add,
.animate-show-hide.ng-hide-remove.ng-hide-remove-active { .sample-show-hide.ng-hide-remove.ng-hide-remove-active {
opacity:1; opacity:1;
} }
</file> </file>