[Kibana] Update steps to create a dashboard with time series charts (elastic#3521)

This PR aligns the text with the current UI.

Relates to elastic#3214

Author: alaudazzi

explore-analyze/dashboards/create-dashboard-of-panels-with-ecommerce-data.md

@@ -19,7 +19,6 @@ When you’re done, you’ll have a complete overview of the sample web logs dat
 :screenshot:
 :::
 
-
 ## Add the data and create the dashboard [add-the-data-and-create-the-dashboard-advanced]
 
 Add the sample eCommerce data, and create and set up the dashboard.
@@ -33,9 +32,12 @@ Add the sample eCommerce data, and create and set up the dashboard.
 
 Open the visualization editor, then make sure the correct fields appear.
 
-1. On the dashboard, click **Create visualization**.
-2. Make sure the **Kibana Sample Data eCommerce** {{data-source}} appears, then set the [time filter](../query-filter/filtering.md) to **Last 30 days**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization**.
 
+2. Make sure the **Kibana Sample Data eCommerce** {{data-source}} appears, then set the [time filter](../query-filter/filtering.md) to **Last 30 days**.
 
 ## Create visualizations with custom time intervals [custom-time-interval]
 
@@ -91,14 +93,17 @@ To identify the 75th percentile of orders, add a reference line:
 
 5. Click **Save and return**.
 
-
 ## Analyze multiple data series [add-a-data-layer-advanced]
 
 You can create visualizations with multiple data series within the same time interval, even when the series have similar configurations with minor differences.
 
 To analyze multiple series, create a line chart that displays the price distribution of products sold over time:
 
-1. On the dashboard, click **Create visualization**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization** in the dashboard toolbar.
+
 2. Open the **Visualization type** dropdown, then select **Line**.
 3. From the **Available fields** list, drag **products.price** to the workspace.
 
@@ -129,14 +134,17 @@ To copy a function, you drag it to the **Add or drag-and-drop a field** area wit
 
 6. Click **Save and return**.
 
-
 ## Analyze multiple visualization types [add-a-data-layer]
 
 With layers, you can analyze your data with multiple visualization types. When you create layered visualizations, match the data on the horizontal axis so that it uses the same scale.
 
 To analyze multiple visualization types, create an area chart that displays the average order prices, then add a line chart layer that displays the number of customers.
 
-1. On the dashboard, click **Create visualization**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization** in the dashboard toolbar.
+
 2. From the **Available fields** list, drag **products.price** to the workspace.
 3. In the layer pane, click **Median of products.price**.
 
@@ -169,14 +177,17 @@ Add a layer to display the customer traffic:
 
 6. Click **Save and return**.
 
-
 ## Compare the change in percentage over time [percentage-stacked-area]
 
 By default, the visualization editor displays time series data with stacked charts, which show how the different document sets change over time.
 
 To view change over time as a percentage, create an **Area percentage** chart that displays three order categories over time:
 
-1. On the dashboard, click **Create visualization**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization** in the dashboard toolbar.
+
 2. From the **Available fields** list, drag **Records** to the workspace.
 3. Open the **Visualization type** dropdown, then select **Area**.
 
@@ -209,12 +220,15 @@ For each order category, create a filter:
 
 8. Click **Save and return**.
 
-
 ## View the cumulative number of products sold on weekends [view-the-cumulative-number-of-products-sold-on-weekends]
 
 To determine the number of orders made only on Saturday and Sunday, create an area chart, then add it to the dashboard.
 
-1. On the dashboard, click **Create visualization**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization** in the dashboard toolbar.
+
 2. Open the **Visualization type** dropdown, then select **Area**.
 
 Configure the cumulative sum of store orders:
@@ -246,14 +260,17 @@ Filter the results to display the data for only Saturday and Sunday:
 
 6. Click **Save and return**.
 
-
 ## Compare time ranges [compare-time-ranges]
 
 With **Time shift**, you can compare the data from different time ranges. To make sure the data displays correctly, choose a multiple of the date histogram interval when you use multiple time shifts. For example, you are unable to use a **36h** time shift for one series, and a **1d** time shift for the second series if the interval is **days**.
 
 To compare two time ranges, create a line chart that compares the sales in the current week with sales from the previous week:
 
-1. On the dashboard, click **Create visualization**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization** in the dashboard toolbar.
+
 2. Open the **Visualization type** dropdown, then select **Line**.
 3. From the **Available fields** list, drag **Records** to the workspace.
 4. To duplicate **Count of records**, drag **Count of records** to **Add or drag-and-drop a field** for **Vertical axis** in the layer pane.
@@ -275,14 +292,17 @@ To create a week-over-week comparison, shift **Count of records [1]** by one wee
 
 Time shifts can be used on any metric. The special shift **previous** will show the time window preceding the currently selected one in the time picker in the top right, spanning the same duration. For example, if **Last 7 days** is selected in the time picker, **previous** will show data from 14 days ago to 7 days ago. This mode can’t be used together with date histograms.
 
-
 ### Analyze the percent change between time ranges [compare-time-as-percent]
 
 With **Formula**, you can analyze the percent change in your data from different time ranges.
 
 To compare time range changes as a percent, create a bar chart that compares the sales in the current week with sales from the previous week:
 
-1. On the dashboard, click **Create visualization**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization** in the dashboard toolbar.
+
 2. From the **Available fields** list, drag **Records** to the workspace.
 3. In the layer pane, click **Count of records**.
 4. Click **Formula**, then enter `count() / count(shift='1w') - 1` in the **Formula** field.
@@ -298,14 +318,17 @@ To compare time range changes as a percent, create a bar chart that compares the
 
 8. Click **Save and return**.
 
-
 ## Analyze the data in a table [view-customers-over-time-by-continents]
 
 With tables, you can view and compare the field values, which is useful for displaying the locations of customer orders.
 
 Create a date histogram table and group the customer count metric by category, such as the continent registered in user accounts:
 
-1. On the dashboard, click **Create visualization**.
+1. Create a visualization.
+   
+   * {applies_to}`stack: ga 9.2` Select **Add** > **Visualization** in the toolbar.
+   * {applies_to}`stack: ga 9.0` Click **Create visualization** in the dashboard toolbar.
+
 2. Open the **Visualization type** dropdown, then select **Table**.
 3. From the **Available fields** list, drag **customer_id** to the **Metrics** field in the layer pane.