When using the Field Groups Tabs/Tab configuration in a display there is some functionality to change the visible elements to make it more small screen friendly that trigger only on page load or refresh below 640px. The problem is if you load the page on a screen less than 640px, then expand the screen dimensions by stretching a browser, flipping a device, etc. it does not detect that change in screen size and thus does not convert to the more friendly design for larger screens. This works the other way, if you shrink a browser window below 640px it does not convert to the more friendly mobile layout.
Sample Desktop
Sample Desktop Shrunk to Mobile
Sample Mobile
Sample Mobile Expanded to Desktop
I propose some sort of listener be added to change the mobile/desktop when the screen size passes the defined threshold of 640px to make the designed adjustment.
Write a patch, test it, commit it.
I think the UI is fine. I don't care for the design of the box with vertical padding and/or margin, but 0 padding, that contains the tabs in mobile, but that is easily fixed in a sub-theme. Maybe another issue for that.
None.
Not suggesting any at this time.
Closed: duplicate
3.4
User interface
I have attached a patch. I have ran ES Lint as per https://www.drupal.org/docs/develop/standards/javascript/eslint-settings → to the best of my knowledge of what you want.
Here is a video showing my work. https://vimeo.com/832022880/90a02d1d56
This was fixed by 📌 GitlabCI: Fix ESLINT validation errors Fixed .