Mobile breakpoints causing issues

[stottler]

Debug mode

• I have enabled debug mode
• I have read checked the Common Issues page

Describe the bug

The buttons in firefox, chrome, and safari when editing an asset are misaligned and unlabeled. Searching assets works fine.

Reproduction steps

1. iPad
2. Any browser
3. Edit asset
   ...

Expected behavior

Expect buttons to be aligned on my screen.

Screenshots

Snipe-IT Version

v7.0.10 - build 14684 (master)

Operating System

ios (any)

Web Server

apache

PHP Version

8.2.21

Operating System

n/a

Browser

n/a

Version

n/a

Device

ipad

Operating System

No response

Browser

firefox, chrome, safari

Version

latest on all

Error messages

It is reproducible on the demo.

[stacktrace]
#0 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connectors/Connector.php(65): PDO->__construct()
#1 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connectors/Connector.php(44): Illuminate\\Database\\Connectors\\Connector->createPdoConnection()
#2 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connectors/MySqlConnector.php(24): Illuminate\\Database\\Connectors\\Connector->createConnection()
#3 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connectors/ConnectionFactory.php(184): Illuminate\\Database\\Connectors\\MySqlConnector->connect()
#4 [internal function]: Illuminate\\Database\\Connectors\\ConnectionFactory->Illuminate\\Database\\Connectors\\{closure}()
#5 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connection.php(1339): call_user_func()
#6 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connection.php(608): Illuminate\\Database\\Connection->getPdo()
#7 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connection.php(816): Illuminate\\Database\\Connection->Illuminate\\Database\\{closure}()
#8 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connection.php(783): Illuminate\\Database\\Connection->runQueryCallback()
#9 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connection.php(600): Illuminate\\Database\\Connection->run()
#10 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Connection.php(564): Illuminate\\Database\\Connection->affectingStatement()
#11 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Database/Query/Builder.php(3754): Illuminate\\Database\\Connection->delete()
#12 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Auth/Passwords/DatabaseTokenRepository.php(204): Illuminate\\Database\\Query\\Builder->delete()
#13 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Auth/Console/ClearResetsCommand.php(32): Illuminate\\Auth\\Passwords\\DatabaseTokenRepository->deleteExpired()
#14 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Container/BoundMethod.php(36): Illuminate\\Auth\\Console\\ClearResetsCommand->handle()
#15 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Container/Util.php(41): Illuminate\\Container\\BoundMethod::Illuminate\\Container\\{closure}()
#16 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Container/BoundMethod.php(93): Illuminate\\Container\\Util::unwrapIfClosure()
#17 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Container/BoundMethod.php(35): Illuminate\\Container\\BoundMethod::callBoundMethod()
#18 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Container/Container.php(662): Illuminate\\Container\\BoundMethod::call()
#19 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Console/Command.php(211): Illuminate\\Container\\Container->call()
#20 /var/www/snipeit/vendor/symfony/console/Command/Command.php(326): Illuminate\\Console\\Command->execute()
#21 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Console/Command.php(180): Symfony\\Component\\Console\\Command\\Command->run()
#22 /var/www/snipeit/vendor/symfony/console/Application.php(1096): Illuminate\\Console\\Command->run()
#23 /var/www/snipeit/vendor/symfony/console/Application.php(324): Symfony\\Component\\Console\\Application->doRunCommand()
#24 /var/www/snipeit/vendor/symfony/console/Application.php(175): Symfony\\Component\\Console\\Application->doRun()
#25 /var/www/snipeit/vendor/laravel/framework/src/Illuminate/Foundation/Console/Kernel.php(201): Symfony\\Component\\Console\\Application->run()
#26 /var/www/snipeit/artisan(33): Illuminate\\Foundation\\Console\\Kernel->handle()
#27 {main}
"}

Additional context

This is part of the same instance that firefox was unable to query the api (see issues).

[snipe]

That looks like we just need to nudge the breakpoints a tiny bit. I noticed this myself earlier in the week as I was testing for something completely different. It would help if you could let us know the actual size of the screen/breakpoint and the devices you're using though, so we can better investigate this.

[stottler]

Tested two different sized ipads. It did work in landscape mode so you're probably right about nudging some stuff.
The ipad mini I used was 768x954 (a2133) and the other ipad was 820x1180 (a2316).

[snipe]

Thanks, that's super helpful!

[snipe]

@Godmartinz I'll take a look at this later, but it's very possible we didn't account for the sm-push and sm-pull that we do on assets and user views. That would likely have been my fault.

[snipe]

This should be fixed in #15352