Adding quick fix documenation (#2156)

* Adding quick fix documenation

* Writer/Editor pass

* Merged lists

* Intro to list

* tech corrections

* Adding new screenshots in light and dark

* Update microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension.md

Co-authored-by: Michael Hoffman <[email protected]>

* add -light to png

* Add -light to png name locally

* Removed unused pngs (#2170)

* Remove unused pngs

* Joined intro sentences

Co-authored-by: Michael S. Hoffman <[email protected]>
Co-authored-by: Reezaali <[email protected]>

Author: 3 people

microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension-images/light-bulb.png

@@ -5,7 +5,7 @@ author: MSEdgeTeam
 ms.author: msedgedevrel
 ms.topic: conceptual
 ms.prod: microsoft-edge
-ms.date: 07/07/2022
+ms.date: 09/07/2022
 ---
 # Microsoft Edge DevTools extension for Visual Studio Code
 
@@ -74,6 +74,32 @@ Issues are evaluated live while you edit your code.  As you type, you get feedba
 ![A possible issue being explained on an output element](microsoft-edge-devtools-extension-images/live-issue-reporting.png)
 
 
+#### Automated Quick Fixes and issue filtering
+
+<!--
+bold "Quick Fix" when focusing on the UI
+the UI label string is "Quick Fix", not "Quick Fixes"
+-->
+
+The Microsoft Edge DevTools extension for Visual Studio Code includes a **Quick Fix** feature.  By using Quick Fixes, you can customize the error reporting of the extension to meet the needs of the current project.
+
+When you hover over an element that has an issue, you get a lightbulb icon indicating that there are Quick Fixes available:
+
+![An anchor element with a protocol-specific href attribute highlighted as a problem, by a wavy underline and lightbulb icon above it](microsoft-edge-devtools-extension-images/light-bulb.png)
+
+Clicking the lightbulb icon shows a list of options. For example, if you added a link that has a protocol-relative URL, you get the following **Quick Fix** list to choose from:
+
+![The Quick Fix panel opened next to the anchor element with the error, offering several Quick Fix options](microsoft-edge-devtools-extension-images/quick-fix-options.png)
+
+You can select whichever **Quick Fix** you want to use to resolve the issue or to stop reporting it as an issue:
+
+* **Fix "no-protocol-relative-urls" issue** - Adds the missing URL prefix `https://` to the link.
+
+* **Disable "no-protocol-relative-urls" hints in this project** - Creates a `.hintrc` configuration file in the project folder, and tells the extension never to report this issue again.
+
+* **Edit .hintrc for this project** - Opens the `.hintrc` configuration file so you can edit it to customize the extension's error reporting.
+
+
 <!-- ====================================================================== -->
 ## Modes for using Microsoft Edge DevTools in Visual Studio Code