998453: Update Annotation Toolbar Screenshots and Add Notes for Toolbar Refinement

Document-Processing/PDF/PDF-Viewer/blazor/annotation/comments.md

@@ -18,7 +18,7 @@ The SfPdfViewer component provides options to add, edit, and delete comments for
 * Text markup annotation
 * Free text annotation
 
-![Comments in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-comments.png)
+![Comments in Blazor SfPdfViewer](../images/blazor-pdfviewer-comments.png)
 
 ## Adding a comment to the annotation
 
@@ -50,7 +50,7 @@ If the comment panel is already open, select an annotation and add a comment usi
 * The selected annotation’s comment container is highlighted in the comment panel.
 * Add a comment and any required replies using the comment panel.
 
-![Adding Comments in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-add-new-comment.png)
+![Adding Comments in Blazor SfPdfViewer](../images/blazor-pdfviewer-add-new-comment.png)
 
 ### Adding Comment Replies
 
@@ -64,7 +64,7 @@ If the comment panel is already open, select an annotation and add a comment usi
 * Select Set status in the context menu.
 * Choose the required status for the annotation comment.
 
-![Blazor PDFViewer with Comment Status](../../blazor-classic/images/blazor-pdfviewer-comment-status.png)
+![Blazor PDFViewer with Comment Status](../images/blazor-pdfviewer-comment-status.png)
 
 ### Editing the comments and comments replies of the annotations
 
@@ -95,15 +95,15 @@ Edit comments and replies in the following ways:
 * Choose the required status for the annotation comment.
 * Status 'None' is the default. Choosing 'None' removes the status indicator from the comment or reply.
 
-![Editing Comment in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-comment-editing.png)
+![Editing Comment in Blazor SfPdfViewer](../images/blazor-pdfviewer-comment-editing.png)
 
 ### Delete Comment or Comment Replies
 
 * Select the annotation comment in the comment panel.
 * Click the More options button in the comment or reply container.
 * Select Delete in the context menu.
 
-![Deleting Comment in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-delete-comments.png)
+![Deleting Comment in Blazor SfPdfViewer](../images/blazor-pdfviewer-delete-comments.png)
 
 N> Deleting the root comment from the comment panel also deletes the associated annotation.
 

Document-Processing/PDF/PDF-Viewer/blazor/annotation/free-text-annotation.md

@@ -21,7 +21,7 @@ Free text annotations can be added using the annotation toolbar.
 
 When Free Text Annotation mode is enabled from Pan, the viewer automatically switches to Text Select mode.
 
-![Free Text Annotation in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-free-text-annotation.png)
+![Free Text Annotation in Blazor SfPdfViewer](../images/blazor-pdfviewer-free-text-annotation.png)
 
 ```cshtml
 

Document-Processing/PDF/PDF-Viewer/blazor/annotation/import-export-annotation.md

@@ -18,12 +18,12 @@ The SfPdfViewer component supports importing and exporting annotations as a JSON
 * The annotation toolbar appears.
 * Select Comment Panel in the annotation toolbar.
 
-![Comment panel button shown in the annotation toolbar of SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-edit-sticknotes-comment.png)
+![Comment panel button shown in the annotation toolbar of SfPdfViewer](../images/blazor-pdfviewer-edit-sticknotes-comment.png)
 
 * The comment panel is displayed.
 * Select **More Option** in the comment panel container.
 
-![More options menu opened in the comment panel of SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-show-more-option.png)
+![More options menu opened in the comment panel of SfPdfViewer](../images/blazor-pdfviewer-show-more-option.png)
 
 ## Importing annotation to the PDF document
 
@@ -34,11 +34,11 @@ The SfPdfViewer component supports importing and exporting annotations as a JSON
 * Select **More Option** in the comment panel container.
 * Choose Import Annotations.
 
-![Import annotations option selected in the comment panel of SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-import-annotation.png)
+![Import annotations option selected in the comment panel of SfPdfViewer](../images/blazor-pdfviewer-import-annotation.png)
 
 * A file explorer dialog opens. Choose the JSON file to import into the loaded PDF document.
 
-![PDF document in SfPdfViewer after annotations have been imported from JSON](../../blazor-classic/images/blazor-pdfviewer-imported-annotation.png)
+![PDF document in SfPdfViewer after annotations have been imported from JSON](../images/blazor-pdfviewer-imported-annotation.png)
 
 ## Importing annotation using SfPdfViewer API
 
@@ -93,7 +93,7 @@ The SfPdfViewer component supports exporting annotations as a JSON file or JSON
 * Select **More Option** in the comments panel container.
 * Choose Export Annotations.
 
-![Export annotations option selected in the comments panel of SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-export-annotation.png)
+![Export annotations option selected in the comments panel of SfPdfViewer](../images/blazor-pdfviewer-export-annotation.png)
 
 N> The Export Annotations option is disabled when the loaded PDF document does not contain any annotations.
 

Document-Processing/PDF/PDF-Viewer/blazor/annotation/ink-annotation.md

@@ -11,7 +11,7 @@ documentation: ug
 
 The Blazor SfPdfViewer component supports adding, editing, and deleting ink annotations.
 
-![Ink annotation toolbar in Blazor PDF Viewer](../../blazor-classic/images/ink_annotation.png)
+![Ink annotation toolbar in Blazor PDF Viewer](../images/ink_annotation.png)
 
 ## Adding an ink annotation to the PDF document
 
@@ -21,7 +21,7 @@ Ink annotations can be added using the annotation toolbar.
 * Choose the **Draw Ink** button to enable ink mode.
 * Draw on any page of the loaded PDF document.
 
-![Draw ink tool in annotation toolbar](../../blazor-classic/images/ink_tool.png)
+![Draw ink tool in annotation toolbar](../images/ink_tool.png)
 
 ```cshtml
 @using Syncfusion.Blazor.Buttons
@@ -49,19 +49,19 @@ The stroke color, thickness, and opacity of an ink annotation can be modified us
 
 Change the stroke color using the color palette available in the Edit Stroke Color tool.
 
-![Change stroke color of ink annotation](../../blazor-classic/images/ink_strokecolor.png)
+![Change stroke color of ink annotation](../images/ink_strokecolor.png)
 
 ### Editing thickness
 
 Adjust the border thickness using the range slider in the Edit Thickness tool.
 
-![Change thickness of ink annotation](../../blazor-classic/images/ink_thickness.png)
+![Change thickness of ink annotation](../images/ink_thickness.png)
 
 ### Editing opacity
 
 Control the transparency using the range slider in the Edit Opacity tool.
 
-![Change opacity of ink annotation](../../blazor-classic/images/ink_opacity.png)
+![Change opacity of ink annotation](../images/ink_opacity.png)
 
 ## Setting default properties during the control initialization
 

Document-Processing/PDF/PDF-Viewer/blazor/annotation/measurement-annotation.md

@@ -17,7 +17,7 @@ The SfPdfViewer provides options to add and work with measurement annotations. U
 * Radius
 * Volume
 
-![Calibrate Annotation in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-annotation.png)
+![Calibrate Annotation in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-annotation.png)
 
 ## Adding measurement annotations to the PDF document
 
@@ -30,7 +30,7 @@ Measurement annotations can be added using the annotation toolbar.
 
 When a measurement mode is enabled while in Pan mode, the SfPdfViewer switches to Text Select mode.
 
-![Adding Calibrate in Blazor SfPdfViewer Toolbar](../../blazor-classic/images/blazor-pdfviewer-add-calibrate-in-toolbar.png)
+![Adding Calibrate in Blazor SfPdfViewer Toolbar](../images/blazor-pdfviewer-add-calibrate-in-toolbar.png)
 
 
 ```cshtml
@@ -65,31 +65,31 @@ The fill color, stroke color, thickness, and opacity of a measurement annotation
 
 Edit the fill color of the annotation using the color palette in the Edit Color tool.
 
-![Editing Calibrate FillColor in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-fillcolor.png)
+![Editing Calibrate FillColor in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-fillcolor.png)
 
 ### Editing stroke color
 
 Edit the stroke color of the annotation using the color palette in the Edit Stroke Color tool.
 
-![Editing Calibrate StrokeColor in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-stroke-color.png)
+![Editing Calibrate StrokeColor in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-stroke-color.png)
 
 ### Editing thickness
 
 Edit the border thickness of the annotation using the range slider in the Edit Thickness tool.
 
-![Editing Calibrate Thickness in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-thickness.png)
+![Editing Calibrate Thickness in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-thickness.png)
 
 ### Editing opacity
 
 Edit the opacity of the annotation using the range slider in the Edit Opacity tool.
 
-![Editing Calibrate Opacity in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-opacity.png)
+![Editing Calibrate Opacity in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-opacity.png)
 
 ### Editing the line properties
 
 The properties of line-based annotations such as Distance and Perimeter can be edited using the Line Properties window. Open it by selecting the Properties option from the context menu when right-clicking a distance or perimeter annotation.
 
-![Editing Calibrate Property in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-property.png)
+![Editing Calibrate Property in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-property.png)
 
 ## Setting default properties during control initialization
 
@@ -154,7 +154,7 @@ Set default properties for measurement annotations before initializing the contr
 
 Modify the scale ratio and unit of measurement using the Scale Ratio option in the context menu of the SfPdfViewer.
 
-![Editing Calibrate Scale Ratio in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-scaleratio.png)
+![Editing Calibrate Scale Ratio in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-scaleratio.png)
 
 The supported units of measurement for measurement annotations are:
 
@@ -165,7 +165,7 @@ The supported units of measurement for measurement annotations are:
 * Pica
 * Feet
 
-![Calibrate Scale Dialog in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-calibrate-scale-dialog.png)
+![Calibrate Scale Dialog in Blazor SfPdfViewer](../images/blazor-pdfviewer-calibrate-scale-dialog.png)
 
 ## Setting default scale ratio settings during control initialization
 

Document-Processing/PDF/PDF-Viewer/blazor/annotation/shape-annotation.md

@@ -17,7 +17,7 @@ The Blazor SfPdfViewer supports adding, editing, and deleting shape annotations.
 * Circle
 * Polygon
 
-![Shape annotations in the Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-shape-annotation.png)
+![Shape annotations in the Blazor SfPdfViewer](../images/blazor-pdfviewer-shape-annotation.png)
 
 ## Adding a shape annotation to the PDF document
 
@@ -30,7 +30,7 @@ Shape annotations can be added from the annotation toolbar.
 
 When the viewer is in pan mode and a shape drawing mode is activated, the control switches to text selection mode to enable drawing.
 
-![Adding shape annotations in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-add-shape-in-toolbar.png)
+![Adding shape annotations in Blazor SfPdfViewer](../images/blazor-pdfviewer-add-shape-in-toolbar.png)
 
 
 ```cshtml
@@ -64,31 +64,31 @@ The annotation toolbar provides tools to modify fill color, stroke color, thickn
 
 Use the Edit Color tool to change the annotation’s fill color via the color palette.
 
-![Editing fill color in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-edit-fill-color.png)
+![Editing fill color in Blazor SfPdfViewer](../images/blazor-pdfviewer-edit-fill-color.png)
 
 ### Editing stroke color
 
 Use the Edit Stroke Color tool to change the border color via the color palette.
 
-![Editing stroke color in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-edit-shape-stroke-color.png)
+![Editing stroke color in Blazor SfPdfViewer](../images/blazor-pdfviewer-edit-shape-stroke-color.png)
 
 ### Editing thickness
 
 Use the Edit Thickness tool to adjust the border thickness with the range slider.
 
-![Editing shape border thickness in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-shape-thickness.png)
+![Editing shape border thickness in Blazor SfPdfViewer](../images/blazor-pdfviewer-shape-thickness.png)
 
 ### Editing opacity
 
 Use the Edit Opacity tool to modify transparency with the range slider.
 
-![Editing shape opacity in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-shape-opacity.png)
+![Editing shape opacity in Blazor SfPdfViewer](../images/blazor-pdfviewer-shape-opacity.png)
 
 ### Editing the line properties
 
 Properties for line-based shapes (Line and Arrow) can be adjusted in the Line Properties dialog. Open it by choosing Properties from the context menu after right-clicking a line or arrow annotation.
 
-![Editing line and arrow properties in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-edit-line-property.png)
+![Editing line and arrow properties in Blazor SfPdfViewer](../images/blazor-pdfviewer-edit-line-property.png)
 
 ## Setting default properties during control initialization
 
@@ -184,7 +184,7 @@ The appearance of an annotation’s selector can be customized using [Annotation
 
 ```
 
-![Customized selector in Blazor SfPdfViewer](../../blazor-classic/images/customselector.png)
+![Customized selector in Blazor SfPdfViewer](../images/customselector.png)
 
 [View sample in GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Annotations/Selector/Customize%20Annotation%20%20Selector).
 

Document-Processing/PDF/PDF-Viewer/blazor/annotation/stamp-annotation.md

@@ -16,7 +16,7 @@ The SfPdfViewer component provides options to add, edit, delete, and rotate the
 * Standard business stamp
 * Custom stamp
 
-![Stamp annotations displayed in the Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-stamp-annotation.png)
+![Stamp annotations displayed in the Blazor SfPdfViewer](../images/blazor-pdfviewer-stamp-annotation.png)
 
 ## Adding stamp annotations to the PDF document
 
@@ -25,11 +25,11 @@ Stamp annotations can be added using the annotation toolbar.
 * Click the **Edit Annotation** button in the SfPdfViewer toolbar. A toolbar appears below it.
 * Click the **Stamp Annotation** dropdown button. A dropdown appears showing the available stamp types.
 
-![Adding Stamp in Blazor SfPdfViewer Toolbar](../../blazor-classic/images/blazor-pdfviewer-add-stamp-in-toolbar.png)
+![Adding Stamp in Blazor SfPdfViewer Toolbar](../images/blazor-pdfviewer-add-stamp-in-toolbar.png)
 
 * Select the required stamp type from the dropdown to add it to the page.
 
-![Selecting Annotation from Stamp Popup in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-select-stamp-annotation.png)
+![Selecting Annotation from Stamp Popup in Blazor SfPdfViewer](../images/blazor-pdfviewer-select-stamp-annotation.png)
 
 * Place the annotation on the desired page in the PDF document.
 
@@ -41,7 +41,7 @@ When entering stamp mode while in pan mode, the SfPdfViewer automatically switch
 * Click the **Stamp Annotation** dropdown button. A dropdown appears showing the available options.
 * Click the **Custom Stamp** button.
 
-![Custom stamp picker in the Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-custom-stamp.png)
+![Custom stamp picker in the Blazor SfPdfViewer](../images/blazor-pdfviewer-custom-stamp.png)
 
 * In the file explorer dialog, choose an image to add as a stamp on the PDF page.
 

Document-Processing/PDF/PDF-Viewer/blazor/annotation/sticky-notes-annotation.md

@@ -11,7 +11,7 @@ documentation: ug
 
 The SfPdfViewer control provides options to add, edit, and delete sticky notes annotations in a PDF document.
 
-![StickyNotes Annotation in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-stickynotes-annotation.png)
+![StickyNotes Annotation in Blazor SfPdfViewer](../images/blazor-pdfviewer-stickynotes-annotation.png)
 
 ## Adding a sticky note annotation to the PDF document
 
@@ -21,35 +21,35 @@ Sticky notes annotations can be added using the annotation toolbar.
 * Click the location on the page where the sticky note annotation should appear.
 * The sticky note annotation is added at the clicked position.
 
-![Adding StickyNotes in Blazor SfPdfViewer Toolbar](../../blazor-classic/images/blazor-pdfviewer-add-stickynotes-in-toolbar.png)
+![Adding StickyNotes in Blazor SfPdfViewer Toolbar](../images/blazor-pdfviewer-add-stickynotes-in-toolbar.png)
 
 Annotation comments can be added using the Comment panel.
 
 * Select a sticky note annotation in the PDF document and right-click it.
 * Select the Comment option from the context menu.
 * Use the Comment panel to add Comments, Reply, and Status.
 
-![Blazor SfPdfViewer with StickyNotes Comment](../../blazor-classic/images/blazor-pdfviewer-stickynotes-comment.png)
+![Blazor SfPdfViewer with StickyNotes Comment](../images/blazor-pdfviewer-stickynotes-comment.png)
 
 ## Editing the properties of the sticky note annotation
 
 ### Editing opacity
 
 Adjust the annotation opacity using the range slider in the Edit Opacity tool.
 
-![StickyNotes Opacity in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-stickynotes-opacity.png)
+![StickyNotes Opacity in Blazor SfPdfViewer](../images/blazor-pdfviewer-stickynotes-opacity.png)
 
 ### Editing comments
 
 The comment, comment reply, and comment status of the annotation can be edited using the Comment panel.
 
 - Open the Comment panel using the Comment Panel button in the annotation toolbar.
 
-![Editing StickyNotes Comment in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-edit-sticknotes-comment.png)
+![Editing StickyNotes Comment in Blazor SfPdfViewer](../images/blazor-pdfviewer-edit-sticknotes-comment.png)
 
 Use the menu in the Comment panel to modify or delete comments, replies, and their status.
 
-![StickyNotes Editing in Blazor SfPdfViewer](../../blazor-classic/images/blazor-pdfviewer-editing-stickynotes.png)
+![StickyNotes Editing in Blazor SfPdfViewer](../images/blazor-pdfviewer-editing-stickynotes.png)
 
 ## Setting default properties during control initialization