Updated Screenshots in the Collaboration section and revamped the Req…

…uirements page. (#563)

* Updated Screenshots in the "Projects and Settings" section.

Updated all the screenshots and GIFs in the "Projects and Settings" section according to the new UI.

* Updated screenshots in the Collaboration section and revamped Requirements page

Updated screenshots in the Collaboration section and revamped Requirements page according to the new UI.

* Update src/pages/docs/collaboration/assign-projects.md

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

src/pages/docs/collaboration/assign-projects.md

@@ -29,13 +29,13 @@ In Testsigma, you can create multiple projects and assign users to those project
 ## **Prerequisites**
 
 
-- You should know how to create a [project](https://testsigma.com/docs/projects/overview/). 
+- You should know how to create a [Project](https://testsigma.com/docs/projects/overview/). 
 
 
-- To add a user to a project, you should have the role of either test manager or admin for that project. *For more information, see [user roles](https://testsigma.com/docs/collaboration/users-roles/).*
+- To add a user to a project, you should have the role of either test manager or admin for that project. *For more information, see [User Roles](https://testsigma.com/docs/collaboration/users-roles/).*
 
 
-- You should know how to invite team members to Testsigma, see [adding team members](https://testsigma.com/docs/collaboration/invite-team-members/).
+- You should know how to invite team members to Testsigma, see [Adding Team Members](https://testsigma.com/docs/collaboration/invite-team-members/).
 
 
 ---
@@ -44,25 +44,25 @@ In Testsigma, you can create multiple projects and assign users to those project
 
 
 1. Navigate to **Setings > Users**. 
-![Users](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpnavusers.png)
+![Users](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assigning_New_Users_to_a_Project_1.png)
 
 
-2. Click on **Add new user**. This will open a promot. 
-![New User](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpcoaurs.png)
+2. Click on **Add new user**. This will open a dialog. 
+![New User](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assigning_New_Users_to_a_Project_2.1.png)
 
 
-3. On **Add new user** prompt, enter **Email**, check **projects** you want to assign and **roles** corresponding to projects. 
-![Add new users](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpsprjcts.png)
+3. On **Add new user** dialog, enter **Email**, check **projects** you want to assign and **roles** corresponding to projects. 
+![Add new users](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assigning_New_Users_to_a_Project_3.png)
 
 
 4. Click on **Send Invite**.
-![Invite](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpsendinvite.png)
+![Invite](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assigning_New_Users_to_a_Project_4.1.png)
 
 
 5. The user will get an email with the link to join the required project(s).
 
 
-Alternatively, you can also add users from **Project Settings**. For more information, refer to [user roles](https://testsigma.com/docs/collaboration/users-roles/). 
+Alternatively, you can also add users from **Project Settings**. For more information, refer to [User Roles](https://testsigma.com/docs/collaboration/users-roles/). 
 
 
 ---
@@ -72,15 +72,15 @@ Alternatively, you can also add users from **Project Settings**. For more inform
 
 
 1. Navigate to **Settings > Users**, click on the kebab menu corresponding to the user you want to assign a project.
-![Kebab Menu](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpkm.png)
+![Kebab Menu](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assigning_Existing_Users_to_a_Project_1.png)
 
 
-2. From the dropdown, click on **Edit user role**. This will open a prompt. 
-![Dropdown](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpdd.png)
+2. From the dropdown, click on **Edit user role**. This will open a dialog. 
+![Dropdown](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assigning_Existing_Users_to_a_Project_2.png)
 
 
-3. On **Edit User Role / Assign Projects** prompt, edit the details and click on **Update**.
-![Update](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpudetls.png)
+3. On **Edit User Role / Assign Projects** dialog, edit the details and click on **Update**.
+![Update](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assigning_Existing_Users_to_a_Project_3.2.png)
 
 
 

src/pages/docs/collaboration/elements-review-management.md

@@ -34,11 +34,11 @@ There are two ways to review an element:
 
 ## **Prerequisites**
 
-- You should know how to create an element. If not, refer to [create elements](https://testsigma.com/docs/elements/overview/).
+- You should know how to create an element. If not, refer to [Create Elements](https://testsigma.com/docs/elements/overview/).
 
 
 - To enable review management, make sure the option **Element Review Management**  is enabled under **Settings > Preferences**. 
-![Element Review Management](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/urmelmma.png)
+![Element Review Management](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Review_Management_for_Elemets_Prereq.png)
 
 
 ---
@@ -47,22 +47,22 @@ There are two ways to review an element:
 ## **Steps to Submit Elements for Review**
 
 1. Navigate to **Create Tests > Elements**. 
-![Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/ersnavelm.png)
+![Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Submit_Elements_for_Review_1.1.png)
 
 
 2. Hover over the element you want to submit for review and click on it. This will open element details overlay. 
 
 
 3. On **Element Details** overlay, click on **Edit**. 
-![Edit](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/erscoedit.png)
+![Edit](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Submit_Elements_for_Review_2.png)
 
 
-4. On **Update Element** overlay, click on **Submit for Review**. This will open a prompt for submission details. 
-![Submit](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/erssfre.png)
+4. On **Update Element** overlay, click on **Submit for Review**. This will open a dialog for submission details. 
+![Submit](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Submit_Elements_for_Review_4.2.png)
 
 
-5. On **Submit for Review** prompt, select **Reviewer** from the dropdown, add comments (optional) and click on **Submit**. 
-![Submit for Review](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/erssfrprompt.png)
+5. On **Submit for Review** dialog, select **Reviewer** from the dropdown, add comments (optional) and click on **Submit**. 
+![Submit for Review](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Submit_Elements_for_Review_5.2.png)
 
 
 
@@ -72,27 +72,27 @@ There are two ways to review an element:
 ## **Steps to Review Element**
 
 1. On the **Dashboard**, go to **Assigned for your review** section and click on **Elements**. 
-![Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/ersdnav.png)
+![Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Review_Element_1.png)
 
 
 2. Click on the **element** you are assigned to review. This will open **Elements** page with elements assigned for review. 
-![Element to review](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/erscoewinreview.png)
+![Element to review](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Review_Element_2.png)
 
 
 3. Hover over the element and click on the kebab menu and select **Edit** from the dropdown.  
-![Edit](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/erskmedit.png)
+![Edit](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Review_Element_3.png)
 
 
-4. On **Update Element** ovarlay, click on **Review element**. 
-![Review Element](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/rsecorelement.png)
+4. On **Update Element** overlay, click on **Review element**. 
+![Review Element](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Review_Element_4.1.png)
 
 
-5. On the **Update review status** prompt, you can either mark the status as **Approv** or **Rework** as per your review. 
-![Status](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/ersaprw.png)
+5. On the **Update review status** dialog, you can either mark the status as **Approve** or **Rework** as per your review. 
+![Status](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Review_Element_5.png)
 
 
 6. Once the status is marked, you'll be redirected to the **Update Element** overlay. Click on **Update Element** to save the review status. 
-![Update Element](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/erscouear.png)
+![Update Element](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Review_Element_6.1.png)
 
 
 

src/pages/docs/collaboration/invite-team-members.md

@@ -27,10 +27,10 @@ You can add unlimited team members to your project and assign them different rol
 ## **Prerequisites**
 
 
-- You should know how to create a [project](https://testsigma.com/docs/projects/overview/). 
+- You should know how to create a [Project](https://testsigma.com/docs/projects/overview/). 
 
 
-- To add a user to a project, you should have the role of either test manager or admin. *For more information, see [user roles](https://testsigma.com/docs/collaboration/users-roles/).*
+- To add a user to a project, you should have the role of either test manager or admin. *For more information, see [User Roles](https://testsigma.com/docs/collaboration/users-roles/).*
 
 
 ---
@@ -46,8 +46,8 @@ You can add unlimited team members to your project and assign them different rol
 ![Inviting Team Members to a Project 2](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Inviting_Team_Members_to_a_Project_Step_2.png)
 
 
-3. On **Invite new member** prompt, enter **Email** and select the **Role** you want to assign. 
-![Email & Role](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpnewmemeber.png)
+3. On **Invite new member** dialog, enter **Email** and select the **Role** you want to assign. 
+![Email & Role](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Steps_to_Invite_Team_Members_3.1.png)
 
 
 4. The invited user should receive an invitation email.

src/pages/docs/collaboration/manage-execution-stops.md

@@ -33,18 +33,18 @@ Super Admins control the stopping of executions by users in **Usage Details** an
 ## **Prerequisites**
 
 
-- You should know about [users & role management](https://testsigma.com/docs/collaboration/users-roles/).
+- You should know about [Users & Role Management](https://testsigma.com/docs/collaboration/users-roles/).
 
 
 ---
 
 ## **Enabling Stop Executions Preference**
 
 1. Navigate to **Settings** > **Preferences**.
-![Preferences](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/secspref.png)
+![Preferences](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Enabling_Stop_Executions_Preference_1.1.png)
 
 2. Enable the toggle switch for the **Control Who Can Stop Executions** feature flag, which will be toggled off by default. 
-![Enable](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/secprefer.png)
+![Enable](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Enabling_Stop_Executions_Preference_2.png)
 
 
 [[info | NOTE:]]

src/pages/docs/collaboration/users-roles.md

@@ -55,6 +55,7 @@ Below are the four roles that can be assigned to a project member in Testsigma:
 3. Click on **Edit user role**.
 ![Edit User](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Edit_users_to_assign_new_rules_3.png)
 
+
 4. On **Edit User Role / Assign Projects** prompt, select roles and click on **Update**. 
 ![Edit User Roles](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Edit_users_to_assign_new_rules_4.2.png)
 
@@ -63,18 +64,18 @@ Below are the four roles that can be assigned to a project member in Testsigma:
 ## **Assign Roles to Users from Project Settings**
 
 1. Navigate to **Project > Project Settings**, click on **Project Members**. 
-![Project Members](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/urmpmem.png)
+![Project Members](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assign_Roles_to_Users_from_Project_Settings_1.1.png)
 
 
 2. Click on **Invite**.
-![Invite](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/urminvite.png)
+![Invite](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assign_Roles_to_Users_from_Project_Settings_2.4.png)
 
 
-3. On **Invite new member** prompt, enter **Email** and select the **Role** you want to assign. 
-![Email & Role](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/urmear.png)
+3. On **Invite new member** dialog, enter **Email** and select the **Role** you want to assign. 
+![Email & Role](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assign_Roles_to_Users_from_Project_Settings_3.png)
 
-4. Click on **Update**. 
-![New User](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/urmud.png)
+4. Click on **Invite**. 
+![New User](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Assign_Roles_to_Users_from_Project_Settings_4.1.png)
 
 
 [[info | **NOTE**:]]
@@ -95,12 +96,15 @@ If you're the super administrator of the project, you can delete users.
 ![Project Members](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Deleteing_Users_from_a_Project_1.1.png)
 
 
-1. Hover over the user you want to delete and click on **Delete**. 
+2. Hover over the user you want to delete and click on **Delete**. 
+![Delete](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Deleting_Users_From_a_Project_2.png)
+
+3. Hover over the user you want to delete and click on **Delete**. 
 ![Delete](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpcodelete.png)
 
 
-3. On **Delete member**, enter **DELETE** and click on **Delete**.
-![Delete](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/autpdlprompt.png)
+4. On **Delete member** dialog, enter **DELETE** and click on **Delete**.
+![Delete](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Deleting_Users_From_a_Project_3.1.png)
 
 
 Alternatively, you can also delete user from global settings by navigating to **Settings > Users**.

src/pages/docs/projects/applications.md

@@ -28,7 +28,7 @@ The **Applications** tab within the **Project settings > Edit Project** menu pro
 
 
 [[info | **NOTE**:]]
-| If your project contains only a single application, the **Applications** tab will be hidden. To enable multiple applications, edit your project details. *For more information, refer to [project settings](https://testsigma.com/docs/projects/overview/)*.
+| If your project contains only a single application, the **Applications** tab will be hidden. To enable multiple applications, edit your project details. *For more information, refer to [Project Settings](https://testsigma.com/docs/projects/overview/)*.
 
 
 Once the **Applications** tab is enabled, you will be able to see all the applications created under the specific project.
@@ -42,16 +42,19 @@ Once the **Applications** tab is enabled, you will be able to see all the applic
 1. Navigate to **Project Settings > Edit Project > Applications**.
 ![Add an application 1](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Add_an_application_Step_1.png)
 
+2. Click on **New Application**.
+![Add Application](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/apscnapp.png)
 
-2. Click on **Add Application**.
-![Add an application 2](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Add_an_application_Step_2.png)
+3. On **New application** dialog, enter **Application name**, **Description**, **Version name**, and select **Application type**. 
+![Prompt](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/apspromdtls.png)
 
+4. Click on **Add Application**.
+![Add an application 2](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Add_an_application_Step_2.png)
 
-3. On **New application** prompt, enter **Application name**, **Description**, **Version name**, and select **Application type**. 
+5. On **New application** prompt, enter **Application name**, **Description**, **Version name**, and select **Application type**. 
 ![Add an application 3](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Add_an_application_step_3.png)
 
-
-4. Click on **Create**.
+6. Click on **Create**.
 ![Add an application 4](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Add_an_Application_step_4.3.png)
 
 ---

src/pages/docs/projects/overview.md

@@ -62,13 +62,19 @@ Here is a quick GIF demonstrating how to create a Project.
 1. Navigate to **Project > Project Settings**.
 ![Edit a Project 1](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Edit_a_Project_Step_1.png)
 
-2. This will open the **Edit Project** prompt. 
+2. This will open the **Edit Project** dialog. 
+![Edit Project](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/preditprompt.png)
+
+3. You can update **Project Details**, **Multiple Applications** and **Versions** from here. Also, you can add **Project Members**, **Test Case Types**, and **Requirement Types** on the same dialog. 
+![Update Details](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/prdetailsall.png) 
+
+4. This will open the **Edit Project** prompt. 
 ![Edit a Project 2](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Edit_a_Project_Step_2.png)
 
-3. You can update **Project Details**, **Multiple Applications** and **Versions** from here. Also, you can add **Project Members**, **Test Case Types**, and **Requirement Types** on the same prompt. 
+5. You can update **Project Details**, **Multiple Applications** and **Versions** from here. Also, you can add **Project Members**, **Test Case Types**, and **Requirement Types** on the same prompt. 
 ![Edit a Project 3](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Edit_a_Project_Step_3.png) 
 
-4. Click on **Update** to save the changes. 
+6. Click on **Update** to save the changes. 
 ![Edit a Project 4](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Edit_Project_4_2.png)
 
 **Adding**, **Editing**, and **Deleting** Applications & Versions can be done under **Project Settings > Applications**.
@@ -99,7 +105,10 @@ Here is a quick GIF demonstrating how to switch projects.
 2. Click on **Delete**.
 ![Delete a Project 2](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Delete_a_Project_Step_2.png)
 
-3. On the **Delete project** prompt, enter **DELETE** and click on **Delete**.
+3. On the **Delete project** dialog, enter **DELETE** and click on **Delete**.
+![DELETE](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/prdelefin.png) 
+
+4. On the **Delete project** prompt, enter **DELETE** and click on **Delete**.
 ![Delete a Project 3](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Delete_a_Project_step_3.png)