In our current implementation, loose lists and tight lists look the same visually. Loose lists are lists with blank lines between list items, and the contents of a list item should be enclosed in a paragraph tag in that case. For unordered lists, paragraph tags have a bottom margin in starlight and thus looses lists look much more spaced out than tight lists. That is not the behaviour we had in mind while writing the documentation, the reason we had all these loose lists is to make the documentation easy to write and read. So we attempt to remove all the blank lines and fix the problem at source. Since paragraph tags are used for other purposes in a list in starlight, it won't be a wise decision to let the source be as is and just change things in css, other expected behaviours might break in that case. See this topic for more details: https://chat.zulip.org/#narrow/channel/19-documentation/topic/new.20help.20center.3A.20regressions/near/2226084 All the changes were made by a one-off script which has not been commited to the repo. The script wasn't perfect and could not decide between blank lines that make a list loose vs blank lines necessary for a sub-list or a code block inside a list item. A manual review of all the changes was done before making this commit to ensure that no unintended changes were made to the help center files.
3.7 KiB
View images and videos
Zulip shows previews of attached images and videos, unless previews are disabled in your organization. You can click on a preview to view an image in more detail, or to play a video. Zulip also makes it convenient to browse all images and videos attached to messages in your current view.
Use the image viewer
{start_tabs}
{tab|desktop-web}
-
Click an image preview to open the image viewer.
-
You can interact with the image.
- Zoom in and out of the image
- Click and drag the image
- Reset zoom so that the image is recentered and back to its original size
- Open the image in a new browser tab
- Download the image
-
Click anywhere outside the image to close the image viewer once you are done.
!!! tip ""
You can click on the file name to download an image rather than viewing it
in the Zulip app.
!!! keyboard_tip ""
Use <kbd>V</kbd> to **open** the image viewer. Use <kbd>Shift</kbd> +
<kbd>Z</kbd> and <kbd>Z</kbd> to zoom in and out of the image. Use
<kbd>V</kbd> or <kbd>Esc</kbd> to **close** the image viewer.
{tab|mobile}
-
Tap an image preview or file name to open the image viewer.
-
You can interact with the image.
- Zoom in and out of the image
- Pan the image if you are zoomed in
- Tap the copy () icon in the bottom left corner of the app to copy a link to the image
-
Tap the X in the upper left corner of the app to close the image viewer once you are done.
{end_tabs}
Use the video player
{start_tabs}
{tab|desktop-web}
-
Click a video thumbnail to open the video player.
-
You can interact with the video.
- Play the video
- Adjust the volume
- Watch in full screen mode
- Open the video in a new browser tab
- Download the video if it was uploaded to Zulip
- Adjust playback speed
- Turn on picture-in-picture
-
Click anywhere outside the video to close the video player once you are done.
!!! tip ""
You can click on the file name to open the video in a new browser tab
rather than viewing it in the Zulip app.
!!! keyboard_tip ""
Use <kbd>V</kbd> to **open** the video player.
Use <kbd class="arrow-key">↑</kbd> and <kbd class="arrow-key">↓</kbd>
to increase or decrease the volume.
Use <kbd>V</kbd> or <kbd>Esc</kbd> to **close** the video player.
{tab|mobile}
-
Tap a video thumbnail, link, or file name to open the video in your device's default browser.
-
You can switch back to the Zulip app once you are done.
{end_tabs}
Browse images and videos
In the Zulip desktop or web app, you can browse the images and videos in the current view. For example, if you're in a channel view, you'll be able to browse through all the images and videos in that channel. If you do a search, the viewer will display all the images and videos in messages matching that search.
{start_tabs}
{tab|desktop-web}
-
Click an image preview or video thumbnail to open the viewer.
-
Browse by using the left and right arrow buttons at the bottom of the viewer.
-
Click any image or video to display it.
!!! keyboard_tip ""
Use <kbd>V</kbd> to **open** the viewer. Use
<kbd class="arrow-key">←</kbd> and <kbd class="arrow-key">→</kbd>
to scroll through the collection of images and videos.
{end_tabs}