Making WordPress.org

Changeset 11069


Ignore:
Timestamp:
06/26/2021 03:30:52 PM (3 years ago)
Author:
ocean90
Message:

Translate: Fix layout of editor for glossary entries and increase font sizes used in meta column of the translation editor.

Location:
sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates
Files:
2 edited

Legend:

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

    r11053 r11069  
    99.gp-content input {
    1010    color: #1e1e1e;
     11}
     12
     13.gp-content textarea {
     14    max-width: 100%;
     15}
     16
     17.gp-content textarea,
     18.gp-content select,
     19.gp-content input {
     20    font-size: 1em;
    1121}
    1222
     
    316326}
    317327
    318 p.actionlist {
     328p.actionlist,
     329div.actionlist,
     330h2 + .glossary-description,
     331h2 + .project-description {
    319332    margin-top: 1em;
    320333    margin-bottom: 1em;
    321334}
    322 
    323335
    324336@media screen and (max-width: 960px) {
     
    402414}
    403415
     416table.glossary a.action,
    404417table.translations a.action {
    405418    color: #1e1e1e;
     
    407420}
    408421
     422table.glossary a.action:hover,
    409423table.translations a.action:hover {
    410424    color: #000;
     
    460474}
    461475
    462 table.translations td:first-child,
    463 table.translations th:first-child,
    464 table.translation-sets td:first-child,
    465 table.translation-sets th:first-child,
    466 table.locales td:first-child,
    467 table.locales th:first-child,
    468 table.glossary th:first-child,
    469 table.glossary td:first-child,
    470 table.locale-sub-projects th:first-child,
    471 table.locale-sub-projects td:first-child {
    472     border-left: 1px solid #72777c;
     476table.locales tr,
     477table.glossary tr,
     478table.locale-sub-projects tr,
     479table.translation-sets tr,
     480table.translations tr {
     481    box-shadow: -1px 0px 0px #72777c;
    473482}
    474483
    475484table.translations tr:nth-child(4n+3),
     485table.glossary tr:nth-child(4n+3),
    476486table.locale-sub-projects tr:nth-child(even),
    477487.translation-sets tr,
     
    480490}
    481491
     492.glossary tr.view:hover,
    482493.translations tr.preview:hover,
    483494.translation-sets tr:nth-child(odd):hover,
     
    547558}
    548559
    549 .editor .original {
    550     margin-bottom: 1em;
    551 }
    552 
    553 .editor .textareas textarea {
     560/* Glossary editor */
     561table.glossary .editor .strings {
    554562    width: 100%;
    555     box-sizing: border-box;
    556 }
    557 
    558 .editor .strings {
    559     width: 60%;
    560     float: left;
    561 }
    562 
    563 .editor .meta {
    564     background: #fff;
    565     border: 1px solid #72777c;
    566     font-size: 13px;
    567     margin: 0;
    568     padding: 5px 10px;
    569     width: 39%;
    570     float: right;
    571     box-sizing: border-box;
    572 }
    573 
    574 .editor .meta h3 {
    575     text-align: center;
    576     border-bottom: 1px solid #72777c;
    577     margin-bottom: 15px;
    578 }
    579 
    580 button.approve strong {
    581     color: #46b450;
    582 }
    583 
    584 button.reject strong {
    585     color: #dc3232;
    586 }
    587 
    588 button.fuzzy strong {
    589     color: #f56e28;
    590 }
    591 
    592 .editor .refs li {
    593     font-size: 12px;
    594     word-wrap: break-word;
    595 }
    596 
    597 .editor .meta dl {
    598     margin: .4em 0;
    599 }
    600 
    601 .editor .clear + .plural-numbers {
    602     margin-top: 15px;
    603 }
    604 
    605 .editor .strings .textareas:last-child,
    606 .editor .plural-numbers + .textareas {
    607     margin-bottom: 30px;
    608 }
    609 
    610 .editor .textareas + .clear {
    611     margin-top: 30px;
    612 }
    613 
    614 .editor .actions {
    615     margin-top: 30px;
    616 }
    617 
    618 .editor .actions .ok {
     563    float: none;
     564}
     565
     566table.glossary .editor .strings dt {
     567    margin-bottom: 2px;
     568}
     569
     570table.glossary .editor .strings dd {
     571    margin-bottom: 10px;
     572}
     573
     574table.glossary .editor .strings p {
     575    display: flex;
     576    align-items: center;
     577    font-size: 14px;
     578    margin-top: 20px;
     579}
     580
     581table.glossary .editor .strings p button {
    619582    font-size: 14px;
    620583    height: 26px;
    621     vertical-align: middle;
    622 }
    623 
    624 .strings dt {
    625     margin-bottom: 2px;
    626 }
    627 
    628 .strings dd {
    629     margin-bottom: 10px;
    630 }
    631 
    632 .strings textarea {
     584}
     585
     586table.glossary .editor .strings p button + .or-cancel {
     587    font-size: 14px;
     588    margin-left: .4em;
     589}
     590
     591table.glossary .editor .meta {
     592    width: 100%;
     593    float: none;
     594    margin: 30px 0 0;
     595    font-size: 14px;
     596}
     597
     598@media screen and (min-width: 700px) {
     599    table.glossary .editor .strings {
     600        width: 60%;
     601        float: left;
     602    }
     603
     604    table.glossary .editor .meta {
     605        width: calc( 40% - 20px );
     606        float: right;
     607        margin: 0;
     608    }
     609}
     610
     611table.glossary .editor .meta dl {
     612    margin: 5px 0 0;
     613}
     614
     615table.glossary .editor .meta dl:first-child {
     616    margin-top: 0;
     617}
     618
     619table.glossary .editor textarea {
     620    width: 100%;
     621    resize: vertical;
    633622    box-sizing: border-box;
    634     max-width: 100%;
    635     resize: vertical;
    636     vertical-align: middle;
    637 }
    638 
    639 .strings textarea:-ms-input-placeholder {
    640     color: #666;
    641 }
    642 
    643 .strings textarea::-ms-input-placeholder {
    644     color: #666;
    645 }
    646 
    647 .strings textarea::placeholder {
    648     color: #666;
    649623}
    650624
     
    660634    white-space: pre-wrap;
    661635}
    662 
    663636
    664637.glossary-word {
     
    913886
    914887.locale {
    915     border: 1px solid #ccc;
     888    border: 1px solid #72777c;
    916889    box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
    917890    background: #fff;
     
    23662339/* NEW EDITOR */
    23672340
    2368 .editor .strings {
     2341.editor-panel .strings {
    23692342    float: none;
    23702343    width: 100%;
     
    23722345}
    23732346
    2374 .editor .textareas textarea {
     2347.editor-panel .textareas textarea {
    23752348    width: 100%;
    23762349    border: 0;
     
    23842357}
    23852358
    2386 .textareas p,
    2387 .textareas blockquote.translation {
     2359.editor-panel .textareas p,
     2360.editor-panel .textareas blockquote.translation {
    23882361    display: none;
    23892362}
    23902363
    2391 .editor .original {
     2364.editor-panel .original {
    23922365    max-width: 100%;
    23932366    font-weight: normal;
     
    23962369}
    23972370
    2398 .editor .original-raw {
     2371.editor-panel .original-raw {
    23992372    display: none;
    24002373}
    24012374
    2402 .editor .meta {
     2375.editor-panel .meta {
    24032376    float: none;
    24042377    width: 100%;
    2405     background: transparent;
    2406     border: 0;
     2378    margin: 0;
     2379    padding: 20px 10px;
     2380}
     2381
     2382.editor-panel .meta .status-actions {
     2383    margin-bottom: 15px;
     2384}
     2385
     2386.editor-panel .meta .status-actions button {
     2387    font-size: 14px;
     2388    height: 26px;
     2389}
     2390
     2391button.approve strong {
     2392    color: #46b450;
     2393}
     2394
     2395button.reject strong {
     2396    color: #dc3232;
     2397}
     2398
     2399button.fuzzy strong {
     2400    color: #f56e28;
     2401}
     2402
     2403.editor-panel .meta dl {
     2404    font-size: 14px;
     2405    margin: 5px 0 0;
     2406}
     2407
     2408.editor-panel .meta dl:first-child {
     2409    margin-top: 0;
    24072410}
    24082411
     
    24402443    flex: 0 0 20rem;
    24412444    min-width: 1%;
     2445}
     2446
     2447@media screen and (min-width: 700px) {
     2448    .editor-panel__right {
     2449        position: -webkit-sticky;
     2450        position: sticky;
     2451        top: 0;
     2452        z-index: 10;
     2453    }
    24422454}
    24432455
     
    24642476}
    24652477
    2466 .admin-bar .editor-panel__left .panel-header {
     2478.admin-bar .editor-panel__left .panel-header,
     2479.admin-bar .editor-panel__right {
    24672480    top: 32px;
    24682481}
    24692482
    24702483@media screen and (max-width: 782px) {
    2471     .admin-bar .editor-panel__left .panel-header {
     2484    .admin-bar .editor-panel__left .panel-header,
     2485    .admin-bar .editor-panel__right {
    24722486        top: 46px;
    24732487    }
     
    26412655.translation-wrapper {
    26422656    padding: 0 10px;
    2643     margin: 15px 0;
    2644     border-top: 1px solid;
    2645     border-bottom: 1px solid;
     2657    margin: 15px -1px;
     2658    border: 1px solid;
    26462659    border-color: #72777c;
    26472660    background: #fff;
     
    26492662
    26502663.translation-wrapper:focus-within {
    2651     box-shadow:  0 0 2px 1px #33b3db;
     2664    box-shadow: 0 0 2px 1px #33b3db;
     2665    border-color: #5b9dd9;
    26522666}
    26532667
  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/translation-row-editor.php

    r11055 r11069  
    239239                    <div class="meta">
    240240
    241                         <?php if ( $translation->translation_status ): ?>
     241                        <?php if ( $translation->translation_status && ( $can_approve_translation || $can_reject_self ) ): ?>
    242242                            <div class="status-actions">
    243                             <?php if ( $can_approve_translation ) : ?>
    244                                 <?php if ( 'current' !== $translation->translation_status ) : ?>
    245                                     <button class="approve" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-current_' . $translation->id ) ); ?>"><strong>+</strong> <?php _e( 'Approve', 'glotpress' ); ?></button>
    246                                 <?php endif; ?>
    247                                 <?php if ( 'rejected' !== $translation->translation_status ) : ?>
    248                                     <button class="reject" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-rejected_' . $translation->id ) ); ?>"><strong>&minus;</strong> <?php _e( 'Reject', 'glotpress' ); ?></button>
    249                                 <?php endif; ?>
    250                                 <?php if ( 'fuzzy' !== $translation->translation_status ) : ?>
     243                                <?php if ( $can_approve_translation ) : ?>
     244                                    <?php if ( 'current' !== $translation->translation_status ) : ?>
     245                                        <button class="approve" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-current_' . $translation->id ) ); ?>"><strong>+</strong> <?php _e( 'Approve', 'glotpress' ); ?></button>
     246                                    <?php endif; ?>
     247                                    <?php if ( 'rejected' !== $translation->translation_status ) : ?>
     248                                        <button class="reject" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-rejected_' . $translation->id ) ); ?>"><strong>&minus;</strong> <?php _e( 'Reject', 'glotpress' ); ?></button>
     249                                    <?php endif; ?>
     250                                    <?php if ( 'fuzzy' !== $translation->translation_status ) : ?>
     251                                        <button class="fuzzy" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-fuzzy_' . $translation->id ) ); ?>"><strong>~</strong> <?php _e( 'Fuzzy', 'glotpress' ); ?></button>
     252                                    <?php endif; ?>
     253                                <?php elseif ( $can_reject_self ): ?>
     254                                    <button class="reject" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-rejected_' . $translation->id ) ); ?>"><strong>&minus;</strong> <?php _e( 'Reject Suggestion', 'glotpress' ); ?></button>
    251255                                    <button class="fuzzy" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-fuzzy_' . $translation->id ) ); ?>"><strong>~</strong> <?php _e( 'Fuzzy', 'glotpress' ); ?></button>
    252256                                <?php endif; ?>
    253                             <?php elseif ( $can_reject_self ): ?>
    254                                 <button class="reject" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-rejected_' . $translation->id ) ); ?>"><strong>&minus;</strong> <?php _e( 'Reject Suggestion', 'glotpress' ); ?></button>
    255                                 <button class="fuzzy" tabindex="-1" data-nonce="<?php echo esc_attr( wp_create_nonce( 'update-translation-status-fuzzy_' . $translation->id ) ); ?>"><strong>~</strong> <?php _e( 'Fuzzy', 'glotpress' ); ?></button>
    256                             <?php endif; ?>
    257257                            </div>
    258258                        <?php endif; ?>
Note: See TracChangeset for help on using the changeset viewer.