honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs(aio): resize images

This commit is contained in:
Jesus Rodriguez 2017-05-11 21:44:22 +02:00 committed by Pete Bacon Darwin
parent 90bc5b221b
commit b016984c04
63 changed files with 50 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
aio/content/guide/aot-compiler.md
View File

@ -606,6 +606,6 @@ Here's the map for _Tour of Heroes_.
<a href="generated/images/guide/aot-compiler/toh-pt6-bundle.png" title="View larger image"> <a href="generated/images/guide/aot-compiler/toh-pt6-bundle.png" title="View larger image">
<figure> <figure>
<img src="generated/images/guide/aot-compiler/toh-pt6-bundle.png" alt="toh-pt6-bundle" width="700"> <img src="generated/images/guide/aot-compiler/toh-pt6-bundle-700w.png" alt="toh-pt6-bundle">
</figure> </figure>
</a> </a>

23
aio/content/guide/architecture.md
View File

@ -23,7 +23,7 @@ Of course, there is more to it than this.
You'll learn the details in the pages that follow. For now, focus on the big picture. You'll learn the details in the pages that follow. For now, focus on the big picture.
<figure> <figure>
<img src="generated/images/guide/architecture/overview2.png" alt="overview" width="700" height="356"> <img src="generated/images/guide/architecture/overview2.png" alt="overview">
</figure> </figure>
<!-- <!--
@ -50,7 +50,8 @@ The code referenced on this page is available as a <live-example></live-example>
## Modules ## Modules
<img src="generated/images/guide/architecture/module.png" alt="Component" class="left" width="240" height="183"> <img src="generated/images/guide/architecture/module.png" alt="Component" class="left">
Angular apps are modular and Angular has its own modularity system called _Angular modules_ or _NgModules_. Angular apps are modular and Angular has its own modularity system called _Angular modules_ or _NgModules_.
@ -134,7 +135,7 @@ These are two different and _complementary_ module systems. Use them both to wri
### Angular libraries ### Angular libraries
<img src="generated/images/guide/architecture/library-module.png" alt="Component" class="left" width="240" height="181"> <img src="generated/images/guide/architecture/library-module.png" alt="Component" class="left">
Angular ships as a collection of JavaScript modules. You can think of them as library modules. Angular ships as a collection of JavaScript modules. You can think of them as library modules.
@ -171,7 +172,7 @@ Learn more from the [Angular modules](guide/ngmodule) page.
## Components ## Components
<img src="generated/images/guide/architecture/hero-component.png" alt="Component" class="left" width="200" height="115"> <img src="generated/images/guide/architecture/hero-component.png" alt="Component" class="left">
A _component_ controls a patch of screen called a *view*. A _component_ controls a patch of screen called a *view*.
@ -199,7 +200,7 @@ Your app can take action at each moment in this lifecycle through optional [life
## Templates ## Templates
<img src="generated/images/guide/architecture/template.png" alt="Template" class="left" width="200"> <img src="generated/images/guide/architecture/template.png" alt="Template" class="left">
You define a component's view with its companion **template**. A template is a form of HTML You define a component's view with its companion **template**. A template is a form of HTML
that tells Angular how to render the component. that tells Angular how to render the component.
@ -218,7 +219,7 @@ The `HeroDetailComponent` (code not shown) presents facts about a particular her
hero that the user selects from the list presented by the `HeroListComponent`. hero that the user selects from the list presented by the `HeroListComponent`.
The `HeroDetailComponent` is a **child** of the `HeroListComponent`. The `HeroDetailComponent` is a **child** of the `HeroListComponent`.
<img src="generated/images/guide/architecture/component-tree.png" alt="Metadata" class="left" width="300" height="260"> <img src="generated/images/guide/architecture/component-tree.png" alt="Metadata" class="left">
Notice how `<hero-detail>` rests comfortably among native HTML elements. Custom components mix seamlessly with native HTML in the same layouts. Notice how `<hero-detail>` rests comfortably among native HTML elements. Custom components mix seamlessly with native HTML in the same layouts.
@ -266,7 +267,7 @@ This is one way to tell Angular that the component's constructor requires a `Her
so it can get the list of heroes to display. so it can get the list of heroes to display.
<img src="generated/images/guide/architecture/template-metadata-component.png" alt="Metadata" class="left" width="114" height="200"> <img src="generated/images/guide/architecture/template-metadata-component.png" alt="Metadata" class="left">
The metadata in the `@Component` tells Angular where to get the major building blocks you specify for the component. The metadata in the `@Component` tells Angular where to get the major building blocks you specify for the component.
@ -287,7 +288,7 @@ Without a framework, you would be responsible for pushing data values into the H
into actions and value updates. Writing such push/pull logic by hand is tedious, error-prone, and a nightmare to into actions and value updates. Writing such push/pull logic by hand is tedious, error-prone, and a nightmare to
read as any experienced jQuery programmer can attest. read as any experienced jQuery programmer can attest.
<img src="generated/images/guide/architecture/databinding.png" alt="Data Binding" class="left" width="220" height="204"> <img src="generated/images/guide/architecture/databinding.png" alt="Data Binding" class="left">
Angular supports **data binding**, Angular supports **data binding**,
a mechanism for coordinating parts of a template with parts of a component. a mechanism for coordinating parts of a template with parts of a component.
@ -329,7 +330,7 @@ from the root of the application component tree through all child components.
Data binding plays an important role in communication between a template and its component. Data binding plays an important role in communication between a template and its component.
<figure> <figure>
<img src="generated/images/guide/architecture/parent-child-binding.png" alt="Parent/Child binding" width="358" height="171"> <img src="generated/images/guide/architecture/parent-child-binding.png" alt="Parent/Child binding">
</figure> </figure>
Data binding is also important for communication between parent and child components. Data binding is also important for communication between parent and child components.
@ -338,7 +339,7 @@ Data binding is also important for communication between parent and child compon
## Directives ## Directives
<img src="generated/images/guide/architecture/directive.png" alt="Parent child" class="left" width="150" height="147"> <img src="generated/images/guide/architecture/directive.png" alt="Parent child" class="left">
Angular templates are *dynamic*. When Angular renders them, it transforms the DOM Angular templates are *dynamic*. When Angular renders them, it transforms the DOM
according to the instructions given by **directives**. according to the instructions given by **directives**.
@ -441,7 +442,7 @@ application logic into services and make those services available to components
## Dependency injection ## Dependency injection
<img src="generated/images/guide/architecture/dependency-injection.png" alt="Service" class="left" width="200" height="89"> <img src="generated/images/guide/architecture/dependency-injection.png" alt="Service" class="left">
_Dependency injection_ is a way to supply a new instance of a class _Dependency injection_ is a way to supply a new instance of a class
with the fully-formed dependencies it requires. Most dependencies are services. with the fully-formed dependencies it requires. Most dependencies are services.

4
aio/content/guide/dependency-injection-in-action.md
View File

@ -576,7 +576,7 @@ The `HeroOfTheMonthComponent` example demonstrates many of the alternatives and
It's visually simple: a few properties and the logs produced by a logger. It's visually simple: a few properties and the logs produced by a logger.
<figure> <figure>
<img src="generated/images/guide/dependency-injection-in-action/hero-of-month.png" alt="Hero of the month" width="300px"> <img src="generated/images/guide/dependency-injection-in-action/hero-of-month.png" alt="Hero of the month">
</figure> </figure>
@ -746,7 +746,7 @@ Behind the scenes, Angular actually sets the `logger` parameter to the full serv
The following image, which displays the logging date, confirms the point: The following image, which displays the logging date, confirms the point:
<figure> <figure>
<img src="generated/images/guide/dependency-injection-in-action/date-logger-entry.png" alt="DateLoggerService entry" width="300px"> <img src="generated/images/guide/dependency-injection-in-action/date-logger-entry.png" alt="DateLoggerService entry">
</figure> </figure>

6
aio/content/guide/http.md
View File

@ -93,7 +93,7 @@ The app uses the Angular <code>Http</code> client to communicate via **XMLHttpRe
It works like this: It works like this:
<figure> <figure>
<img src='generated/images/guide/http/http-toh.gif' alt="ToH mini app" width="250" height="222"> <img src='generated/images/guide/http/http-toh.gif' alt="ToH mini app">
</figure> </figure>
This demo has a single component, the `HeroListComponent`. Here's its template: This demo has a single component, the `HeroListComponent`. Here's its template:
@ -496,7 +496,7 @@ Here is a simple search that shows suggestions from Wikipedia as the user
types in a text box: types in a text box:
<figure> <figure>
<img src='generated/images/guide/http/wiki-1.gif' alt="Wikipedia search app (v.1)" width="250" height="267"> <img src='generated/images/guide/http/wiki-1.gif' alt="Wikipedia search app (v.1)">
</figure> </figure>
Wikipedia offers a modern `CORS` API and a legacy `JSONP` search API. This example uses the latter. Wikipedia offers a modern `CORS` API and a legacy `JSONP` search API. This example uses the latter.
@ -590,7 +590,7 @@ It should only make requests when the user *stops typing*.
Here's how it will work after refactoring: Here's how it will work after refactoring:
<figure> <figure>
<img src='generated/images/guide/http/wiki-2.gif' alt="Wikipedia search app (v.2)" width="250" height="267"> <img src='generated/images/guide/http/wiki-2.gif' alt="Wikipedia search app (v.2)">
</figure> </figure>
### 2. Search when the search term changes ### 2. Search when the search term changes

2
aio/content/guide/lifecycle-hooks.md
View File

@ -6,7 +6,7 @@ Angular calls lifecycle hook methods on directives and components as it creates,
@description @description
<img src="generated/images/guide/lifecycle-hooks/hooks-in-sequence.png" alt="Us" class="left" width="200" height="283"> <img src="generated/images/guide/lifecycle-hooks/hooks-in-sequence.png" alt="Us" class="left">
A component has a lifecycle managed by Angular. A component has a lifecycle managed by Angular.

10
aio/content/guide/reactive-forms.md
View File

@ -356,7 +356,7 @@ Now that everything is wired up, the browser should display something like this:
<figure> <figure>
<img src="generated/images/guide/reactive-forms/just-formcontrol.png" width="400" height="133" alt="Single FormControl"> <img src="generated/images/guide/reactive-forms/just-formcontrol.png" alt="Single FormControl">
</figure> </figure>
@ -460,7 +460,7 @@ Piping it through the `JsonPipe` renders the model as JSON in the browser:
<figure> <figure>
<img src="generated/images/guide/reactive-forms/json-output.png" width="400" height="176" alt="JSON output"> <img src="generated/images/guide/reactive-forms/json-output.png" alt="JSON output">
</figure> </figure>
@ -570,7 +570,7 @@ The browser displays the following:
<figure> <figure>
<img src="generated/images/guide/reactive-forms/validators-json-output.png" width="400" height="223" alt="Single FormControl"> <img src="generated/images/guide/reactive-forms/validators-json-output.png" alt="Single FormControl">
</figure> </figure>
@ -699,7 +699,7 @@ with the nested address `FormGroup`:
<figure> <figure>
<img src="generated/images/guide/reactive-forms/address-group.png" width="400" height="55" alt="JSON output"> <img src="generated/images/guide/reactive-forms/address-group.png" alt="JSON output">
</figure> </figure>
@ -1268,7 +1268,7 @@ Back in the browser, select the hero named "Magneta".
<figure> <figure>
<img src="generated/images/guide/reactive-forms/addresses-array.png" width="400" height="40" alt="JSON output of addresses array"> <img src="generated/images/guide/reactive-forms/addresses-array.png" alt="JSON output of addresses array">
</figure> </figure>

16
aio/content/guide/router.md
View File

@ -534,7 +534,7 @@ and the *Heroes* view with its list of heroes.
<figure> <figure>
<img src='generated/images/guide/router/hero-list.png' alt="Hero List" width="250"> <img src='generated/images/guide/router/hero-list.png' alt="Hero List">
</figure> </figure>
@ -542,7 +542,7 @@ and the *Heroes* view with its list of heroes.
Select one hero and the app takes you to a hero editing screen. Select one hero and the app takes you to a hero editing screen.
<figure> <figure>
<img src='generated/images/guide/router/hero-detail.png' alt="Crisis Center Detail" width="250"> <img src='generated/images/guide/router/hero-detail.png' alt="Crisis Center Detail">
</figure> </figure>
@ -559,7 +559,7 @@ Now click the *Crisis Center* link for a list of ongoing crises.
<figure> <figure>
<img src='generated/images/guide/router/crisis-center-list.png' alt="Crisis Center List" width="250"> <img src='generated/images/guide/router/crisis-center-list.png' alt="Crisis Center List">
</figure> </figure>
@ -572,7 +572,7 @@ Notice that the corresponding name in the crisis list does _not_ change.
<figure> <figure>
<img src='generated/images/guide/router/crisis-center-detail.png' alt="Crisis Center Detail" width="250"> <img src='generated/images/guide/router/crisis-center-detail.png' alt="Crisis Center Detail">
</figure> </figure>
@ -588,7 +588,7 @@ Up pops a dialog box.
<figure> <figure>
<img src='generated/images/guide/router/confirm-dialog.png' alt="Confirm Dialog" width="250"> <img src='generated/images/guide/router/confirm-dialog.png' alt="Confirm Dialog">
</figure> </figure>
@ -610,7 +610,7 @@ Proceed to the first application milestone.
Begin with a simple version of the app that navigates between two empty views. Begin with a simple version of the app that navigates between two empty views.
<figure> <figure>
<img src='generated/images/guide/router/router-1-anim.gif' alt="App in action" width="250"> <img src='generated/images/guide/router/router-1-anim.gif' alt="App in action">
</figure> </figure>
@ -766,7 +766,7 @@ and a *router outlet* where the router swaps views on and off the page. Here's w
<figure> <figure>
<img src='generated/images/guide/router/shell-and-outlet.png' alt="Shell" width="300"> <img src='generated/images/guide/router/shell-and-outlet.png' alt="Shell">
</figure> </figure>
@ -2692,7 +2692,7 @@ and two buttons, "Send" and "Cancel".
<figure> <figure>
<img src='generated/images/guide/router/contact-popup.png' alt="Contact popup" width="250"> <img src='generated/images/guide/router/contact-popup.png' alt="Contact popup">
</figure> </figure>

4
aio/content/guide/security.md
View File

@ -144,7 +144,7 @@ tag but keeps safe content such as the text content of the `<script>` tag and th
<figure> <figure>
<img src='generated/images/guide/security/binding-inner-html.png' width="700" height="285" alt='A screenshot showing interpolated and bound HTML values'> <img src='generated/images/guide/security/binding-inner-html.png' alt='A screenshot showing interpolated and bound HTML values'>
</figure> </figure>
@ -233,7 +233,7 @@ this, mark the URL value as a trusted URL using the `bypassSecurityTrustUrl` cal
<figure> <figure>
<img src='generated/images/guide/security/bypass-security-component.png' alt='A screenshot showing an alert box created from a trusted URL' width="700" height="223"> <img src='generated/images/guide/security/bypass-security-component.png' alt='A screenshot showing an alert box created from a trusted URL'>
</figure> </figure>

4
aio/content/guide/set-document-title.md
View File

@ -17,8 +17,8 @@ See the <live-example name="set-document-title"></live-example>.
<div class="l-sub-section clearfix"> <div class="l-sub-section clearfix">
<img src='generated/images/plunker/plunker-switch-to-editor-button.png' width="200" height="70" alt="pop out the window" class="right"> <img src='generated/images/plunker/plunker-switch-to-editor-button.png'alt="pop out the window" class="right">
<img src='generated/images/plunker/plunker-separate-window-button.png' width="200" height="47" alt="pop out the window" class="right"> <img src='generated/images/plunker/plunker-separate-window-button.png' alt="pop out the window" class="right">
To see the browser title bar change in the live example, To see the browser title bar change in the live example,
open it again in the Plunker editor by clicking the icon in the upper right, open it again in the Plunker editor by clicking the icon in the upper right,

2
aio/content/guide/structural-directives.md
View File

@ -501,7 +501,7 @@ Angular erases the middle "Hip!", leaving the cheer a bit less enthusiastic.
<figure> <figure>
<img src='generated/images/guide/structural-directives/template-rendering.png' width="350" height="59" alt="template tag rendering"> <img src='generated/images/guide/structural-directives/template-rendering.png' alt="template tag rendering">
</figure> </figure>

2
aio/content/guide/styleguide.md
View File

@ -4985,7 +4985,7 @@ Useful tools and tips for Angular.
**Consider** using [snippets](https://marketplace.visualstudio.com/items?itemName=johnpapa.Angular2) for [Visual Studio Code](https://code.visualstudio.com/) that follow these styles and guidelines. **Consider** using [snippets](https://marketplace.visualstudio.com/items?itemName=johnpapa.Angular2) for [Visual Studio Code](https://code.visualstudio.com/) that follow these styles and guidelines.
<a href="https://marketplace.visualstudio.com/items?itemName=johnpapa.Angular2"> <a href="https://marketplace.visualstudio.com/items?itemName=johnpapa.Angular2">
<img src="https://github.com/johnpapa/vscode-angular2-snippets/raw/master/images/use-extension.gif" width="700" height="429" alt="Use Extension"> <img src="generated/images/guide/styleguide/use-extension.gif" alt="Use Extension">
</a> </a>
**Consider** using [snippets](https://atom.io/packages/angular-2-typescript-snippets) for [Atom](https://atom.io/) that follow these styles and guidelines. **Consider** using [snippets](https://atom.io/packages/angular-2-typescript-snippets) for [Atom](https://atom.io/) that follow these styles and guidelines.

2
aio/content/guide/template-syntax.md
View File

@ -763,7 +763,7 @@ content harmlessly.
<figure> <figure>
<img src='generated/images/guide/template-syntax/evil-title.png' alt="evil title made safe" width="500" height="40"> <img src='generated/images/guide/template-syntax/evil-title.png' alt="evil title made safe">
</figure> </figure>
<a href="#top-of-page">back to top</a> <a href="#top-of-page">back to top</a>

6
aio/content/guide/testing.md
View File

@ -393,7 +393,7 @@ The Angular CLI has different commands to do the same thing. Adjust accordingly.
After a few moments, karma opens a browser and starts writing to the console. After a few moments, karma opens a browser and starts writing to the console.
<figure> <figure>
<img src='generated/images/guide/testing/karma-browser.png' width="400" height="142" alt="Karma browser"> <img src='generated/images/guide/testing/karma-browser.png' alt="Karma browser">
</figure> </figure>
@ -477,7 +477,7 @@ Debug specs in the browser in the same way that you debug an application.
<figure> <figure>
<img src='generated/images/guide/testing/karma-1st-spec-debug.png' width="700" height="150" alt="Karma debugging"> <img src='generated/images/guide/testing/karma-1st-spec-debug.png' alt="Karma debugging">
</figure> </figure>
@ -2511,7 +2511,7 @@ A better solution is to create an artificial test component that demonstrates al
<figure> <figure>
<img src='generated/images/guide/testing/highlight-directive-spec.png' width="200" height="159" alt="HighlightDirective spec in action"> <img src='generated/images/guide/testing/highlight-directive-spec.png' alt="HighlightDirective spec in action">
</figure> </figure>

14
aio/content/guide/upgrade.md
View File

@ -340,7 +340,7 @@ everything work seamlessly:
<figure> <figure>
<img src="generated/images/guide/upgrade/injectors.png" alt="The two injectors in a hybrid application" width="700" height="262"> <img src="generated/images/guide/upgrade/injectors.png" alt="The two injectors in a hybrid application">
</figure> </figure>
@ -385,7 +385,7 @@ ways:
<figure> <figure>
<img src="generated/images/guide/upgrade/dom.png" alt="DOM element ownership in a hybrid application" width="500" height="294"> <img src="generated/images/guide/upgrade/dom.png" alt="DOM element ownership in a hybrid application">
</figure> </figure>
@ -439,7 +439,7 @@ AngularJS and Angular approaches. Here's what happens:
<figure> <figure>
<img src="generated/images/guide/upgrade/change_detection.png" alt="Change detection in a hybrid application" width="600" height="163"> <img src="generated/images/guide/upgrade/change_detection.png" alt="Change detection in a hybrid application">
</figure> </figure>
@ -572,7 +572,7 @@ existing AngularJS code works as before _and_ you're ready to run Angular code.
### Using Angular Components from AngularJS Code ### Using Angular Components from AngularJS Code
<img src="generated/images/guide/upgrade/ajs-to-a.png" alt="Using an Angular component from AngularJS code" class="left" width="250" height="44"> <img src="generated/images/guide/upgrade/ajs-to-a.png" alt="Using an Angular component from AngularJS code" class="left">
@ -734,7 +734,7 @@ For example, we can easily make multiple copies of the component using `ng-repe
### Using AngularJS Component Directives from Angular Code ### Using AngularJS Component Directives from Angular Code
<img src="generated/images/guide/upgrade/a-to-ajs.png" alt="Using an AngularJS component from Angular code" class="left" width="250" height="44"> <img src="generated/images/guide/upgrade/a-to-ajs.png" alt="Using an AngularJS component from Angular code" class="left">
So, we can write an Angular component and then use it from AngularJS So, we can write an Angular component and then use it from AngularJS
@ -934,7 +934,7 @@ and then provide the input and output using Angular template syntax:
### Projecting AngularJS Content into Angular Components ### Projecting AngularJS Content into Angular Components
<img src="generated/images/guide/upgrade/ajs-to-a-with-projection.png" alt="Projecting AngularJS content into Angular" class="left" width="250" height="48"> <img src="generated/images/guide/upgrade/ajs-to-a-with-projection.png" alt="Projecting AngularJS content into Angular" class="left">
When we are using a downgraded Angular component from an AngularJS When we are using a downgraded Angular component from an AngularJS
@ -978,7 +978,7 @@ remains in "AngularJS land" and is managed by the AngularJS framework.
### Transcluding Angular Content into AngularJS Component Directives ### Transcluding Angular Content into AngularJS Component Directives
<img src="generated/images/guide/upgrade/a-to-ajs-with-transclusion.png" alt="Projecting Angular content into AngularJS" class="left" width="250" height="48"> <img src="generated/images/guide/upgrade/a-to-ajs-with-transclusion.png" alt="Projecting Angular content into AngularJS" class="left">
Just like we can project AngularJS content into Angular components, Just like we can project AngularJS content into Angular components,
we can *transclude* Angular content into AngularJS components, whenever we can *transclude* Angular content into AngularJS components, whenever

BIN
aio/content/images/guide/aot-compiler/toh-pt6-bundle-700w.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 119 KiB

BIN
aio/content/images/guide/architecture/component-tree.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.5 KiB

After

Width:  |  Height:  |  Size: 32 KiB

BIN
aio/content/images/guide/architecture/databinding.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 17 KiB

BIN
aio/content/images/guide/architecture/dependency-injection.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.5 KiB

After

Width:  |  Height:  |  Size: 11 KiB

BIN
aio/content/images/guide/architecture/directive.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 12 KiB

BIN
aio/content/images/guide/architecture/hero-component.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 9.4 KiB

BIN
aio/content/images/guide/architecture/library-module.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.0 KiB

After

Width:  |  Height:  |  Size: 21 KiB

BIN
aio/content/images/guide/architecture/module.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 15 KiB

BIN
aio/content/images/guide/architecture/overview2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 45 KiB

After

Width:  |  Height:  |  Size: 90 KiB

BIN
aio/content/images/guide/architecture/parent-child-binding.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 32 KiB

BIN
aio/content/images/guide/architecture/template-metadata-component.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.5 KiB

After

Width:  |  Height:  |  Size: 12 KiB

BIN
aio/content/images/guide/architecture/template.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
aio/content/images/guide/dependency-injection-in-action/date-logger-entry.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.5 KiB

After

Width:  |  Height:  |  Size: 6.8 KiB

BIN
aio/content/images/guide/dependency-injection-in-action/hero-of-month.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.2 KiB

After

Width:  |  Height:  |  Size: 18 KiB

BIN
aio/content/images/guide/http/http-toh.gif
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 172 KiB

After

Width:  |  Height:  |  Size: 34 KiB

BIN
aio/content/images/guide/http/wiki-1.gif
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 242 KiB

After

Width:  |  Height:  |  Size: 78 KiB

BIN
aio/content/images/guide/http/wiki-2.gif
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 156 KiB

After

Width:  |  Height:  |  Size: 39 KiB

BIN
aio/content/images/guide/lifecycle-hooks/hooks-in-sequence.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 27 KiB

BIN
aio/content/images/guide/reactive-forms/address-group.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 6.1 KiB

BIN
aio/content/images/guide/reactive-forms/addresses-array.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.2 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
aio/content/images/guide/reactive-forms/json-output.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 39 KiB

After

Width:  |  Height:  |  Size: 15 KiB

BIN
aio/content/images/guide/reactive-forms/just-formcontrol.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 8.8 KiB

BIN
aio/content/images/guide/reactive-forms/validators-json-output.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 59 KiB

After

Width:  |  Height:  |  Size: 25 KiB

BIN
aio/content/images/guide/router/confirm-dialog.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.0 KiB

After

Width:  |  Height:  |  Size: 6.9 KiB

BIN
aio/content/images/guide/router/contact-popup.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 13 KiB

BIN
aio/content/images/guide/router/crisis-center-detail.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 29 KiB

BIN
aio/content/images/guide/router/crisis-center-list.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 23 KiB

BIN
aio/content/images/guide/router/hero-detail.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.4 KiB

After

Width:  |  Height:  |  Size: 9.9 KiB

BIN
aio/content/images/guide/router/hero-list.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.8 KiB

After

Width:  |  Height:  |  Size: 14 KiB

BIN
aio/content/images/guide/router/router-1-anim.gif
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 9.7 KiB

BIN
aio/content/images/guide/router/shell-and-outlet.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.6 KiB

After

Width:  |  Height:  |  Size: 13 KiB

BIN
aio/content/images/guide/security/binding-inner-html.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 32 KiB

BIN
aio/content/images/guide/security/bypass-security-component.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 54 KiB

After

Width:  |  Height:  |  Size: 28 KiB

BIN
aio/content/images/guide/styleguide/use-extension.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 289 KiB

BIN
aio/content/images/guide/template-syntax/evil-title.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 8.9 KiB

BIN
aio/content/images/guide/testing/highlight-directive-spec.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.8 KiB

After

Width:  |  Height:  |  Size: 9.6 KiB

BIN
aio/content/images/guide/testing/karma-1st-spec-debug.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 81 KiB

After

Width:  |  Height:  |  Size: 46 KiB

BIN
aio/content/images/guide/testing/karma-browser.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 14 KiB

BIN
aio/content/images/guide/toh/mini-hero-detail.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.4 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

BIN
aio/content/images/guide/upgrade/a-to-ajs-with-transclusion.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.4 KiB

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
aio/content/images/guide/upgrade/a-to-ajs.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
aio/content/images/guide/upgrade/ajs-to-a-with-projection.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.6 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
aio/content/images/guide/upgrade/ajs-to-a.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
aio/content/images/guide/upgrade/change_detection.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 15 KiB

BIN
aio/content/images/guide/upgrade/dom.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.8 KiB

After

Width:  |  Height:  |  Size: 17 KiB

BIN
aio/content/images/guide/upgrade/injectors.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 28 KiB

BIN
aio/content/images/plunker/plunker-separate-window-button.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.9 KiB

After

Width:  |  Height:  |  Size: 5.4 KiB

BIN
aio/content/images/plunker/plunker-switch-to-editor-button.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 4.5 KiB

2
aio/content/tutorial/toh-pt5.md
View File

@ -967,7 +967,7 @@ After clicking a hero, users should see something like this below the hero list:
<figure> <figure>
<img src='generated/images/guide/toh/mini-hero-detail.png' alt="Mini Hero Detail" height="70"> <img src='generated/images/guide/toh/mini-hero-detail.png' alt="Mini Hero Detail">
</figure> </figure>