angular
diff --git a/‎docs/content/guide/animations.ngdoc
Lines changed: 20 additions & 20 deletions b/‎docs/content/guide/animations.ngdoc
Lines changed: 20 additions & 20 deletions
diff --git a/‎docs/content/guide/bootstrap.ngdoc
Lines changed: 6 additions & 6 deletions b/‎docs/content/guide/bootstrap.ngdoc
Lines changed: 6 additions & 6 deletions
diff --git a/‎docs/content/guide/compiler.ngdoc
Lines changed: 14 additions & 14 deletions b/‎docs/content/guide/compiler.ngdoc
Lines changed: 14 additions & 14 deletions
diff --git a/‎docs/content/guide/controller.ngdoc
Lines changed: 22 additions & 22 deletions b/‎docs/content/guide/controller.ngdoc
Lines changed: 22 additions & 22 deletions
@@ -64,11 +64,11 @@ You may also want to setup a separate CSS file for defining CSS-based animations
 Animations in AngularJS are completely based on CSS classes. As long as you have a CSS class attached to a HTML element within
 your website, you can apply animations to it. Lets say for example that we have an HTML template with a repeater in it like so:
 
-<pre>
+```html
 <div ng-repeat="item in items" class="repeated-item">
   {{ item.id }}
 </div>
-</pre>
+```
 
 As you can see, the `.repeated-item` class is present on the element that will be repeated and this class will be
 used as a reference within our application's CSS and/or JavaScript animation code to tell AngularJS to perform an animation.
@@ -80,13 +80,13 @@ it will apply a `ng-move` class name.
 Taking a look at the following CSS code, we can see some transition and keyframe animation code set for each of those events that
 occur when ngRepeat triggers them:
 
-<pre>
-&#47;&#42;
+```css
+/*
   We're using CSS transitions for when
   the enter and move events are triggered
   for the element that has the .repeated-item
   class
-&#42;&#47;
+*/
 .repeated-item.ng-enter, .repeated-item.ng-move {
   -webkit-transition:0.5s linear all;
   -moz-transition:0.5s linear all;
@@ -95,57 +95,57 @@ occur when ngRepeat triggers them:
   opacity:0;
 }
 
-&#47;&#42;
+/*
  The ng-enter-active and ng-move-active
  are where the transition destination properties
  are set so that the animation knows what to
  animate.
-&#42;&#47;
+*/
 .repeated-item.ng-enter.ng-enter-active,
 .repeated-item.ng-move.ng-move-active {
   opacity:1;
 }
 
-&#47;&#42;
+/*
   We're using CSS keyframe animations for when
   the leave event is triggered for the element
   that has the .repeated-item class
-&#42;&#47;
+*/
 .repeated-item.ng-leave {
   -webkit-animation:0.5s my_animation;
   -moz-animation:0.5s my_animation;
   -o-animation:0.5s my_animation;
   animation:0.5s my_animation;
 }
 
-&#64;keyframes my_animation {
+@keyframes my_animation {
   from { opacity:1; }
   to { opacity:0; }
 }
 
-&#47;&#42;
+/*
   Unfortunately each browser vendor requires
   its own definition of keyframe animation code...
-&#42;&#47;
-&#64;-webkit-keyframes my_animation {
+*/
+@-webkit-keyframes my_animation {
   from { opacity:1; }
   to { opacity:0; }
 }
 
-&#64;-moz-keyframes my_animation {
+@-moz-keyframes my_animation {
   from { opacity:1; }
   to { opacity:0; }
 }
 
-&#64;-o-keyframes my_animation {
+@-o-keyframes my_animation {
   from { opacity:1; }
   to { opacity:0; }
 }
-</pre>
+```
 
 The same approach to animation can be used using JavaScript code (**jQuery is used within to perform animations**):
 
-<pre>
+```js
 myModule.animation('.repeated-item', function() {
   return {
     enter : function(element, done) {
@@ -199,7 +199,7 @@ myModule.animation('.repeated-item', function() {
     removeClass : function(element, className, done) {}
   }
 });
-</pre>
+```
 
 With these generated CSS class names present on the element at the time, AngularJS automatically
 figures out whether to perform a CSS and/or JavaScript animation. If both CSS and JavaScript animation
@@ -268,7 +268,7 @@ For a full breakdown of the steps involved during each animation event, refer to
 Animations within custom directives can also be established by injecting `$animate` directly into your directive and
 making calls to it when needed.
 
-<pre>
+```js
 myModule.directive('my-directive', ['$animate', function($animate) {
   return function(element, scope, attrs) {
     element.bind('click', function() {
@@ -280,7 +280,7 @@ myModule.directive('my-directive', ['$animate', function($animate) {
     });
   };
 }]);
-</pre>
+```
 
 ## More about animations
 
 
@@ -13,15 +13,15 @@ This example shows the recommended path for integrating Angular with what we cal
 initialization.
 
 
-<pre>
+```html
 <!doctype html>
 <html xmlns:ng="http://angularjs.org" ng-app>
   <body>
     ...
     <script src="angular.js">
   </body>
 </html>
-</pre>
+```
 
   * Place the `script` tag at the bottom of the page. Placing script tags at the end of the page
     improves app load time because the HTML loading is not blocked by loading of the `angular.js`
@@ -65,15 +65,15 @@ If the {@link api/ng.directive:ngApp `ng-app`} directive is found then Angular w
     portion of the DOM as an Angular application.
 
 
-<pre>
+```html
 <!doctype html>
 <html ng-app="optionalModuleName">
   <body>
     I can add: {{ 1+2 }}.
     <script src="angular.js"></script>
   </body>
 </html>
-</pre>
+```
 
 
 
@@ -86,7 +86,7 @@ or the need to perform an operation before Angular compiles a page.
 
 Here is an example of manually initializing Angular:
 
-<pre>
+```html
 <!doctype html>
 <html xmlns:ng="http://angularjs.org">
   <body>
@@ -100,7 +100,7 @@ Here is an example of manually initializing Angular:
     </script>
   </body>
 </html>
-</pre>
+```
 
 Note that we have provided the name of our application module to be loaded into the injector as the second
 parameter of the {@link api/angular.bootstrap} function. Notice that `angular.bootstrap` will not create modules 
 
@@ -60,12 +60,12 @@ during the compilation process. The directives can be placed in element names, a
 names, as well as comments. Here are some equivalent examples of invoking the {@link
 api/ng.directive:ngBind `ng-bind`} directive.
 
-<pre>
+```html
   <span ng-bind="exp"></span>
   <span class="ng-bind: exp;"></span>
   <ng-bind></ng-bind>
   <!-- directive: ng-bind exp -->
-</pre>
+```
 
 A directive is just a function which executes when the compiler encounters it in the DOM. See {@link
 api/ng.$compileProvider#methods_directive directive API} for in-depth documentation on how
@@ -187,7 +187,7 @@ a model on the compiled scope will be reflected in the DOM.
 Below is the corresponding code using the `$compile` service.
 This should help give you an idea of what Angular does internally.
 
-<pre>
+```js
   var $compile = ...; // injected into your code
   var scope = ...;
   var parent = ...; // DOM element where the compiled template can be appended
@@ -205,7 +205,7 @@ This should help give you an idea of what Angular does internally.
 
   // Step 4: Append to DOM (optional)
   parent.appendChild(element);
-</pre>
+```
 
 ### The difference between Compile and Link
 
@@ -229,14 +229,14 @@ moved to the compile function for performance reasons.
 
 To understand, let's look at a real-world example with `ngRepeat`:
 
-<pre>
+```html
 Hello {{user}}, you have these actions:
 <ul>
   <li ng-repeat="action in user.actions">
     {{action.description}}
   </li>
 </ul>
-</pre>
+```
 
 When the above example is compiled, the compiler visits every node and looks for directives.
 
@@ -295,7 +295,7 @@ One of the most common use cases for directives is to create reusable components
 
 Below is a pseudo code showing how a simplified dialog component may work.
 
-<pre>
+```html
 <div>
   <button ng-click="show=true">show</button>
 
@@ -306,15 +306,15 @@ Below is a pseudo code showing how a simplified dialog component may work.
      Body goes here: {{username}} is {{title}}.
   </dialog>
 </div>
-</pre>
+```
 
 Clicking on the "show" button will open the dialog. The dialog will have a title, which is
 data bound to `username`, and it will also have a body which we would like to transclude
 into the dialog.
 
 Here is an example of what the template definition for the `dialog` widget may look like.
 
-<pre>
+```html
 <div ng-show="visible">
   <h3>{{title}}</h3>
   <div class="body" ng-transclude></div>
@@ -323,7 +323,7 @@ Here is an example of what the template definition for the `dialog` widget may l
     <button ng-click="onCancel()">Close</button>
   </div>
 </div>
-</pre>
+```
 
 This will not render properly, unless we do some scope magic.
 
@@ -334,14 +334,14 @@ the `onOk` and `onCancel` functions to be present in the scope. This limits the
 widget. To solve the mapping issue we use the `locals` to create local variables which the template
 expects as follows:
 
-<pre>
+```js
   scope: {
     title: '@',             // the title uses the data-binding from the parent scope
     onOk: '&',              // create a delegate onOk function
     onCancel: '&',          // create a delegate onCancel function
     visible: '='            // set up visible to accept data-binding
   }
-</pre>
+```
 
 Creating local properties on widget scope creates two problems:
 
@@ -367,7 +367,7 @@ surprise.
 
 Therefore the final directive definition looks something like this:
 
-<pre>
+```js
 transclude: true,
 scope: {
     title: '@',             // the title uses the data-binding from the parent scope
@@ -377,5 +377,5 @@ scope: {
 },
 restrict: 'E',
 replace: true
-</pre>
+```
 
@@ -28,7 +28,7 @@ is registered.
 The following example shows a very simple constructor function for a Controller, `GreetingCtrl`,
 which attaches a `greeting` property containing the string `'Hola!'` to the `$scope`:
 
-```
+```js
     function GreetingCtrl($scope) {
         $scope.greeting = 'Hola!';
     }
@@ -37,22 +37,22 @@ which attaches a `greeting` property containing the string `'Hola!'` to the `$sc
 Once the Controller has been attached to the DOM, the `greeting` property can be data-bound to the
 template:
 
-```
-<div ng-controller="GreetingCtrl">
-  {{ greeting }}
-</div>
+```js
+    <div ng-controller="GreetingCtrl">
+      {{ greeting }}
+    </div>
 ```
 
 **NOTE**: Although Angular allows you to create Controller functions in the global scope, this is
 not recommended.  In a real application you should use the `.controller` method of your
 {@link module Angular Module} for your application as follows:
 
-```
-var myApp = angular.module('myApp',[]);
+```js
+    var myApp = angular.module('myApp',[]);
 
-myApp.controller('GreetingCtrl', ['$scope', function($scope) {
-    $scope.greeting = 'Hola!';
-}]);
+    myApp.controller('GreetingCtrl', ['$scope', function($scope) {
+        $scope.greeting = 'Hola!';
+    }]);
 ```
 
 We have used an **inline injection annotation** to explicitly specify the dependency
@@ -68,21 +68,21 @@ then available to be called from the template/view.
 
 The following example uses a Controller to add a method to the scope, which doubles a number:
 
-```
-var myApp = angular.module('myApp',[]);
+```js
+    var myApp = angular.module('myApp',[]);
 
-myApp.controller('DoubleCtrl', ['$scope', function($scope) {
-    $scope.double = function(value) { return value * 2; };
-}]);
+    myApp.controller('DoubleCtrl', ['$scope', function($scope) {
+        $scope.double = function(value) { return value * 2; };
+    }]);
 ```
 
 Once the Controller has been attached to the DOM, the `double` method can be invoked in an Angular
 expression in the template:
 
-```
-<div ng-controller="DoubleCtrl">
-  Two times <input ng-model="num"> equals {{ double(num) }}
-</div>
+```js
+    <div ng-controller="DoubleCtrl">
+      Two times <input ng-model="num"> equals {{ double(num) }}
+    </div>
 ```
 
 As discussed in the {@link concepts Concepts} section of this guide, any
@@ -270,7 +270,7 @@ Although there are many ways to test a Controller, one of the best conventions,
 involves injecting the {@link api/ng.$rootScope $rootScope} and {@link api/ng.$controller $controller}:
 
 **Controller Definition:**
-```
+```js
     var myApp = angular.module('myApp',[]);
 
     myApp.controller('MyController', function($scope) {
@@ -282,7 +282,7 @@ involves injecting the {@link api/ng.$rootScope $rootScope} and {@link api/ng.$c
 ```
 
 **Controller Test:**
-```
+```js
 describe('myController function', function() {
 
   describe('myController', function() {
@@ -310,7 +310,7 @@ describe('myController function', function() {
 If you need to test a nested Controller you need to create the same scope hierarchy
 in your test that exists in the DOM:
 
-```
+```js
 describe('state', function() {
     var mainScope, childScope, grandChildScope;