Issue Regarding Shapes Popup

Hello @Logan, @zzhang
Hope you are doing well.

General Behaviour of Tools Popup is like this:

But when I use this URL in IFrame with lesser width the popup style
changes to:

So is it possible to achieve popup style of first image even when
we use in IFrame with minimised width like below:

Below is the Requirement:
“The “shapes” icon needs to be two dropdowns even in minimised window. The first will be choosing the shape. Once the user chooses the shape, the second dropdown appears where you choose color and thickness. Please see exhibit 4 below”.

Please help me with your suggestions.

Regards
Abhishek Maurya

Hi Abhishek,

Thanks for reaching out.

Unfortunately there’s no API in the UI that allows you to change the mobile screen settings. However, I believe what you want is still achievable by modifying the UI source code at https://github.com/PDFTron/webviewer-ui.

To be more specific, you would want to delete the tablet-and-mobile CSS style in this file.

Besides that, depending on your requirement you might also want to modify initialState.js. Search for the hidden property in this file and then remove tablet and mobile if you still want them to show in the header in a smaller screen device.

This guide talks about how to get started on customizing the UI and integrate the customized UI back to your application.

Hope it helps!

Best Regards,
Zhijie