docs: fixed tutorial steps with identation formatting

Author: SkyZeroZx

adev/src/content/tutorials/first-app/steps/02-Home/README.md

@@ -63,26 +63,26 @@ In this step, you add the new component, `Home` to your app's root component, `A
 
 In the **Edit** pane of your IDE:
 
-1. Open `app.ts` in the editor.
-1. In `app.ts`, import `Home` by adding this line to the file level imports.
+1.  Open `app.ts` in the editor.
+1.  In `app.ts`, import `Home` by adding this line to the file level imports.
 
-<docs-code header="Import Home in src/app/app.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/app.ts" visibleLines="[2]"/>
+      <docs-code header="Import Home in src/app/app.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/app.ts" visibleLines="[2]"/>
 
-1. In `app.ts`, in `@Component`, update the `imports` array property and add `Home`.
+1.  In `app.ts`, in `@Component`, update the `imports` array property and add `Home`.
 
-<docs-code header="Replace in src/app/app.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/app.ts" visibleLines="[6]"/>
+      <docs-code header="Replace in src/app/app.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/app.ts" visibleLines="[6]"/>
 
-1. In `app.ts`, in `@Component`, update the `template` property to include the following HTML code.
+1.  In `app.ts`, in `@Component`, update the `template` property to include the following HTML code.
 
-<docs-code language="angular-ts" header="Replace in src/app/app.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/app.ts" visibleLines="[7,16]"/>
+      <docs-code language="angular-ts" header="Replace in src/app/app.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/app.ts" visibleLines="[7,16]"/>
 
-1. Save your changes to `app.ts`.
-1. If `ng serve` is running, the app should update.
-   If `ng serve` is not running, start it again.
-   _Hello world_ in your app should change to _home works!_ from the `Home`.
-1. Check the running app in the browser and confirm that the app has been updated.
+1.  Save your changes to `app.ts`.
+1.  If `ng serve` is running, the app should update.
+    If `ng serve` is not running, start it again.
+    _Hello world_ in your app should change to _home works!_ from the `Home`.
+1.  Check the running app in the browser and confirm that the app has been updated.
 
-<img alt="browser frame of page displaying the text 'home works!'" src="assets/images/tutorials/first-app/homes-app-lesson-02-step-2.png">
+  <img alt="browser frame of page displaying the text 'home works!'" src="assets/images/tutorials/first-app/homes-app-lesson-02-step-2.png">
 
 </docs-step>
 
@@ -97,22 +97,20 @@ Note that, this step just adds the search elements to the layout without any fun
 
 In the **Edit** pane of your IDE:
 
-1. In the `first-app` directory, open `home.ts` in the editor.
-1. In `home.ts`, in `@Component`, update the `template` property with this code.
+1.  In the `first-app` directory, open `home.ts` in the editor.
+1.  In `home.ts`, in `@Component`, update the `template` property with this code.
 
-<docs-code language="angular-ts" header="Replace in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/home/home.ts" visibleLines="[5,12]"/>
+      <docs-code language="angular-ts" header="Replace in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/home/home.ts" visibleLines="[5,12]"/>
 
-1. Next, open `home.css` in the editor and update the content with these styles.
+1.  Next, open `home.css` in the editor and update the content with these styles.
 
-   NOTE: In the browser, these can go in `src/app/home/home.ts` in the `styles` array.
+    NOTE: In the browser, these can go in `src/app/home/home.ts` in the `styles` array.
 
-   <docs-code header="Replace in src/app/home/home.css" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/home/home.css"/>
+       <docs-code header="Replace in src/app/home/home.css" path="adev/src/content/tutorials/first-app/steps/03-HousingLocation/src/app/home/home.css"/>
 
-1. Confirm that the app builds without error.
-   You should find the filter query box and button in your app and they should be styled.
-   Correct any errors before you continue to the next step.
+1.  Confirm that the app builds without error. You should find the filter query box and button in your app and they should be styled. Correct any errors before you continue to the next step.
 
-<img alt="browser frame of homes-app displaying logo, filter text input box and search button" src="assets/images/tutorials/first-app/homes-app-lesson-02-step-3.png">
+   <img alt="browser frame of homes-app displaying logo, filter text input box and search button" src="assets/images/tutorials/first-app/homes-app-lesson-02-step-3.png">
 </docs-step>
 
 </docs-workflow>

adev/src/content/tutorials/first-app/steps/03-HousingLocation/README.md

@@ -44,18 +44,18 @@ In this step, you add the new component, `HousingLocation` to your app's `Home`,
 
 In the **Edit** pane of your IDE:
 
-1. Open `home.ts` in the editor.
-1. In `home.ts`, import `HousingLocation` by adding this line to the file level imports.
+1.  Open `home.ts` in the editor.
+1.  In `home.ts`, import `HousingLocation` by adding this line to the file level imports.
 
-<docs-code header="Import HousingLocation in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/04-interfaces/src/app/home/home.ts" visibleLines="[2]"/>
+      <docs-code header="Import HousingLocation in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/04-interfaces/src/app/home/home.ts" visibleLines="[2]"/>
 
-1. Next update the `imports` property of the `@Component` metadata by adding `HousingLocation` to the array.
+1.  Next update the `imports` property of the `@Component` metadata by adding `HousingLocation` to the array.
 
-<docs-code  header="Add HousingLocation to imports array in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/04-interfaces/src/app/home/home.ts" visibleLines="[6]"/>
+      <docs-code  header="Add HousingLocation to imports array in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/04-interfaces/src/app/home/home.ts" visibleLines="[6]"/>
 
-1. Now the component is ready for use in the template for the `Home`. Update the `template` property of the `@Component` metadata to include a reference to the `<app-housing-location>` tag.
+1.  Now the component is ready for use in the template for the `Home`. Update the `template` property of the `@Component` metadata to include a reference to the `<app-housing-location>` tag.
 
-<docs-code language="angular-ts" header="Add housing location to the component template in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/04-interfaces/src/app/home/home.ts" visibleLines="[7,17]"/>
+      <docs-code language="angular-ts" header="Add housing location to the component template in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/04-interfaces/src/app/home/home.ts" visibleLines="[7,17]"/>
 
 </docs-step>
 
@@ -70,7 +70,7 @@ In this step, you will copy over the pre-written styles for the `HousingLocation
 
 1. Save your code, return to the browser and confirm that the app builds without error. You should find the message "housing-location works!" rendered to the screen.Correct any errors before you continue to the next step.
 
-<img alt="browser frame of homes-app displaying logo, filter text input box and search button and the message 'housing-location works!" src="assets/images/tutorials/first-app/homes-app-lesson-03-step-2.png">
+   <img alt="browser frame of homes-app displaying logo, filter text input box and search button and the message 'housing-location works!" src="assets/images/tutorials/first-app/homes-app-lesson-03-step-2.png">
 
 </docs-step>
 

adev/src/content/tutorials/first-app/steps/04-interfaces/README.md

@@ -44,13 +44,13 @@ In the **Terminal** pane of your IDE:
 <docs-step title="Add properties to the new interface">
 This step adds the properties to the interface that your app needs to represent a housing location.
 
-1. In the **Terminal** pane of your IDE, start the `ng serve` command, if it isn't already running, to build the app and serve it to `http://localhost:4200`.
-1. In the **Edit** pane of your IDE, open the `src/app/housinglocation.ts` file.
-1. In `housinglocation.ts`, replace the default content with the following code to make your new interface to match this example.
+1.  In the **Terminal** pane of your IDE, start the `ng serve` command, if it isn't already running, to build the app and serve it to `http://localhost:4200`.
+1.  In the **Edit** pane of your IDE, open the `src/app/housinglocation.ts` file.
+1.  In `housinglocation.ts`, replace the default content with the following code to make your new interface to match this example.
 
-<docs-code header="Update src/app/housinglocation.ts to match this code" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/housinglocation.ts" visibleLines="[1,10]" />
+      <docs-code header="Update src/app/housinglocation.ts to match this code" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/housinglocation.ts" visibleLines="[1,10]" />
 
-1. Save your changes and confirm the app does not display any errors. Correct any errors before you continue to the next step.
+1.  Save your changes and confirm the app does not display any errors. Correct any errors before you continue to the next step.
 
 At this point, you've defined an interface that represents data about a housing location including an `id`, `name`, and location information.
 </docs-step>
@@ -62,28 +62,28 @@ In this step, you create an instance of the interface and assign some sample dat
 You won't see this sample data appear in your app yet.
 There are a few more lessons to complete before that happens.
 
-1. In the **Terminal** pane of your IDE, run the `ng serve` command, if it isn't already running, to build the app and serve your app to `http://localhost:4200`.
-1. In the **Edit** pane of your IDE, open `src/app/home/home.ts`.
-1. In `src/app/home/home.ts`, add this import statement after the existing `import` statements so that `Home` can use the new interface.
+1.  In the **Terminal** pane of your IDE, run the `ng serve` command, if it isn't already running, to build the app and serve your app to `http://localhost:4200`.
+1.  In the **Edit** pane of your IDE, open `src/app/home/home.ts`.
+1.  In `src/app/home/home.ts`, add this import statement after the existing `import` statements so that `Home` can use the new interface.
 
-<docs-code language="angular-ts" header="Import Home in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/home/home.ts" visibleLines="[3]"/>
+      <docs-code language="angular-ts" header="Import Home in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/home/home.ts" visibleLines="[3]"/>
 
-1. In `src/app/home/home.ts`, replace the empty `export class Home {}` definition with this code to create a single instance of the new interface in the component.
+1.  In `src/app/home/home.ts`, replace the empty `export class Home {}` definition with this code to create a single instance of the new interface in the component.
 
-<docs-code language="angular-ts" header="Add sample data to src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/home/home.ts" visibleLines="[22,35]"/>
+      <docs-code language="angular-ts" header="Add sample data to src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/home/home.ts" visibleLines="[22,35]"/>
 
-1. Confirm that your `home.ts` file matches this example.
+1.  Confirm that your `home.ts` file matches this example.
 
-   <docs-code language="angular-ts" header="src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/home/home.ts" visibleLines="[[1,7],[9,36]]" />
+      <docs-code language="angular-ts" header="src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/05-inputs/src/app/home/home.ts" visibleLines="[[1,7],[9,36]]" />
 
-   By adding the `housingLocation` property of type `HousingLocation` to the `Home` class, we're able to confirm that the data matches the description of the interface. If the data didn't satisfy the description of the interface, the IDE has enough information to give us helpful errors.
+    By adding the `housingLocation` property of type `HousingLocation` to the `Home` class, we're able to confirm that the data matches the description of the interface. If the data didn't satisfy the description of the interface, the IDE has enough information to give us helpful errors.
 
-1. Save your changes and confirm the app does not have any errors. Open the browser and confirm that your application still displays the message "housing-location works!"
+1.  Save your changes and confirm the app does not have any errors. Open the browser and confirm that your application still displays the message "housing-location works!"
 
-<img alt="browser frame of homes-app displaying logo, filter text input box and search button and the message 'housing-location works!'" src="assets/images/tutorials/first-app/homes-app-lesson-03-step-2.png">
+      <img alt="browser frame of homes-app displaying logo, filter text input box and search button and the message 'housing-location works!'" src="assets/images/tutorials/first-app/homes-app-lesson-03-step-2.png">
 
-1. Correct any errors before you continue to the next step.
-   </docs-step>
+1.  Correct any errors before you continue to the next step.
+    </docs-step>
 
 </docs-workflow>
 

adev/src/content/tutorials/first-app/steps/06-property-binding/README.md

@@ -28,11 +28,11 @@ In the code editor:
 1.  In the template property of the `@Component` decorator, update the code to match the code below:
     <docs-code language="angular-ts" header="Add housingLocation property binding" path="adev/src/content/tutorials/first-app/steps/07-dynamic-template-values/src/app/home/home.ts" visibleLines="[15,17]"/>
 
-        When adding a property binding to a component tag, we use the `[attribute] = "value"` syntax to notify Angular that the assigned value should be treated as a property from the component class and not a string value.
+    When adding a property binding to a component tag, we use the `[attribute] = "value"` syntax to notify Angular that the assigned value should be treated as a property from the component class and not a string value.
 
-        The value on the right-hand side is the name of the property from the `Home`.
+    The value on the right-hand side is the name of the property from the `Home`.
 
-    </docs-step>
+</docs-step>
 
 <docs-step title="Confirm the code still works">
 1.  Save your changes and confirm the app does not have any errors.

adev/src/content/tutorials/first-app/steps/07-dynamic-template-values/README.md

@@ -27,7 +27,7 @@ In the code editor:
 1.  Navigate to `src/app/housing-location/housing-location.ts`
 1.  In the template property of the `@Component` decorator, replace the existing HTML markup with the following code:
 
-<docs-code language="angular-ts"  header="Update HousingLocation template in housing-location.ts" path="adev/src/content/tutorials/first-app/steps/08-ngFor/src/app/housing-location/housing-location.ts" visibleLines="[6,17]"/>
+    <docs-code language="angular-ts"  header="Update HousingLocation template in housing-location.ts" path="adev/src/content/tutorials/first-app/steps/08-ngFor/src/app/housing-location/housing-location.ts" visibleLines="[6,17]"/>
 
 In this updated template code you have used property binding to bind the `housingLocation.photo` to the `src` attribute. The `alt` attribute uses interpolation to give more context to the alt text of the image.
 

adev/src/content/tutorials/first-app/steps/09-services/README.md

@@ -35,9 +35,9 @@ In the **Terminal** pane of your IDE:
 1. In your project directory, navigate to the `first-app` directory.
 1. In the `first-app` directory, run this command to create the new service.
 
-```shell
-ng generate service housing --skip-tests
-```
+   ```shell
+   ng generate service housing --skip-tests
+   ```
 
 1. Run `ng serve` to build the app and serve it to `http://localhost:4200`.
 1. Confirm that the app builds without error.
@@ -63,7 +63,7 @@ In the **Edit** pane of your IDE:
 
    1. Add a file level import for the `HousingLocation`.
 
-   <docs-code header="Import HousingLocation type in  src/app/housing.service.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/housing.service.ts" visibleLines="[2]"/>
+      <docs-code header="Import HousingLocation type in  src/app/housing.service.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/housing.service.ts" visibleLines="[2]"/>
 
 1. Confirm that the app builds without error.
    Correct any errors before you continue to the next step.
@@ -75,23 +75,23 @@ In a later lesson, you'll replace the static data with a live data source to get
 
 In the **Edit** pane of your IDE, in `src/app/home/home.ts`:
 
-1. At the top of `src/app/home/home.ts`, add the `inject` to the items imported from `@angular/core`. This will import the `inject` function into the `Home` class.
+1.  At the top of `src/app/home/home.ts`, add the `inject` to the items imported from `@angular/core`. This will import the `inject` function into the `Home` class.
 
-<docs-code language="angular-ts" header="Update to src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/home/home.ts" visibleLines="[1]"/>
+      <docs-code language="angular-ts" header="Update to src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/home/home.ts" visibleLines="[1]"/>
 
-1. Add a new file level import for the `HousingService`:
+1.  Add a new file level import for the `HousingService`:
 
-<docs-code language="angular-ts" header="Add import to src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/home/home.ts" visibleLines="[4]"/>
+      <docs-code language="angular-ts" header="Add import to src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/home/home.ts" visibleLines="[4]"/>
 
-1. From `Home`, delete the `housingLocationList` array entries and assign `housingLocationList` the value of empty array (`[]`). In a few steps you will update the code to pull the data from the `HousingService`.
+1.  From `Home`, delete the `housingLocationList` array entries and assign `housingLocationList` the value of empty array (`[]`). In a few steps you will update the code to pull the data from the `HousingService`.
 
-1. In `Home`, add the following code to inject the new service and initialize the data for the app. The `constructor` is the first function that runs when this component is created. The code in the `constructor` will assign the `housingLocationList` the value returned from the call to `getAllHousingLocations`.
+1.  In `Home`, add the following code to inject the new service and initialize the data for the app. The `constructor` is the first function that runs when this component is created. The code in the `constructor` will assign the `housingLocationList` the value returned from the call to `getAllHousingLocations`.
 
-<docs-code language="angular-ts" header="Initialize data from service in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/home/home.ts" visibleLines="[23,30]"/>
+      <docs-code language="angular-ts" header="Initialize data from service in src/app/home/home.ts" path="adev/src/content/tutorials/first-app/steps/10-routing/src/app/home/home.ts" visibleLines="[23,30]"/>
 
-1. Save the changes to `src/app/home/home.ts` and confirm your app builds without error.
-   Correct any errors before you continue to the next step.
-   </docs-step>
+1.  Save the changes to `src/app/home/home.ts` and confirm your app builds without error.
+    Correct any errors before you continue to the next step.
+    </docs-step>
 
 </docs-workflow>