snipe-it
snipe-it copied to clipboard
snipe
V6 - Tabs not clickable on mobile
Debug mode
- [X] I have enabled debug mode
- [X] I have read checked the Common Issues page
Describe the bug
If you view the Details of an Asset,
On Mobile (Iphone X) the Tabs on the Top are not clickable. Or better they are clickable but not non click on the Icon, only if you click the very top of the icon.
Ist there any Way to fix this...old Threds in this case are autoclosed :(
Reproduction steps
1.Login 2.Go To Assets 3.View Details of an Asset 4.Try to click the Buttons above
Expected behavior
It should be possible to click cleanly through the tabs on any mobile device.
Screenshots
These Tabs are the problem
Just In This Area the buttons are clickable, only at the very Top of the Icon
If the Icons are in the 2nd line they are not clickable, also when you select a button in the second line and want go back to a tab in the first line the first line is also not clickable
The Error Info which appers has no exit button and is overlaying all the buttons
Snipe-IT Version
Tested in 5.4.1 and also in V6 RC7
Operating System
Debian 10
Web Server
Apache
PHP Version
7.3 and 7.4
Operating System
No response
Browser
No response
Version
No response
Device
No response
Operating System
No response
Browser
No response
Version
No response
Error messages
No response
Additional context
No response
👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.
![welcome[bot] avatar](https://avatars.githubusercontent.com/in/4141?v=4 "Published by a pub.dev verified publisher"){kind=small}
We will likely not be fixing this for v5, since v6 is on the way and the UI code is very different.
I tested the Wohle thing in RC7 the problem still persists...this will only be fixed in a later RC?
i attached some more screenshots to describe the problem a little better, if you have any questions let me know
Just confirming the bug.
Snipe-IT versionv6.0.7 build 8351 (gacc2e12f1)
It works with a responsive window, but not on a mobile device or in the browser when emulating a mobile device. I suspect javascript touch sensing.
The issue occurs below the 400px breakpoint.
The interface appears to be throwing the element with the tab-content class over the nav-tabs. Nav-tabs can be seen, but they cannot be clicked. Did a quick-and-dirty remove of the tab-content element in inspector and the nav-tabs can then be selected.
Above the 400px breakpoint the tabs it works fine.
for earlier versions than 6, you can write custom CSS to the settings. This worked for us.
@media (max-width: 400px) { .navbar-left { margin: 2px; }
.nav::after {
clear: right !important;
}
}
Can confirm this is happening to me as well when trying to click on the "Maintainences" tab (samsung S10E/android, with firefox as the browser)
some remote debugging seems to suggest that the tab-content div seems to be overflowing and sitting on top of the navigation, causing this behavior:
