WordPress.org
Get WordPress

Make WordPress Core

Changeset 43113


Ignore:
Timestamp:
05/02/2018 03:53:15 AM (8 years ago)
Author:
SergeyBiryukov
Message:

Privacy: make the sections in the suggested privacy policy text postbox foldable. Add Read More/Read Less buttons. Fix copying of the suggested text by pressing the button.

Props melchoyce, xkon, azaozz.
Merges [42992] to the 4.9 branch.
See #43620.

Location:
branches/4.9
Files:
4 edited

Legend:

Unmodified
Added
Removed

  • branches/4.9

  • branches/4.9/src/wp-admin/css/edit.css

    r43101 r43113  
    650650.privacy-text-box {
    651651        margin: 10px 0 0;
    652        
    653652}
    654653
    … …  
    657656        border-bottom: 1px solid #e5e5e5;
    658657        box-shadow: 0 1px 1px rgba(0,0,0,0.04);
    659        
    660658}
    661659
    … …  
    672670        height: 320px;
    673671        overflow: auto;
    674        
    675672}
    676673
    … …  
    681678.privacy-text-box h3 {
    682679        font-size: 1em;
    683         margin: 1em 0;
    684 }
    685 
    686 .privacy-text-section .privacy-text-copy-button {
     680        margin: 1em 0 0.5em;
     681}
     682
     683.privacy-text-section .privacy-text-copy {
    687684        float: right;
    688         margin-top: -1.8em;
    689685}
    690686
    691687.privacy-text-section {
     688        position: relative;
    692689        padding: 1px 14px 1px 12px;
    693690        border-top: 1px solid #e3e3e3;
    … …  
    705702}
    706703
     704.privacy-text-meta {
     705        font-size: 11px;
     706        color: #555D66;
     707        font-weight: 600;
     708}
     709
    707710.closed .privacy-text-box-body {
    708711        display: none;
    709712}
     713
     714.privacy-text-section.folded {
     715        height: 150px;
     716        overflow: hidden;
     717}
     718
     719.privacy-text-actions {
     720        line-height: 32px;
     721        padding-bottom: 6px;
     722}
     723
     724.folded .privacy-text-actions {
     725        position: absolute;
     726        bottom: 0;
     727        background-color: white;
     728        width: calc(100% - 24px);
     729        box-shadow: 0px -5px 10px 5px rgba(255, 255, 255, .8);
     730}
     731
     732.text-removed .privacy-text-actions {
     733        background-color: #fbeaea;
     734        box-shadow: 0px -5px 10px 5px rgba(251, 234, 234, .8);
     735}
     736
     737.text-updated .privacy-text-actions {
     738        background-color: #ecf7ed;
     739        box-shadow: 0px -5px 10px 5px rgba(236, 247, 237, .8);
     740}
     741
     742.policy-text-more,
     743.folded .privacy-text-copy,
     744.folded .policy-text-less {
     745        display: none;
     746}
     747
     748.folded .policy-text-more {
     749        display: inline;
     750}
     751
    710752
    711753/*------------------------------------------------------------------------------

  • branches/4.9/src/wp-admin/includes/misc.php

    r43112 r43113  
    15011501                $date_format = get_option( 'date_format' );
    15021502                $copy = __( 'Copy' );
     1503                $more = __( 'Read More' );
     1504                $less = __( 'Read Less' );
    15031505
    15041506                foreach ( $content_array as $section ) {
    … …  
    15191521                        }
    15201522
    1521                         $content .= '<div class="privacy-text-section' . $class . '">';
    1522                         $content .= '<h3>' . $section['plugin_name'] . '</h3>';
    1523                         $content .= '<button type="button" class="privacy-text-copy-button button">';
    1524                         $content .= $copy;
    1525                         $content .= '<span class="screen-reader-text">' . sprintf( __( 'Copy suggested policy text from %s.' ), $section['plugin_name'] ) . '</span>';
    1526                         $content .= '</button>';
     1523                        $plugin_name = esc_html( $section['plugin_name'] );
     1524
     1525                        $content .= '<div class="privacy-text-section folded' . $class . '">';
     1526                        $content .= '<h3>' . $plugin_name . '</h3>';
    15271527
    15281528                        if ( ! empty( $meta ) ) {
    … …  
    15301530                        }
    15311531
    1532                         $content .= '<div class="policy-text">' . $section['policy_text'] . '</div>';
    1533                         $content .= "</div>\n";
     1532                        $content .= '<div class="policy-text" aria-expanded="false">' . $section['policy_text'] . '</div>';
     1533
     1534                        $content .= '<div class="privacy-text-actions">';
     1535                                $content .= '<button type="button" class="button-link policy-text-more">';
     1536                                        $content .= $more;
     1537                                        $content .= '<span class="screen-reader-text">' . sprintf( __( 'Expand suggested policy text section from %s.' ), $plugin_name ) . '</span>';
     1538                                $content .= '</button>';
     1539
     1540                                $content .= '<button type="button" class="button-link policy-text-less">';
     1541                                        $content .= $less;
     1542                                        $content .= '<span class="screen-reader-text">' . sprintf( __( 'Collapse suggested policy text section from %s.' ), $plugin_name ) . '</span>';
     1543                                $content .= '</button>';
     1544
     1545                                if ( empty( $section['removed'] ) ) {
     1546                                        $content .= '<button type="button" class="privacy-text-copy button">';
     1547                                                $content .= $copy;
     1548                                                $content .= '<span class="screen-reader-text">' . sprintf( __( 'Copy suggested policy text from %s.' ), $plugin_name ) . '</span>';
     1549                                        $content .= '</button>';
     1550                                }
     1551
     1552                        $content .= '</div>'; // End of .privacy-text-actions.
     1553                        $content .= "</div>\n"; // End of .privacy-text-section.
    15341554                }
    15351555
    … …  
    15411561                        </button>
    15421562                        <div class="privacy-text-box-head hndle">
    1543                                 <h2><?php _e( 'This suggested privacy policy text comes from plugins you have installed.' ); ?></h2>
     1563                                <h2><?php _e( 'This suggested privacy policy text comes from plugins and themes you have installed.' ); ?></h2>
    15441564                                <p>
    15451565                                        <?php _e( 'We suggest reviewing this text then copying and pasting it into your privacy policy page.' ); ?>
    … …  
    15581578         * Return the default suggested privacy policy content.
    15591579         *
    1560          * @since 4.9.6         
     1580         * @since 4.9.6
    15611581         *
    15621582         * @return string The defauld policy content.
    … …  
    15851605        public static function add_suggested_content() {
    15861606                $content = self::get_default_content();
    1587                 wp_add_privacy_policy_content(  'WordPress', $content );
    1588         }
    1589 }
     1607                wp_add_privacy_policy_content( 'WordPress', $content );
     1608        }
     1609}

  • branches/4.9/src/wp-admin/js/post.js

    r43101 r43113  
    12661266        } );
    12671267
     1268} )( jQuery, new wp.utils.WordCounter() );
     1269
     1270( function( $ ) {
    12681271        // Privacy policy postbox, copy button.
    12691272        $( document ).on( 'click', function( event ) {
    … …  
    12711274                var node, range;
    12721275
    1273                 if ( $target.is( 'button.privacy-text-copy-button' ) ) {
    1274                         node = $target.parent().find( 'div.policy-text' )[0];
     1276                if ( $target.is( 'button.privacy-text-copy' ) ) {
     1277                        node = $target.parent().parent().find( 'div.policy-text' )[0];
    12751278
    12761279                        if ( node ) {
    12771280                                try {
    12781281                                        window.getSelection().removeAllRanges();
    1279                                         range = document.createRange(); 
    1280                                         range.selectNode( node ); 
     1282                                        range = document.createRange();
     1283                                        range.selectNodeContents( node );
    12811284                                        window.getSelection().addRange( range );
    12821285
    … …  
    12851288                                } catch ( er ) {}
    12861289                        }
     1290                } else if ( $target.is( 'button.policy-text-more' ) ) {
     1291                        $target.parents( '.privacy-text-section' ).removeClass( 'folded' )
     1292                                .find( '.policy-text' ).attr( 'aria-expanded', 'true' );
     1293                } else if ( $target.is( 'button.policy-text-less' ) ) {
     1294                        $target.parents( '.privacy-text-section' ).addClass( 'folded' )
     1295                                .find( '.policy-text' ).attr( 'aria-expanded', 'false' );
    12871296                }
    12881297        });
    12891298
    1290 } )( jQuery, new wp.utils.WordCounter() );
     1299} )( jQuery );
Note: See TracChangeset for help on using the changeset viewer.