Send messages page needs animated GIFs and tabbed sections for mobile app workflows

[Rutam21]

Context

To help visual learners learn how to perform tasks using the Mattermost mobile app, add visuals and short animated GIFs on the Send messages page.

The page also needs new content on mobile workflows for the following sections.

• Draft Messages
• Edit Messages
• Delete Messages

Parent Issue: #6657

Docs Request

• Add/update appropriate visuals/GIFs for all the steps in the Send messages section under the mobile app tab.
• Add appropriate workflow steps along with visuals/GIFs for all the steps in the Draft messages section in a new mobile app tab.
• Add appropriate workflow steps along with visuals/GIFs for all the steps in the Edit messages section in a new mobile app tab.
• Add appropriate workflow steps along with visuals/GIFs for all the steps in the Delete messages section in a new mobile app tab.

Additional Notes

• Use the latest Mattermost mobile app and the standard Mattermost Denim theme to capture all workflows.
• Avoid drawing lines, arrows, boxes, or callouts on images.
• Don't forget to include ALT Text descriptions for all new image assets.
• Use existing docs pages with images as a starting point for code guidance. The Docs team can help provide RST syntax support for publication.
• Save static image files in PNG format within the docs repository's /images directory.

QA Validation Criteria

In a generated docs preview:

• Visiting the docs page results in appropriate new mobile-specific screenshots in each subsection from the Mobile tab.

[Rutam21]

@cwarnermm Please assign this issue to me. Thanks.