Merge pull request #111220 from stevemunk/supported-browsers-CodePen

Removed CodePen sample and added a link to the Azure Maps Samples in article: Web SDK supported browsers

Author: Court72

articles/azure-maps/supported-browsers.md

@@ -1,10 +1,11 @@
 ---
-title: Web SDK supported browsers | Microsoft Azure Maps
+title: Web SDK supported browsers
+titleSuffix: Microsoft Azure Maps
 description: Find out how to check whether the Azure Maps Web SDK supports a browser. View a list of supported browsers. Learn how to use map services with legacy browsers.
 author: eriklindeman
 ms.author: eriklind
-ms.date: 03/25/2019
-ms.topic: conceptual
+ms.date: 06/22/2023
+ms.topic: how-to
 ms.service: azure-maps
 ms.custom: devx-track-js
 ---
@@ -57,23 +58,32 @@ The following Web SDK modules are also supported in Node.js:
 
 ## <a name="Target-Legacy-Browsers"></a>Target legacy browsers
 
-You might want to target older browsers that don't support WebGL or that have only limited support for it. In such cases, we recommend that you use Azure Maps services together with an open-source map control like [Leaflet](https://leafletjs.com/). Here's an example that makes use of the open source [Azure Maps Leaflet plugin](https://github.com/azure-samples/azure-maps-leaflet).
+You might want to target older browsers that don't support WebGL or that have only limited support for it. In such cases, you can use Azure Maps services together with an open-source map control like [Leaflet](https://leafletjs.com/).
 
-<br/>
+The [Render Azure Maps in Leaflet] Azure Maps sample shows how to render Azure Maps Raster Tiles in the Leaflet JS map control. This sample uses the open source [Azure Maps Leaflet plugin]. For the source code for this sample, see [Render Azure Maps in Leaflet sample source code].
 
+<!----------------------------------------
 <iframe height="500" scrolling="no" title="Azure Maps + Leaflet" src="//codepen.io/azuremaps/embed/GeLgyx/?height=500&theme-id=0&default-tab=html,result" frameborder="no" allowtransparency="true" allowfullscreen="true">
   See the Pen <a href='https://codepen.io/azuremaps/pen/GeLgyx/'>Azure Maps + Leaflet</a> by Azure Maps
-  (<a href='https://codepen.io/azuremaps'>@azuremaps</a>) on <a href='https://codepen.io'>CodePen</a>.
-</iframe>
+  (<a href='https://codepen.io/azuremaps'>@azuremaps</a>) on <a href='https://codepen.io'>CodePen</a>.</iframe>
+---------------------------------------->
 
-For code samples using Azure Maps in Leaflet, see [Azure Maps Samples](https://samples.azuremaps.com/?search=leaflet).
+For more code samples using Azure Maps in Leaflet, see [Azure Maps Samples].
 
-For a list of third-party map control plug-ins, see [Azure Maps community - Open-source projects](open-source-projects.md#third-part-map-control-plugins).
+For a list of third-party map control plug-ins, see [Azure Maps community - Open-source projects].
 
 ## Next steps
 
 Learn more about the Azure Maps Web SDK:
 
-[Map control](how-to-use-map-control.md)
+> [!div class="nextstepaction"]
+> [Map control](how-to-use-map-control.md)
 
-[Services module](how-to-use-services-module.md)
+> [!div class="nextstepaction"]
+> [Services module](how-to-use-services-module.md)
+
+[Render Azure Maps in Leaflet]: https://samples.azuremaps.com/third-party-map-controls/render-azure-maps-in-leaflet
+[Render Azure Maps in Leaflet sample source code]: https://github.com/Azure-Samples/AzureMapsCodeSamples/blob/main/Samples/Third%20Party%20Map%20Controls/Render%20Azure%20Maps%20in%20Leaflet/Render%20Azure%20Maps%20in%20Leaflet.html
+[Azure Maps Leaflet plugin]: https://github.com/azure-samples/azure-maps-leaflet
+[Azure Maps Samples]: https://samples.azuremaps.com/?search=leaflet
+[Azure Maps community - Open-source projects]: open-source-projects.md#third-part-map-control-plugins