DOCSP-27356 update screenshot/ procedure for LeafyGreen pt1 (#455)

* DOCSP-27356 change screenshots

* DOCSP-27356 commit to see PR

* DOCSP-27356 corrections

* DOCSP-27356 internal feedback

* DOCSP-27356 final screenshot updates

* DOCSP-27356 delete picture

* DOCSP-27356 update size

* Revert "DOCSP-27356 delete picture"

This reverts commit 28ba08f7fc1e33a1f55c58dbd3f602ae65f4625c.

* Revert "DOCSP-27356 final screenshot updates"

This reverts commit c8da2b7cf635877fe3625f4dfe0a82d913824cf3.

* DOCSP-27356 fixed file to be same as master

* DOCSP-27356 update file

Author: jocelyn-mendez1

source/connect.txt

@@ -47,12 +47,6 @@ Considerations
 Connect
 -------
 
-When you open |compass-short|, an initial connection dialog appears:
-
-.. figure:: /images/compass/new-connection.png
-   :figwidth: 690px
-   :alt: New connection dialog for pasting your connection string
-
 You can connect your deployments by either:
 
 - Providing your connection string.

source/connect/advanced-connection-options/advanced-connection.txt

@@ -108,4 +108,4 @@ Procedure
 
 .. seealso::
 
-   To disconnect from your deployment, see :ref:`<disconnect-tab>`.
+   To disconnect from your deployment, see :ref:`<disconnect-tab>`. 

source/connect/disconnect.txt

@@ -10,10 +10,12 @@ Disconnecting from a MongoDB deployment closes the Compass connection to
 the active deployment and returns the Compass view to the initial
 connection dialog.
 
-To disconnect from a MongoDB deployment: 
+Steps
+-----
 
 .. include:: /includes/steps/disconnect-compass.rst
 
-.. seealso::
+Learn more
+----------
 
-   To create a new connection, see :ref:`connect-run-compass`. 
+To create a new connection, see :ref:`connect-run-compass`. 

source/images/compass/advanced-connection-options.png

@@ -1,14 +1,28 @@
 .. procedure::
    :style: normal
 
-   .. step:: Open query history.
+   .. step:: Open query history
 
       Click the :guilabel:`History` button on the query bar. 
 
-   .. step:: Select :guilabel:`Favorites`.
+      .. figure:: /images/compass/query-history-view.png
+         :figwidth: 720 px
+         :alt: Click history button
+
+   .. step:: Select favorites
 
       Click the :guilabel:`Star` button.
 
-   .. step:: Name your query.
+      .. figure:: /images/compass/query-add-favorite.png
+         :figwidth: 316 px
+         :alt: Click star button
+
+   .. step:: Name your query
+
+      Enter a name for your query.
+
+      .. figure:: /images/compass/query-add-favorite-name.png
+         :figwidth: 316 px
+         :alt: Save favorite query
 
    ..step:: Click :guilabel:`Save`.

source/images/compass/collection-schema.png

@@ -8,10 +8,17 @@ To save your pipeline:
 .. procedure::
    :style: normal
 
-   .. step:: Click the :guilabel:`Save` dropdown button.
+   .. step:: Click the save dropdown button
 
-      Click on ``Save pipeline as...``.
+      Click the :guilabel:`Save` dropdown button at the top of the pipeline
+      builder. Click on ``Save pipeline as...``
 
-   .. step:: Enter a name for your pipeline.
+      .. figure:: /images/compass/query-save-pipeline-as.png
+         :alt: Save pipeline as
 
-   .. step:: Click :guilabel:`Save`. 
+   .. step:: Enter a name for your pipeline
+
+      .. figure:: /images/compass/query-save-pipeline-as-name.png
+         :alt: Name your pipeline
+
+   .. step:: Click :guilabel:`Save`

source/images/compass/disconnect.png

@@ -1,7 +1,7 @@
 .. procedure::
    :style: normal
 
-   .. step:: Open your query history.
+   .. step:: Open query history
 
       Click the :guilabel:`History` button at the top of the 
       :guilabel:`Documents` tab.
@@ -10,6 +10,10 @@
          :figwidth: 600 px
          :alt: Query history view
 
-   .. step:: Click the :guilabel:`Favorites` button in the past queries pane.
+   .. step:: Select favorites
 
-      Select favorite queries. 
+      Click the :guilabel:`Favorites` button in the past queries pane.
+
+      .. figure:: /images/compass/query-history-favorite.png
+         :figwidth: 316px
+         :alt: Favorites

source/images/compass/favorite-connection-select.png

@@ -4,28 +4,50 @@ ref: click-chart-value
 content: |
 
     In the :guilabel:`Schema` view, you can click on a chart value to
-    build a query.
+    build a query. For example, the following image shows the query
+    filter built by clicking the ``EWR`` value for the
+    ``departureAirportFsCode`` field.
+
+    .. figure:: /images/compass/query-builder.png
+       :figwidth: 815px
+       :alt: Example of a created filter
 ---
-title: (Optional) Select multiple values.
+title: Optional. Select multiple values.
 level: 4
 ref: click-chart-value-multiple
 content: |
    To select multiple values for a field, click and drag the cursor
    over a selection of values, or press shift+click on the desired
    values.
+
+   .. figure:: /images/compass/query-builder3.png
+      :figwidth: 817px
+      :alt: Exmaple of selecting multimple values for a field
+
 ---
-title: (Optional) Click on other field values to create a compound query.
+title: Optional. Click on other field values to create a compound query.
 level: 4
-ref: create-compound-query. 
+ref: create-compound-query
+content: |
+   For example, the following image shows shows the compound query
+   built by selecting a value in the ``flightId`` field.
+
+   .. figure:: /images/compass/query-builder2.png
+      :figwidth: 817px
+      :alt: Example of a compound query
 ---
-title: (Optional) Deselect a value.
+title: Optional. Deselect a value.
 level: 4
 ref: remove-from-query
 content: |
     To deselect a previously selected value, shift+click on
-    the selected value.
+    the selected value:
+
+    .. figure:: /images/compass/query-builder4.png
+       :figwidth: 740px
+       :alt: Example of removing a value from a filter
 ---
-title: Run the query.
+title: Run the query
 level: 4
 ref: run-query
 content: |

source/images/compass/instance-view.png

@@ -5,7 +5,4 @@ ref: connect-menu-bar
 title: Select :guilabel:`Disconnect` from the dropdown menu.
 level: 4
 ref: select-disconnect
-content: |
-  .. figure:: /images/compass/disconnect.png
-     :figwidth: 500px
-     :alt: Disconnect menu item
+...

source/images/compass/name-favorite-connection-menu.png

@@ -15,9 +15,13 @@ content: |
   |compass|, see :ref:`Aggregation Pipeline Builder
   <compass-agg-builder>`.
 ---
-title: Click :guilabel:`Export to Language`.
+title: Click the :guilabel:`Export` button.
 level: 4
 ref: select-export
+content: |
+  .. figure:: /images/compass/agg-builder-export-dropdown.png
+     :figwidth: 720px
+     :alt: Aggregation Builder export dropdown
 ---
 title: Select your desired export language.
 level: 4

source/images/compass/new-connection.png

@@ -7,10 +7,6 @@ title: Click the :icon-fa5:`ellipsis-h` button on the connection.
 level: 4
 ref: click-ellipsis
 content: |
-  .. figure:: /images/compass/favorite-connection-select.png
-     :figwidth: 400px
-     :alt: Image showing selecting Favorite Connection dropdown
-
   |compass-short| displays a dropdown menu with options 
   :guilabel:`Copy` and :guilabel:`Remove`.
 ---

source/images/compass/osx-install-dialog.png

@@ -3,15 +3,13 @@ title: Click the desired connection under :guilabel:`Favorites`
 level: 4
 ref: locate-connection
 content: |
-  .. figure:: /images/compass/saved-favorite-connection.png
-     :figwidth: 600px
-     :alt: Saved Favorite Connection
+  To :guilabel:`Copy connection string`, :guilabel:`Duplicate`, or 
+  :guilabel:`Remove` a Favorite Connection, hover over the target connection and 
+  click the :icon-fa5:`ellipsis-h` button.
   
-  To :guilabel:`Copy` or :guilabel:`Remove` a Favorite Connection, 
-  hover over the target connection and click the :icon-fa5:`ellipsis-h` 
-  button.
-  
-  - Copying a connection creates another Favorite Connection with the 
+  - Copying a connection string saves the connection string to your clipboard.
+
+  - Duplicating a connection creates another Favorite Connection with the 
     same configuration. 
   
   - Removing a connection deletes that Favorite Connection.

source/images/compass/performance-view-full.png

@@ -1,20 +1,11 @@
 title: Click :guilabel:`Favorite` on the left navigation panel.
 level: 4
 ref: save-connection
-content: |
-
-  .. figure:: /images/compass/save-favorite-menu.png
-     :figwidth: 600px
-     :alt: Save connection to favorites from menu
-
 ---
 title: Enter a name for this favorite connection.
 level: 4
 ref: enter-favorite-name
 content: |
-  .. figure:: /images/compass/name-favorite-connection-menu.png
-      :figwidth: 600px
-      :alt: Name Favorite Connection
 ---
 title: (Optional) Select a color for your favorite to more easily
   identify the favorite connection.

source/images/compass/performance-view.png

@@ -7,17 +7,11 @@ title: Click :guilabel:`Favorite` at the top of the form.
 level: 4
 ref: type-favorite-name
 content: |
-   .. figure:: /images/compass/favorite-button-connect.png
-      :figwidth: 600px
-      :alt: Favorite Connection Button
 ---
 title: Enter a name for this favorite connection.
 level: 4
 ref: enter-favorite-name
 content: |
-  .. figure:: /images/compass/name-favorite-connection.png
-      :figwidth: 600px
-      :alt: Name Favorite Connection
 ---
 title: (Optional) Select a color for your favorite to more easily
   identify the favorite connection.

source/images/compass/privacy-settings.png

@@ -29,9 +29,13 @@ title: Connect.
 level: 4
 ref: compass-connect
 content: |
-   Click the :guilabel:`Connect` button to navigate to the
+   Click :guilabel:`Connect` or :guilabel:`Save & Connect` to navigate to the 
    |compass-short| :doc:`Home Page </instance>`.
 
+   The :guilabel:`Save & Connect` button prompts you to save your connection 
+   string as a :ref:`Favorite Connection <favorite-connections>` and then 
+   navigates to the home page. 
+
    .. important:: Required Access
 
       Once you are connected to your MongoDB deployment, you may

source/images/compass/query-bar-schema-view.png

@@ -214,10 +214,6 @@ Select your operating system:
       #. Drag the |compass| application to your
          :guilabel:`Applications` folder.
 
-         .. figure:: /images/compass/osx-install-dialog.png
-            :figwidth: 600px
-            :alt: OSX installation dialog
-
       #. Eject the disk image.
 
       #. From the :guilabel:`Applications` folder, double-click on

source/images/compass/query-history-view.png

@@ -16,21 +16,13 @@ MongoDB instance to which Compass is connected, including:
 - The connection name if the connection is a favorite connection,
   or "My Cluster" otherwise.
 
-- The deployment type (standalone, replica set, sharded cluster). If
-  the deployment is a replica set and the replica set name is specified
-  in the connection window, the number of replica set members will also
-  be displayed.
-
-- The hostname and port, as well as the version of MongoDB.
+- Your :ref:`saved queries and aggregation pipelines <view-favorite-queries>`. 
 
 - A list of the instance's :doc:`databases </databases>`.
 
 - :doc:`Performance statistics </performance>`, including memory
   usage, operation counts, and slowest operations.
 
-.. figure:: /images/compass/instance-view.png
-   :alt: Compass Home View
-
 Once connected to a MongoDB instance, you can reach the Compass
 Home screen by clicking the cluster name in the upper left
 corner.

source/images/compass/query-my-queries-splash.png

@@ -28,7 +28,7 @@ Server Stats
 
 The :guilabel:`Performance` tab displays various stats:
 
-.. figure:: /images/compass/performance-view-full.svg
+.. figure:: /images/compass/performance-view-full.png
   :figwidth: 720px
   :alt: Performance statistics example
 
@@ -100,27 +100,12 @@ Kill Slow Operations
 
 You can kill slow operations from the :guilabel:`Performance Tab`.
 
-1. Click the query you would like to kill in the
-   :guilabel:`Slowest Operations` section.
+.. procedure::
+   :style: normal
 
-   |
+   .. step:: Click the query you would like to kill in the :guilabel:`Slowest Operations` section.
 
-   .. figure:: /images/compass/slow-ops.png
-      :scale: 50%
-      :alt: Slow Operations section
-
-   |
- 
-2. In the :guilabel:`Operation Details` view, click
-   :guilabel:`Kill Op`.
-
-   |
-
-   .. figure:: /images/compass/kill-op.png
-      :scale: 50%
-      :alt: Kill Op button
-
-   |
+   .. step:: In the :guilabel:`Operation Details` view, click :guilabel:`Kill Op`.
 
 Pause the Display
 -----------------

source/images/compass/saved-favorite-connection.png

@@ -33,6 +33,8 @@ To add a query to your favorites:
 
 .. include:: /includes/fact-favorite-query.rst
 
+.. _view-favorite-queries:
+
 Viewing Saved Queries
 ---------------------
 
@@ -52,7 +54,7 @@ When you click a saved or favorite pipeline tile, Compass opens the
 :guilabel:`Aggregations` tab with the pipeline loaded.
 
 .. figure:: /images/compass/query-my-queries-splash.png
-   :figwidth: 650 px
+   :figwidth: 720 px
    :alt: My queries view
 
 Using the :guilabel:`Favorites` Tab