My IOT temperature monitoring device has a "dashboard" with numerous critical features which I am reluctant to give Admin access in case anyone selects the remote "Reset Device" feature!
This screenshot shows the hidden features in the left-hand menu which work as expected on all responsive platforms.
Recently a live "Share" option was introduced which I can confidently supply the link unfortunately...
Responsive Layout Problem
Desktop rendering is the problem because the empty left-hand menu container pushes both the graph and summation to the far right-hand side of the screen. Mobile works fine because a responsive "Hamburger" menu hides the left-hand menu.
It appears the relevant CSS file is shared by both "Admin Dashboard" and "Shared Screen" which may cause problems if the CSS file is modified.
The template is used by two backend colleagues designers with restricted CSS knowledge, same as myself
Hopefully there a simple solution?
While trying to describe the problem I noticed a new "device-view.php" page is used to display the shared information.
I download the shared page and added the following style to the header and was surprised it did not solve the problem?
/* nicked from: first-layout.css: line 428 */
@media (min-width: 1200px)
/* DOES NOT CLEAR PROBLEM */
padding-left: 5px; /*OVERRIDE - REDUCED PADDING */
background-color: red; /* SHOW MODIFICATIONS */
-webkit-transition: padding-left .3s;
-moz-transition: padding-left .3s;
-o-transition: padding-left .3s;
transition: padding-left .3s;