Customizing Pdf-viewer

Variables

The following table lists the available variables for customization.

NameTypeDefault valueComputed value
$kendo-pdf-viewer-border-width1px
Description
The border width of the PDFViewer.
$kendo-pdf-viewer-font-familyvar( --kendo-font-family, inherit )
Description
The font family of the PDFViewer.
$kendo-pdf-viewer-font-sizevar( --kendo-font-size, inherit )
Description
The font size of the PDFViewer.
$kendo-pdf-viewer-line-heightvar( --kendo-line-height, normal )
Description
The line height of the PDFViewer.
$kendo-pdf-viewer-bgvar( --kendo-component-bg, initial )
Description
The background color of the PDFViewer.
$kendo-pdf-viewer-textvar( --kendo-component-text, initial )
Description
The text color of the PDFViewer.
$kendo-pdf-viewer-bordervar( --kendo-component-border, initial )
Description
The border color of the PDFViewer.
$kendo-pdf-viewer-canvas-bgif($kendo-enable-color-system, k-color( surface ), k-get-theme-color-var( neutral-10 ))
Description
The background color of the PDFViewer canvas.
$kendo-pdf-viewer-canvas-textvar( --kendo-component-text, inherit )
Description
Text color of the PDF viewer canvas.
$kendo-pdf-viewer-canvas-bordervar( --kendo-component-border, inherit )
Description
The border color of the PDFViewer canvas.
$kendo-pdf-viewer-page-spacingmap.get( $kendo-spacing, 7.5 )
Description
The spacing of the PDFViewer page.
$kendo-pdf-viewer-page-bgvar( --kendo-component-bg, inherit )
Description
The background color of the PDFViewer page.
$kendo-pdf-viewer-page-textvar( --kendo-component-text, inherit )!default
Description
The text color of the PDFViewer page.
$kendo-pdf-viewer-page-bordervar( --kendo-component-border, inherit )
Description
The border color of the PDFViewer page.
$kendo-pdf-viewer-page-shadowvar( --kendo-box-shadow-depth-3, none )
Description
The shadow of the PDFViewer page.
$kendo-pdf-viewer-search-panel-padding-xmap.get( $kendo-spacing, 3 )
Description
The horizontal padding of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-padding-y$kendo-pdf-viewer-search-panel-padding-x
Description
The vertical padding of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-spacingmap.get( $kendo-spacing, 2 )
Description
The spacing of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-border-width1px
Description
The border width of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-border-radiusvar( --kendo-border-radius-md, #{$kendo-border-radius-md} )
Description
The border radius of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-bgvar( --kendo-component-bg, inherit )
Description
The background color of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-textvar( --kendo-component-text, inherit )
Description
The text color of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-bordervar( --kendo-component-border, inherit )!default
Description
The border color of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-shadownone
Description
The shadow of the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-matches-spacingvar( --kendo-icon-spacing, .5rem )
Description
The spacing of the matches container in the PDFViewer search panel.
$kendo-pdf-viewer-search-panel-margin-ycalc( ( #{$kendo-button-calc-size} + ( 2 * #{$kendo-pdf-viewer-search-panel-border-width} ) + ( 2 * #{$kendo-pdf-viewer-search-panel-padding-y} ) ) * -1 )
Description
The vertical margin of the PDFViewer search panel.
$kendo-pdf-viewer-selection-line-heightvar( --kendo-line-height-sm, normal )
Description
The line height of the PDFViewer selection.
$kendo-pdf-viewer-search-highlight-bgvar( --kendo-component-text, inherit )
Description
The background color of the PDFViewer highlight.
$kendo-pdf-viewer-search-highlight-mark-bgyellow
Description
The background color of the PDFViewer highlight mark.
$kendo-pdf-viewer-icon-text$kendo-dropzone-icon-text
Description
The text color of the PDFViewer icon.

In this article

Not finding the help you need?