Docs: Fixes for 11.1 visualizations docs (#89193)

* Updated table wrapping and auto wording

* Fixed formatting to match other lists

* Fixed admonition styling and moved content out of note into body

* Added note re feature toggle

* Fixed typo

* Added comma

Co-authored-by: Adela Almasan <88068998+adela-almasan@users.noreply.github.com>

---------

Co-authored-by: Adela Almasan <88068998+adela-almasan@users.noreply.github.com>

docs/sources/panels-visualizations/visualizations/stat/index.md

@@ -27,9 +27,9 @@ refs:
 
 # Stat
 
-{{% admonition type="note" %}}
+{{< admonition type="note" >}}
 This visualization replaces the Singlestat visualization, which was deprecated in Grafana 7.0 and removed in Grafana 8.0.
-{{% /admonition %}}
+{{< /admonition >}}
 
 A stat visualization displays your data in single values of interest&mdash;such as the latest or current value of a series&mdash;with an optional graph sparkline. A graph sparkline, which is only available in stat visualizations, is a small time-series graph shown in the background of each value in the visualization.
 
@@ -157,9 +157,9 @@ Set whether wide layout is enabled or not. Wide layout is enabled by default.
 - **On -** Wide layout is enabled.
 - **Off -** Wide layout is disabled.
 
-{{% admonition type="note" %}}
+{{< admonition type="note" >}}
 This option is only applicable when **Text mode** is set to **Value and name**. When wide layout is enabled, the value and name are displayed side-by-side with the value on the right, if the panel is wide enough. When wide layout is disabled, the value is always rendered underneath the name.
-{{% /admonition %}}
+{{< /admonition >}}
 
 ### Color mode
 
@@ -188,19 +188,17 @@ Choose an alignment mode.
 
 Set whether percent change is displayed or not. Disabled by default.
 
-{{% admonition type="note" %}}
+{{< admonition type="note" >}}
 This option is not applicable when the **Show** setting, under **Value options**, is set to **All values**.
-{{% /admonition %}}
+{{< /admonition >}}
 
 ### Percent change color mode
 
-- **Standard** -- Green if the percent change is positive, red if the percent change is negative.
-- **Inverted** -- Red if the percent change is positive, green if the percent change is negative.
-- **Same as Value** -- Use the same color as the value.
+This option is only displayed when **Show percent change** is enabled. Choose from:
 
-{{% admonition type="note" %}}
-This option only appears when **Show percent change** is enabled.
-{{% /admonition %}}
+- **Standard -** Green if the percent change is positive, red if the percent change is negative.
+- **Inverted -** Red if the percent change is positive, green if the percent change is negative.
+- **Same as Value -** Use the same color as the value.
 
 ## Text size
 

docs/sources/panels-visualizations/visualizations/table/index.md

@@ -120,9 +120,9 @@ If you set these in the Field tab, then the type will apply to all fields, inclu
 
 ### Auto
 
-The Auto cell type will automatically display values with sensible defaults applied.
+The **Auto** cell type automatically displays values, with sensible defaults applied.
 
-Toggle the **Wrap text** switch, to wrap text in the cell with the longest content or the matched field in the case of field overrides.
+Toggle the **Wrap text** switch to wrap text in the cell with the longest content or the matched field, if you've set a field override.
 
 ### Color text
 
@@ -130,7 +130,7 @@ If thresholds are set, then the field text is displayed in the appropriate thres
 
 {{< figure src="/static/img/docs/tables/color-text.png" max-width="500px" caption="Color text" class="docs-image--no-shadow" >}}
 
-Toggle the **Wrap text** switch, to wrap text in the cell with the longest content or the matched field in the case of field overrides.
+Toggle the **Wrap text** switch to wrap text in the cell with the longest content or the matched field, if you've set a field override.
 
 ### Color background (gradient or solid)
 
@@ -142,7 +142,7 @@ Toggle the **Apply to entire row** switch, to apply the background color that's
 
 {{< figure src="/static/img/docs/tables/colored-rows.png" max-width="500px" alt="Colored row background" class="docs-image--no-shadow" >}}
 
-Toggle the **Wrap text** switch, to wrap text in the cell with the longest content or the matched field in the case of field overrides.
+Toggle the **Wrap text** switch to wrap text in the cell with the longest content or the matched, if field you've set a field override.
 
 ### Gauge
 

docs/sources/panels-visualizations/visualizations/xy-chart/index.md

@@ -59,6 +59,10 @@ refs:
 
 # XY chart
 
+{{< admonition type="note">}}
+To use xy charts, enable the `autoMigrateXYChartPanel` [feature toggle](https://grafana.com/docs/grafana/latest/setup-grafana/configure-grafana/feature-toggles/).
+{{< /admonition >}}
+
 XY charts provide a way to visualize arbitrary x and y values in a graph so that you can easily show the relationship between two variables. XY charts are typically used to create scatter plots. You can also use them to create bubble charts where field values determine the size of each bubble:
 
 ![An xy chart showing height weight distribution](/media/docs/grafana/panels-visualizations/screenshot-xy-charts-v11.0.png)