I was just about to go to bed and then thought it would be a great idea to jump right into PHP and sort out the mobile-issue with the quote above. D'oh.

Alright, the blue quote at the top of this page seems to be a bit too long for mobile browsers and overflows out of its header bar. The solution? Don't show it on mobile browsers - sorted!

Did a quick search to see if I could just detect mobile within the User-Agent and sort it that way. Instead, I found some library that kept getting referenced and decided to just go ahead and make use of it: the Agent library, with Laravel support - hurrah.

This somewhat goes against my own lightweight way of doing things, but presumably it's not quite as easy as detecting a mobile sub-string as otherwise why would there be a dedicated library for it? In fact, don't answer that.

Integrated it and all that and then the site stopped working due to an exception. Deleted the vendors folder from the server - which took minutes - and then re-uploaded my local version as no doubt something was missing. A few minutes later - it all works. Phew. Oh; as a bonus, a load of libraries also got updated with a quick composer update, so that's nice.

A quick addition of

if (!Agent::isMobile()) {

along with a change to remove the appropriate <span> and such, and it was all done.

Does it work? No idea. Haven't actually tried it on a mobile device yet (although inversing the logic works so I'm hopeful it's all fiiine) as my phone is elsewhere in the house. But, there are no errors and so worst case is that it makes no difference.