Repository: syncthing/syncthing (language: go)

Issue:
WebUI table column widths broken on iPhone 12 Pro Max and wider
### What happened?

On more recent iPhones with larger screens, including:
- iPhone 12 Pro Max
- iPhone 13 Pro Max
- iPhone 14 Plus
- iPhone 14 Pro Max
- iPhone 15 Plus
- iPhone 15 Pro Max

the pixel width is greater than the 419px max-width threshold for triggering the narrow-screen configuration, so some WebUI elements display incorrectly, i.e. truncating long strings and wrapping rows of buttons without proper vertical spacing, as shown in this screenshot:

![IMG_7110](https://github.com/syncthing/syncthing/assets/18005537/d63699ca-681b-4f49-971e-542ab3d25c42)

The pixel widths for these devices is 428 or 430 pixels.

This is seen on Firefox on iOS (connecting a Synology version of Syncthing), but should be browser-independent.

I will provide a PR.


### Syncthing version

v1.27.8

### Platform & operating system

Linux (64-bit Intel/AMD)

### Browser version

iOS Firefox v127.0

### Relevant log output

_No response_


Discussion / hints:

Fix patch:
diff --git a/gui/default/assets/css/overrides.css b/gui/default/assets/css/overrides.css
index 85f3d2c9d0a..e74cafcd47f 100644
--- a/gui/default/assets/css/overrides.css
+++ b/gui/default/assets/css/overrides.css
@@ -448,7 +448,6 @@ ul.three-columns li, ul.two-columns li {
 }
 
 @media (max-width:479px) {
-
     nav .dropdown-toggle {
         font-size: 1em;
     }
@@ -456,13 +455,7 @@ ul.three-columns li, ul.two-columns li {
     .navbar-nav .open .dropdown-menu > li > a {
         padding: 12px 15px 12px 25px;
     }
-}
-
-.tab-content {
-    padding-top: 10px;
-}
 
-@media (max-width: 419px) {
     /* The selectors are build to target only the content of folder and device
        panels as it would "destroy" e.g. out of sync or recent changes listings.
        The !important is needed to override .visible-xs that sets display to a
@@ -513,6 +506,10 @@ ul.three-columns li, ul.two-columns li {
     }
 }
 
+.tab-content {
+    padding-top: 10px;
+}
+
 .form-horizontal .form-group {
     margin-bottom: 5px;
 }


Test patch: