WordPress.org

Making WordPress.org

Changeset 4430


Ignore:
Timestamp:
11/27/2016 10:57:20 PM (5 years ago)
Author:
ocean90
Message:

WP i18n teams: Update styles for overview and team pages to play nice with o2.

Fixes #2154.

Location:
sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams/css/i18n-teams.css

    r4132 r4430  
    44
    55.i18n-label.latest {
    6     color: #468847;
     6    color: #46b450;
    77}
    88.i18n-label.minor-behind {
    9     color: #F7D708;
     9    color: #ffb900;
    1010}
    1111.i18n-label.major-behind-one {
    12     color: #E6A45A;
     12    color: #f56e28;
    1313}
    1414.i18n-label.major-behind-many {
    15     color: #e38587;
     15    color: #dc3232;
     16}
     17
     18.i18n-filter {
     19    line-height: 2;
     20    padding: 0 .25em;
    1621}
    1722
    1823.i18n-filter.current-filter {
    1924    color: #555;
    20     border-bottom: 1px solid #555;
    21 }
    22 
    23 .translators-info thead th {
     25}
     26
     27.translators-info table thead th {
    2428    vertical-align: top;
    2529}
    2630
    27 .translators-info thead small {
    28     font-size: 9px;
     31.translators-info table thead small {
    2932    font-weight: normal;
    3033}
    3134
    32 .translators-info tbody tr {
     35.translators-info table tbody tr {
    3336    display: none;
    3437}
    3538
    36 .show-all tbody tr,
    37 .translators-info.show-latest tbody tr.latest,
    38 .translators-info.show-minor-behind tbody tr.minor-behind,
    39 .translators-info.show-major-behind-one tbody tr.major-behind-one,
    40 .translators-info.show-major-behind-many tbody tr.major-behind-many,
    41 .translators-info.show-no-releases tbody tr.no-releases,
    42 .translators-info.show-no-site tbody tr.no-site,
    43 .translators-info.show-no-wp-project tbody tr.no-wp-project,
    44 .translators-info.show-has-language-pack tbody tr.has-language-pack,
    45 .translators-info.show-no-language-pack tbody tr.no-language-pack,
    46 .translators-info.show-translated-100 tbody tr.translated-100,
    47 .translators-info.show-translated-95 tbody tr.translated-95,
    48 .translators-info.show-translated-90 tbody tr.translated-90,
    49 .translators-info.show-translated-50-less tbody tr.translated-50-less,
    50 .translators-info.show-translated-50 tbody tr.translated-50 {
     39.show-all table tbody tr,
     40.translators-info.show-latest table tbody tr.latest,
     41.translators-info.show-minor-behind table tbody tr.minor-behind,
     42.translators-info.show-major-behind-one table tbody tr.major-behind-one,
     43.translators-info.show-major-behind-many table tbody tr.major-behind-many,
     44.translators-info.show-no-releases table tbody tr.no-releases,
     45.translators-info.show-no-site table tbody tr.no-site,
     46.translators-info.show-no-wp-project table tbody tr.no-wp-project,
     47.translators-info.show-has-language-pack table tbody tr.has-language-pack,
     48.translators-info.show-no-language-pack table tbody tr.no-language-pack,
     49.translators-info.show-translated-100 table tbody tr.translated-100,
     50.translators-info.show-translated-95 table tbody tr.translated-95,
     51.translators-info.show-translated-90 table tbody tr.translated-90,
     52.translators-info.show-translated-50-less table tbody tr.translated-50-less,
     53.translators-info.show-translated-50 table tbody tr.translated-50 {
    5154    display: table-row;
    5255}
    5356
    5457.locale-version.latest {
    55     background: #d2e7ca;
     58    background: #c7e8ca;
    5659}
    5760.locale-version.minor-behind {
    58     background: #fef0c1;
     61    background: #ffe399;
    5962}
    6063.locale-version.major-behind-one {
    61     background: #E6A45A;
     64    background: #fbc5a9;
    6265}
    6366.locale-version.major-behind-many {
    64     background: #e38587;
    65 }
     67    background: #f1adad;
     68}
     69
    6670td.right {
    6771    text-align: right;
    6872}
     73
     74td.center {
     75    text-align: center;
     76}
     77
    6978td.no-left-border {
    7079    border-left: 0 !important;
    7180}
     81
    7282td.no-right-border {
    7383    border-right: 0 !important;
    7484}
    75 .translators-info th,
    76 .translators-info td.nowrap {
     85
     86.translators-info table th,
     87.translators-info table td.nowrap {
    7788    white-space: nowrap;
    7889}
     
    113124    font-size: 1.1em;
    114125    color: white;
     126    text-decoration: none;
    115127}
    116128#locale-details,
     
    142154}
    143155
     156.validators li .profile {
     157    margin: 6px 0 2px;
     158    font-size: 16px;
     159    font-weight: 400;
     160    line-height: 2em;
     161    text-decoration: none;
     162}
     163
     164.validators li .avatar {
     165    float: left;
     166    margin: 0 10px 10px 0;
     167    padding: 1px;
     168    width: 60px;
     169    height: 60px;
     170}
     171
     172.validators .user-slack {
     173    display: block;
     174}
     175
    144176.validators.project-validators li {
    145177    width: 25%;
     
    147179}
    148180
     181.validators.project-validators li .profile {
     182    font-size: 13px;
     183    line-height: 1.5em;
     184}
     185
     186.validators.project-validators li .avatar {
     187    float: left;
     188    width: 40px;
     189    height: 40px;
     190}
     191
     192.validators.project-validators li .user-slack {
     193    font-size: 10px;
     194}
     195
    149196@media only screen and (max-width: 850px) {
    150197    .validators li {
     
    157204}
    158205
    159 @media only screen and (max-width: 470px) {
     206@media only screen and (max-width: 600px) {
    160207    .validators li {
    161208        width: 100%;
     
    166213}
    167214
    168 .validators.project-validators img.avatar {
    169     margin-right: 5px !important;
    170 }
    171 .validators a {
    172     text-decoration: none;
    173 }
    174 .validators .user-name {
    175     font-size: 16px;
    176     position: relative;
    177     top: .2em;
    178 }
    179 .validators.project-validators .user-name {
    180     font-size: 13px;
    181 }
    182 
    183 .validators .user-slack {
    184     display: block;
    185     margin-top: .2em;
    186 }
    187 
    188 .translators-info table {
     215@media only screen and (max-width: 400px) {
     216    .validators.project-validators li {
     217        width: 100%;
     218    }
     219}
     220
     221article.page .translators-info table {
    189222    width: 100%;
    190     margin: .7em 0 1.5em;
    191     border: 1px solid #ccc;
     223    border: 1px solid #f1f1f1;
    192224    border-width: 1px 1px 1px 0;
    193     border-spacing: 0;
    194 }
    195 .translators-info th {
    196     background: #ccc;
    197     border: 1px solid #ccc;
     225}
     226
     227article.page .translators-info table tr th {
     228    background: #f7f7f7;
     229    border: 1px solid #f1f1f1;
     230    border-width: 0 0 0 1px;
     231}
     232
     233article.page .translators-info table tr td {
     234    border: 1px solid #f1f1f1;
    198235    border-width: 1px 0 0 1px;
    199     padding: 6px 15px;
    200 }
    201 .translators-info td {
    202     border: 1px solid #ccc;
    203     border-width: 1px 0 0 1px;
    204     padding: 6px 15px;
     236}
     237
     238article.page .translators-info table tr th:first-child,
     239article.page .translators-info table tr td:first-child {
     240    padding-left: 1em;
     241}
     242
     243article.page .translators-info table tr th:last-child,
     244article.page .translators-info table tr td:last-child {
     245    padding-right: 1em;
    205246}
    206247
    207248@media (max-width: 768px) {
    208     .i18n-filter {
    209         line-height: 2;
    210         padding: 0 3px;
    211     }
    212 
    213     .show-all tbody tr,
    214     .translators-info.show-latest tbody tr.latest,
    215     .translators-info.show-minor-behind tbody tr.minor-behind,
    216     .translators-info.show-major-behind-one tbody tr.major-behind-one,
    217     .translators-info.show-major-behind-many tbody tr.major-behind-many,
    218     .translators-info.show-no-releases tbody tr.no-releases,
    219     .translators-info.show-no-site tbody tr.no-site,
    220     .translators-info.show-no-wp-project tbody tr.no-wp-project,
    221     .translators-info.show-has-language-pack tbody tr.has-language-pack,
    222     .translators-info.show-no-language-pack tbody tr.no-language-pack,
    223     .translators-info.show-translated-100 tbody tr.translated-100,
    224     .translators-info.show-translated-95 tbody tr.translated-95,
    225     .translators-info.show-translated-90 tbody tr.translated-90,
    226     .translators-info.show-translated-50-less tbody tr.translated-50-less,
    227     .translators-info.show-translated-50 tbody tr.translated-50 {
     249    .show-all table tbody tr,
     250    .translators-info.show-latest table tbody tr.latest,
     251    .translators-info.show-minor-behind table tbody tr.minor-behind,
     252    .translators-info.show-major-behind-one table tbody tr.major-behind-one,
     253    .translators-info.show-major-behind-many table tbody tr.major-behind-many,
     254    .translators-info.show-no-releases table tbody tr.no-releases,
     255    .translators-info.show-no-site table tbody tr.no-site,
     256    .translators-info.show-no-wp-project table tbody tr.no-wp-project,
     257    .translators-info.show-has-language-pack table tbody tr.has-language-pack,
     258    .translators-info.show-no-language-pack table tbody tr.no-language-pack,
     259    .translators-info.show-translated-100 table tbody tr.translated-100,
     260    .translators-info.show-translated-95 table tbody tr.translated-95,
     261    .translators-info.show-translated-90 table tbody tr.translated-90,
     262    .translators-info.show-translated-50-less table tbody tr.translated-50-less,
     263    .translators-info.show-translated-50 table tbody tr.translated-50 {
    228264        display: block;
    229265    }
     
    242278
    243279    .translators-info table tr {
    244         border: 1px solid #ccc !important;
    245     }
    246 
    247     .translators-info table tbody th,
    248     .translators-info table tbody td {
     280        border: 1px solid #f1f1f1 !important;
     281    }
     282
     283    article.page .translators-info table tbody th,
     284    article.page .translators-info table tbody td {
    249285        display: block;
    250286        text-align: left;
    251287    }
    252288
    253     .translators-info table tbody tr {
    254         margin-top: 20px;
    255     }
    256 
    257     .translators-info table tbody td {
    258         padding: 6px 10px;
     289    article.page .translators-info table tbody tr {
     290        margin-top: 2em;
     291    }
     292
     293    article.page .translators-info table tbody td {
    259294        position: relative;
    260         padding-left: 40%;
    261     }
    262 
    263     .translators-info table tbody td[data-column-title]:before {
     295        padding: .5em .5em .5em 40%;
     296        vertical-align: top;
     297    }
     298
     299    article.page .translators-info table tbody td[data-column-title]:before {
    264300        content: attr(data-column-title);
    265301        position: absolute;
     
    269305    }
    270306
    271     .translators-info table tbody td:nth-of-type(1) {
     307    article.page .translators-info table tbody td:nth-of-type(1) {
    272308        display: inline-block;
    273309        padding-left: 40%;
     
    277313    }
    278314
    279     .translators-info table tbody td:nth-of-type(2) {
     315    article.page .translators-info table tbody td:nth-of-type(2) {
    280316        display: inline-block;
    281317        padding-left: 0;
     
    284320    }
    285321
    286     .translators-info table tbody td:nth-of-type(3) {
    287         border-top: 1px solid #ccc !important;
    288     }
    289 
    290     .translators-info table tbody td:nth-of-type(4) {
     322    article.page .translators-info table tbody td:nth-of-type(3) {
     323        border-top: 1px solid #f1f1f1 !important;
     324    }
     325
     326    article.page .translators-info table tbody td:nth-of-type(4) {
    291327        display: inline-block;
    292328        padding-left: 40%;
     
    296332    }
    297333
    298     .translators-info table tbody td:nth-of-type(5) {
     334    article.page .translators-info table tbody td:nth-of-type(5) {
    299335        display: inline-block;
    300336        padding-left: 0;
     
    303339    }
    304340
    305     .translators-info table tbody td:nth-of-type(6) {
     341    article.page .translators-info table tbody td:nth-of-type(6) {
    306342        display: inline-block;
    307343        padding-left: 40%;
    308344        width: 30%;
    309         border-top: 1px solid #ccc !important;
    310         border-bottom: none !important;
    311     }
    312 
    313     .translators-info table tbody td:nth-of-type(7) {
     345        border-top: 1px solid #f1f1f1 !important;
     346        border-bottom: none !important;
     347    }
     348
     349    article.page .translators-info table tbody td:nth-of-type(7) {
    314350        display: inline-block;
    315351        padding-left: 0;
    316352        width: 23%;
    317         border-top: 1px solid #ccc !important;
    318         border-bottom: none !important;
    319     }
    320 
    321     .translators-info table tbody td:nth-of-type(8) {
    322         border-top: 1px solid #ccc !important;
     353        border-top: 1px solid #f1f1f1 !important;
     354        border-bottom: none !important;
     355    }
     356
     357    article.page .translators-info table tbody td:nth-of-type(8) {
     358        border-top: 1px solid #f1f1f1 !important;
    323359        border-bottom: none !important;
    324360        padding-right: 0;
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams/js/i18n-teams.js

    r2478 r4430  
    33
    44    $( function() {
    5         $( '.locale-filters' ).on( 'click', '.i18n-filter', function() {
     5        $( document.body ).on( 'click', '.i18n-filter', function( event ) {
     6            event.preventDefault();
    67            $( '.current-filter' ).removeClass( 'current-filter' );
    78            $( '.translators-info' )[0].className = 'translators-info show-' + $( this ).data( 'filter' );
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams/views/all-locales.php

    r4132 r4430  
    8888                    <td data-column-title="<?php esc_attr_e( 'WP Locale', 'wporg' ); ?>"><?php echo esc_html( $locale->wp_locale ); ?></td>
    8989
    90                     <td data-column-title="<?php esc_attr_e( 'Version', 'wporg' ); ?>" class="right no-right-border">
     90                    <td data-column-title="<?php esc_attr_e( 'Version', 'wporg' ); ?>" class="center no-right-border">
    9191                        <?php
    9292                            if ( $locale_data[ $locale->wp_locale ]['rosetta_site_url'] ) {
     
    101101                        ?>
    102102                    </td>
    103                     <td class="no-left-border nowrap">
     103                    <td class="center no-left-border nowrap">
    104104                        <?php
    105105                        if ( isset( $language_packs_data[ $locale->wp_locale ] ) ) {
     
    113113                    </td>
    114114
    115                     <td data-column-title="<?php esc_attr_e( 'GlotPress', 'wporg' ); ?>" class="right no-right-border">
     115                    <td data-column-title="<?php esc_attr_e( 'GlotPress', 'wporg' ); ?>" class="center no-right-border">
    116116                        <?php if ( isset( $percentages[ $locale->wp_locale ] ) ) : ?>
    117117                            <a href="https://translate.wordpress.org/locale/<?php echo $locale->slug; ?>/default/wp/dev">
     
    122122                        <?php endif; ?>
    123123                    </td>
    124                     <td class="no-left-border nowrap">
     124                    <td class="center no-left-border nowrap">
    125125                        <a href="https://translate.wordpress.org/locale/<?php echo $locale->slug; ?>">
    126126                            <?php echo $locale->slug; ?>
     
    130130                    <td>
    131131                        <a href="<?php echo esc_url( add_query_arg( 'locale', $locale->wp_locale ) ); ?>">
    132                             <?php _e( 'Team', 'wporg' ); ?>
     132                            <?php _e( 'View Team Page', 'wporg' ); ?>
    133133                        </a>
    134134                    </td>
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams/views/locale-details.php

    r2200 r4430  
    1919        </li>
    2020        <li>
     21            <strong><?php _e( 'Team site:', 'wporg' ); ?></strong>
     22            <?php if ( $locale_data['team_url'] ) : ?>
     23                <a href="<?php echo esc_url( $locale_data['team_url'] ); ?>"><?php
     24                    $url = parse_url( $locale_data['team_url'] );
     25                    printf( '%s%s', $url['host'], $url['path'] );
     26                ?></a>
     27            <?php else : ?>
     28                &mdash;
     29            <?php endif; ?>
     30        </li>
     31        <li>
     32            <strong><?php _e( 'Forums:', 'wporg' ); ?></strong>
     33            <?php if ( $locale_data['forums_url'] ) : ?>
     34                <a href="<?php echo esc_url( $locale_data['forums_url'] ); ?>"><?php
     35                    $url = parse_url( $locale_data['forums_url'] );
     36                    printf( '%s%s', $url['host'], $url['path'] );
     37                ?></a>
     38            <?php else : ?>
     39                &mdash;
     40            <?php endif; ?>
     41        </li>
     42        <li>
    2143            <strong><?php _e( 'Latest release:', 'wporg' ); ?></strong>
    2244            <?php echo $locale_data['latest_release'] ? $locale_data['latest_release'] : '&mdash;'; ?>
     
    2951            <strong><?php _e( 'GlotPress Locale Code:', 'wporg' ); ?></strong>
    3052            <?php echo esc_html( $locale->slug ); ?>
     53        </li>
     54        <li>
     55            <strong><?php _e( 'Translation Projects:', 'wporg' ); ?></strong>
     56            <a href="https://translate.wordpress.org/locale/<?php echo $locale->slug; ?>">translate.wordpress.org/locale/<?php echo $locale->slug; ?></a>
    3157        </li>
    3258    </ul>
     
    5581
    5682
    57 <h2><?php _e( 'General Translation Editors', 'wporg' ); ?></h2>
     83<h2><?php printf( __( 'General Translation Editors (%s)', 'wporg' ), number_format_i18n( count( $locale_data['validators'] ) ) ); ?></h2>
    5884
    5985<?php if ( empty( $locale_data['validators'] ) ) : ?>
     
    6490            ?>
    6591            <li>
    66                 <a class="user-avatar" href="https://profiles.wordpress.org/<?php echo esc_attr( $validator['nice_name'] ); ?>"><?php
    67                     echo get_avatar( $validator['email'], 50 );
    68                 ?></a>
    69                 <a class="user-name" href="https://profiles.wordpress.org/<?php echo esc_attr( $validator['nice_name'] ); ?>"><?php
     92                <a class="profile" href="https://profiles.wordpress.org/<?php echo esc_attr( $validator['nice_name'] ); ?>"><?php
     93                    echo get_avatar( $validator['email'], 60 );
    7094                    echo esc_html( $validator['display_name'] );
    7195                ?></a>
     
    82106
    83107<?php if ( ! empty( $locale_data['project_validators'] ) ) : ?>
    84     <h2><?php _e( 'Project Translation Editors', 'wporg' ); ?></h2>
     108    <h2><?php printf( __( 'Project Translation Editors (%s)', 'wporg' ), number_format_i18n( count( $locale_data['project_validators'] ) ) ); ?></h2>
    85109
    86110    <ul class="validators project-validators">
     
    88112            ?>
    89113            <li>
    90                 <a class="user-avatar" href="https://profiles.wordpress.org/<?php echo esc_attr( $validator['nice_name'] ); ?>"><?php
    91                     echo get_avatar( $validator['email'], 25 );
    92                 ?></a>
    93                 <a class="user-name" href="https://profiles.wordpress.org/<?php echo esc_attr( $validator['nice_name'] ); ?>"><?php
     114                <a class="profile" href="https://profiles.wordpress.org/<?php echo esc_attr( $validator['nice_name'] ); ?>"><?php
     115                    echo get_avatar( $validator['email'], 40 );
    94116                    echo esc_html( $validator['display_name'] );
    95117                ?></a>
     118                <?php
     119                if ( $validator['slack'] ) {
     120                    printf( '<span class="user-slack">@%s on <a href="%s">Slack</a></span>', $validator['slack'], 'https://make.wordpress.org/chat/' );
     121                }
     122                ?>
    96123            </li>
    97124        <?php endforeach; ?>
     
    99126<?php endif; ?>
    100127
    101 
    102 <h2><?php _e( 'Translation Contributors', 'wporg' ); ?></h2>
     128<h2><?php printf( __( 'All Translation Contributors (%s)', 'wporg' ), number_format_i18n( count( $locale_data['translators'] ) ) ); ?></h2>
    103129
    104130<?php if ( empty( $locale_data['translators'] ) ) : ?>
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wp-i18n-teams/wp-i18n-teams.php

    r4429 r4430  
    190190            $statuses[ $language_pack_status ]++;
    191191
     192            $forums_url = $team_url = '';
     193            if ( $subdomain ) {
     194                $result = get_sites( array(
     195                    'domain'   => $subdomain . '.wordpress.org',
     196                    'path__in' => array( '/support/', '/forums/' ),
     197                    'number'   => 1,
     198                ) );
     199                $site = array_shift( $result );
     200                if ( $site ) {
     201                    $forums_url = get_home_url( $site->id, '/' );
     202                }
     203
     204                $result = get_sites( array(
     205                    'domain'   => $subdomain . '.wordpress.org',
     206                    'path__in' => array( '/team/' ),
     207                    'number'   => 1,
     208                ) );
     209                $site = array_shift( $result );
     210                if ( $site ) {
     211                    $team_url = get_home_url( $site->id, '/' );
     212                }
     213            }
     214
    192215            $locale_data[ $locale->wp_locale ] = array(
    193216                'release_status'       => $release_status,
     
    195218                'language_pack_status' => $language_pack_status,
    196219                'rosetta_site_url'     => $subdomain ? 'https://' . $subdomain . '.wordpress.org' : false,
     220                'forums_url'           => $forums_url ? $forums_url : false,
     221                'team_url'             => $team_url ? $team_url : false,
    197222                'latest_release'       => $latest_release ? $latest_release : false,
    198223            );
     
    388413                    'email'        => $user->user_email,
    389414                    'nice_name'    => $user->user_nicename,
     415                    'slack'        => self::get_slack_username( $user->ID ),
    390416                );
    391417            } else {
     
    394420                    'email'        => $user->user_email,
    395421                    'nice_name'    => $user->user_nicename,
     422                    'slack'        => self::get_slack_username( $user->ID ),
    396423                );
    397424            }
Note: See TracChangeset for help on using the changeset viewer.