Changeset 11051

Timestamp:

06/21/2021 08:02:08 PM (4 years ago)

Author:

ocean90

Message:

Translate: Simplify translations table.

The priority column is most of the time empty and as such a waste of space which is better used to enhance the display of originals and translations. The priority column is now hidden and if an original is marked as high or low priority it is displayed right next to the original similiar to the existing context bubble.
The context is now also hidden if it doesn't provide any new information to translators. This is the mostly case when the context is the same or a cut-off version of the original.

Fixes #5778.

Location:

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates

Files:

• helper-functions.php (modified) (1 diff)
• style.css (modified) (17 diffs)
• translation-row-preview.php (modified) (1 diff)

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/helper-functions.php

@@ -314 +314 @@
     <?php
 }
+
+/**
+ * Whether to show the context or not.
+ *
+ * Prevents displaying the context if it doesn't provide any new information
+ * to the translator.
+ * Especially for mobile projects the context is mostly a duplicate of the singular string.
+ *
+ * @param \Translation_Entry $translation Current translation entry.
+ * @return bool Whether to show the context or not.
+ */
+function wporg_gp_should_display_original_context( $translation ) {
+    // No context available.
+    if ( ! $translation->context ) {
+        return false;
+    }
+
+    // Context is the same as the singular.
+    if ( $translation->singular === $translation->context ) {
+        return false;
+    }
+
+    // Context was cut-off due to VARCHAR(255) in the database schema.
+    if ( 255 === mb_strlen( $translation->context ) && 0 === strpos( $translation->singular, $translation->context ) ) {
+        return false;
+    }
+
+    return true;
+}

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/style.css

@@ -346 +346 @@
 }
 
-span.context {
-    font-size: 90%;
+span.context,
+span.priority {
+    color: #1e1e1e;
+    font-size: 12px;
     padding: .1em 0;
     margin-left: .2em;
@@ -354 +356 @@
     box-decoration-break: clone;
     box-shadow: .3em 0 0 #a0a5aa, -.3em 0 0 #a0a5aa;
+    border-radius: 0;
+}
+
+span.context + span.priority {
+    margin-left: 1em;
+}
+
+.priority-high span.priority {
+    color: #fff;
+    background-color: rgba( 154, 35, 35, 0.65 );
+    box-shadow: 0.3em 0 0 rgba( 154, 35, 35, 0.65 ), -0.3em 0 0 rgba( 154, 35, 35, 0.65 );
+}
+
+.priority-low span.priority {
+    background-color: rgba( 213, 213, 213, 0.65 );
+    box-shadow: 0.3em 0 0 rgba( 213, 213, 213, 0.65 ), -0.3em 0 0 rgba( 213, 213, 213, 0.65 );
 }
 
@@ -384 +402 @@
 }
 
-table.translations td.original ul:not(:last-child),
-table.translations td.translation ul:not(:last-child) {
-    margin-bottom: .2em;
+.original-tags {
+    margin-top: .2em;
 }
 
@@ -448 +465 @@
 
 table.translations tr:nth-child(4n+3),
+table.locale-sub-projects tr:nth-child(even),
 .translation-sets tr,
 .locales tr {
@@ -1011 +1029 @@
     float: right;
     width: 250px;
-    border: 1px solid #ccc;
+    border: 1px solid #72777c;
     box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
     background: #fff;
@@ -1025 +1043 @@
     margin: 0 0 2.083% 2.083%;
     width: 47.917%;
-    border: 1px solid #ccc;
+    border: 1px solid #72777c;
     box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
     background: #fff;
@@ -1053 +1071 @@
 .projects .project-name h4 {
     border: 0;
-    margin: 0 0 12px;
+    margin: 0 0 8px;
     font-size: 18px;
     font-weight: 600;
@@ -1061 +1079 @@
 .projects .project-description {
     font-size: 13px;
+    border-left: 0;
+    margin-top: 0;
+    padding: 0;
 }
 
@@ -1170 +1191 @@
     margin-left: 0;
     max-width: 100%;
+    padding: 0;
+    border: 0;
 }
 
@@ -1176 +1199 @@
     width: 350px;
     margin-left: 20px;
-    border: 1px solid #ccc;
+    border: 1px solid #72777c;
     box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
     background: #fff;
@@ -1266 +1289 @@
 
 ul.projects-dropdown {
-    border-top: 1px solid #ccc;
+    border-top: 1px solid #72777c;
 }
 
@@ -1298 +1321 @@
     width: 100%;
     background: #f9f9f9;
-    border: 1px solid #ccc;
+    border: 1px solid #72777c;
     border-top: 0;
     box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.04);
@@ -1642 +1665 @@
     float: right;
     margin: -30px 0 5px 5px;
-    background-color: #72777c;
+    background-color: #e2e4e7;
     padding: 5px;
     border: 1px solid #dfdfdf;
@@ -1887 +1910 @@
 .locale-project-contributors-group hr {
     margin: 30px 0;
+    border-color: #72777c;
 }
 
@@ -2311 +2335 @@
 }
 
-table.translations th.priority {
-    width: 2em;
-    text-align: center;
+table.translations th.priority,
+table.translations td.priority {
+    display: none;
 }
 
@@ -2588 +2612 @@
 }
 
-.source-details details + details{
+.source-details details + details {
     margin-top: 5px;
 }
@@ -2595 +2619 @@
     word-wrap: break-word;
     overflow-wrap: break-word;
+}
+
+.source-details__context .context {
+    font-size: 100%;
+    background: transparent;
+    box-shadow: none;
+    margin: 0;
+    padding: 0;
 }
 

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/translation-row-preview.php

@@ -41 +41 @@
             <?php
         endif;
+        ?>
 
-        if ( $translation->context ) :
+        <div class="original-tags">
+            <?php
+            if ( wporg_gp_should_display_original_context( $translation ) ) :
+                ?>
+                <span class="context bubble"><?php echo esc_html( $translation->context ); ?></span>
+                <?php
+            endif;
+
+            if ( '1' === $translation->priority || '-1' === $translation->priority ) :
+                ?>
+                <span class="priority bubble"><?php echo esc_html( sprintf( 'Priority: %s', gp_array_get( GP::$original->get_static( 'priorities' ), $translation->priority ) ) ); ?></span>
+                <?php
+            endif;
             ?>
-            <span class="context bubble"><?php echo esc_html( $translation->context ); ?></span>
-            <?php
-        endif;
-        ?>
+        </div>
     </td>
     <td class="translation foreign-text">