Changeset 7826

Timestamp:

11/05/2018 09:10:03 PM (5 years ago)

Author:

coffee2code

Message:

WP i18n teams: Improve layout of the teams table on narrow screens.

Fit related data into same rows without taking up vertical space when introducing CSS-content added headers. Effectively brings layout back to what was originally intoduced in #1481.

The uses of !important are to override instances of !important set in the Breathe theme.

See #3903.

File:

• sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams/css/i18n-teams.css (modified) (8 diffs)

sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams/css/i18n-teams.css

@@ -304 +304 @@
     article.page .translators-info table tbody td[data-column-title]:before {
         content: attr(data-column-title);
-        position: initial;
-        display: flex;
+        position: absolute;
         left: 10px;
-        width: 50%;
+        width: 33%;
         font-weight: bold;
     }
@@ -313 +312 @@
     article.page .translators-info table tbody td:nth-of-type(1) {
         display: inline-block;
-        padding-left: 40%;
+        padding-left: 33% !important;
         padding-right: 5px;
-        width: 30%;
+        width: 66%;
         border-bottom: none !important;
     }
@@ -322 +321 @@
         display: inline-block;
         padding-left: 0;
-        width: 23%;
+        width: 33%;
         border-bottom: none !important;
     }
@@ -328 +327 @@
     article.page .translators-info table tbody td:nth-of-type(3) {
         border-top: 1px solid #f1f1f1 !important;
+        padding-left: 33% !important;
     }
 
     article.page .translators-info table tbody td:nth-of-type(4) {
         display: inline-block;
-        padding-left: 40%;
+        padding-left: 33% !important;
         padding-right: 5px;
-        width: 30%;
+        width: 66%;
         border-bottom: none !important;
     }
@@ -341 +341 @@
         display: inline-block;
         padding-left: 0;
-        width: 23%;
+        width: 33%;
         border-bottom: none !important;
     }
@@ -347 +347 @@
     article.page .translators-info table tbody td:nth-of-type(6) {
         display: inline-block;
-        padding-left: 40%;
-        width: 30%;
+        padding-left: 33% !important;
+        width: 66%;
         border-top: 1px solid #f1f1f1 !important;
         border-bottom: none !important;
@@ -356 +356 @@
         display: inline-block;
         padding-left: 0;
-        width: 23%;
+        width: 33%;
         border-top: 1px solid #f1f1f1 !important;
         border-bottom: none !important;
@@ -365 +365 @@
         border-bottom: none !important;
         padding-right: 0;
-    }
-}
+        padding-left: 33% !important;
+    }
+}