CSS: Toolbar

.PSPDFKit-Toolbar

The toolbar is positioned on the top of PSPDFKit for Web and contains the most important buttons for a user to interact with the PDF, like zooming, creating annotations or starting a search.

.PSPDFKit-Toolbar-Button-Sidebar

Toggles the sidebar.

.PSPDFKit-Toolbar-Button-Sidebar-Thumbnails

Is also: .PSPDFKit-Toolbar-Button-Sidebar
Toggles the sidebar with the document pages thumbnails.

.PSPDFKit-Page-Indicator-Prev

Can also be: .PSPDFKit-Page-Indicator-Prev-disabled
Button to go to the previous page. If the user is on the first page, it gets disabled.

.PSPDFKit-Page-Indicator-Next

Can also be: .PSPDFKit-Page-Indicator-Next-disabled
Button to go to the next page. If the user is on the last page, it gets disabled.

.PSPDFKit-Page-Indicator-Input

Input field that shows the current page. This changes when the user scrolls to another page and can get modified by the user to jump to a specific page.

.PSPDFKit-Toolbar-Button

Can also be: .PSPDFKit-Toolbar-Button-active .PSPDFKit-Toolbar-Button-disabled
Every button within the toolbar can be selected with this class. Some buttons can get active (for example, when the user activates an annotation mode) and also can get disabled (for example, the next-page button gets disabled when the user is on the last page).

.PSPDFKit-Toolbar-Button-Icon

Icon inside a `.PSPDFKit-Toolbar-Button`.

.PSPDFKit-Toolbar-Button-Pan

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-disabled
Button to enable or disable the pan mode that allows the user to navigate the page by using a drag feature. This button will not be available on mobile devices.

.PSPDFKit-Toolbar-Button-Zoom-Out

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-disabled
Button to zoom out gets disabled when the user reached the minimum zoom level.

.PSPDFKit-Toolbar-Button-Zoom-In

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-disabled
Button to zoom in gets disabled when the user reached the maximum zoom level.

.PSPDFKit-Toolbar-Button-Undo

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-disabled
Button to undo the last annotation operation, disabled when history is disabled or there are no undoable operations available.

.PSPDFKit-Toolbar-Button-Redo

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-disabled
Button to redo the last annotation operation, disabled when history is disabled or there are no redoable operations available.

.PSPDFKit-Toolbar-Button-Fit-To-Page

Is also: .PSPDFKit-Toolbar-Button
Button to fit the complete page into the viewport. Is only visible when "fit to width" is set.

.PSPDFKit-Toolbar-Button-Fit-To-Width

Is also: .PSPDFKit-Toolbar-Button
Button to fit the width of the page into the viewport. Is only visible when "fit to page" is set.

.PSPDFKit-Toolbar-Button-Text-Annotation

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate text annotation mode. It is active, when the user starts to create a new text annotation.

.PSPDFKit-Toolbar-Button-Ink-Annotation

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate ink annotation mode. It is active, when the user starts to create a new ink annotation.

.PSPDFKit-Toolbar-Button-Variant-Highlighter

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Ink-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate ink highlighter annotation mode. It is active, when the user starts to create a new ink highlighter annotation.

.PSPDFKit-Toolbar-Button-TextHighlighter-Annotation

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate text highlighter mode. It is active, when the user starts to highlight text.

.PSPDFKit-Toolbar-Button-Note-Annotation

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate note annotation mode. It is active, when the user starts to create a new note annotation.

.PSPDFKit-Toolbar-Button-InkSignature-Annotation

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to place ink signatures onto a page.

.PSPDFKit-Toolbar-Button-Image-Annotation

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to place image annotations onto a page.

.PSPDFKit-Toolbar-Button-Stamp-Annotation

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to show the Stamp Picker UI.

.PSPDFKit-Toolbar-Button-Line-Annotation

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Shape-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate line annotation mode. It is active, when the user starts to create a new line annotation.

.PSPDFKit-Toolbar-Button-Variant-Arrow

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Shape-Annotation .PSPDFKit-Toolbar-Button-Line-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate arrow annotation mode. It is active, when the user starts to create a new line annotation with arrow.

.PSPDFKit-Toolbar-Button-Rectangle-Annotation

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Shape-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate rectangle annotation mode. It is active, when the user starts to create a new rectangle annotation.

.PSPDFKit-Toolbar-Button-Ellipse-Annotation

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Shape-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate ellipse annotation mode. It is active, when the user starts to create a new ellipse annotation.

.PSPDFKit-Toolbar-Button-Polygon-Annotation

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Shape-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate polygon annotation mode. It is active, when the user starts to create a new polygon annotation.

.PSPDFKit-Toolbar-Button-Variant-CloudyPolygon

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Shape-Annotation .PSPDFKit-Toolbar-Button-Polygon-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate cloudy polygon annotation variant mode. It is active, when the user starts to create a new cloudy polygon annotation.

.PSPDFKit-Toolbar-Button-Polyline-Annotation

Is also: .PSPDFKit-Toolbar-Button .PSPDFKit-Toolbar-Button-Shape-Annotation
Can also be: .PSPDFKit-Toolbar-Button-active
Button to activate polyline annotation mode. It is active, when the user starts to create a new polyline annotation.

.PSPDFKit-Toolbar-Button-Print

Is also: .PSPDFKit-Toolbar-Button
Button to print the document.

.PSPDFKit-Toolbar-Button-Search

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to show the search component. It is active while the search is visible.

.PSPDFKit-Toolbar-Button-Annotate

Is also: .PSPDFKit-Toolbar-Button
Can also be: .PSPDFKit-Toolbar-Button-active
Button to show the annotation tools when on a small screen.

.PSPDFKit-Toolbar-Button-Layout-Config

Is also: .PSPDFKit-Toolbar-Button
Button to open the layout configuration menu.