Buggy Query Log interaction on tablet viewports

[agneevX]

Prerequisites

• [X] I have checked the Wiki and Discussions and found no answer
• [X] I have searched other issues and found no duplicates
• [X] I want to report a bug and not ask a question

Operating system type

Linux, OpenWrt

CPU architecture

64-bit ARM

Installation

Docker

Setup

On one machine

AdGuard Home version

0.107.9

Description

Bug description

On v0.107.9, attempting to look up information of logs in Query Log on tablet viewports is quite buggy to say the least.

(From #4775)

Specifically, it exhibits the following issues:

1. Unable to click/tap on the question glyphs to view pop-up boxes
2. Instead, a modal meant for mobile viewports pops up, which spans across the screen

agneevX: This modal pops up when I tap just about anywhere in Query Log.

ainar-g: I cannot reproduce that. For me, it only opens when I click on a query log record.

I meant to say that clicking on areas other than the question glyphs brings up the modal. This includes any part of a log row.

4. There is no visible way to dismiss the modal
5. The boxes do show up

If I simulate a tablet device on desktop, click anywhere, close the modal by pressing Esc and immediately hover over a question glyph, it shows the box.

This modal is also different from the modal that is displayed on mobile devices, as it does not have bold text. This can be demonstrated by shrinking the viewport.

Screenshots

Additional information