PDF Viewer search bar is partially hidden on small screens

[dimodi]

Describe the bug

The PDF Viewer search bar is not fully visible on small screens, especially if the PDF zoom is less than 100%.

Reported in ticket 1647069

Workaround:

    @media screen and (max-width:530px) {
        .k-pdf-viewer .k-search-panel {
            left: 0;
            transform: none;
            width: auto;
            flex-wrap: wrap;
            justify-content: space-around; /* or center */
        }
    }

To reproduce

1. Open https://www.telerik.com/kendo-react-ui/components/pdfviewer/ or https://demos.telerik.com/blazor-ui/pdfviewer/overview
2. Set the PDF zoom to 50%.
3. Open the search popup.
4. Reduce the browser viewport width.
5. The search popup will be partially hidden on the left.

Expected behavior

The search bar should be fully visible and the items inside should wrap is necessary.

Screenshots

Affected package (please remove the unneeded items)

• theme-default
• theme-bootstrap
• theme-material

Affected suites (please remove the unneeded items)

• Kendo UI for Angular
• Kendo UI for React
• Kendo UI for Vue
• Telerik UI for Blazor

Affected browsers (please remove the unneeded items)

• All