WordPress.org

Make WordPress Core

Changeset 42992


Ignore:
Timestamp:
04/19/2018 12:38:44 PM (17 months ago)
Author:
azaozz
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.
See #43620.

Location:
trunk/src/wp-admin
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/css/edit.css

    r42980 r42992  
    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/*------------------------------------------------------------------------------
  • trunk/src/wp-admin/includes/misc.php

    r42985 r42992  
    15501550        $date_format = get_option( 'date_format' );
    15511551        $copy = __( 'Copy' );
     1552        $more = __( 'Read More' );
     1553        $less = __( 'Read Less' );
    15521554
    15531555        foreach ( $content_array as $section ) {
     
    15681570            }
    15691571
    1570             $content .= '<div class="privacy-text-section' . $class . '">';
    1571             $content .= '<h3>' . $section['plugin_name'] . '</h3>';
    1572             $content .= '<button type="button" class="privacy-text-copy-button button">';
    1573             $content .= $copy;
    1574             $content .= '<span class="screen-reader-text">' . sprintf( __( 'Copy suggested policy text from %s.' ), $section['plugin_name'] ) . '</span>';
    1575             $content .= '</button>';
     1572            $plugin_name = esc_html( $section['plugin_name'] );
     1573
     1574            $content .= '<div class="privacy-text-section folded' . $class . '">';
     1575            $content .= '<h3>' . $plugin_name . '</h3>';
    15761576
    15771577            if ( ! empty( $meta ) ) {
     
    15791579            }
    15801580
    1581             $content .= '<div class="policy-text">' . $section['policy_text'] . '</div>';
    1582             $content .= "</div>\n";
     1581            $content .= '<div class="policy-text" aria-expanded="false">' . $section['policy_text'] . '</div>';
     1582
     1583            $content .= '<div class="privacy-text-actions">';
     1584                $content .= '<button type="button" class="button-link policy-text-more">';
     1585                    $content .= $more;
     1586                    $content .= '<span class="screen-reader-text">' . sprintf( __( 'Expand suggested policy text section from %s.' ), $plugin_name ) . '</span>';
     1587                $content .= '</button>';
     1588
     1589                $content .= '<button type="button" class="button-link policy-text-less">';
     1590                    $content .= $less;
     1591                    $content .= '<span class="screen-reader-text">' . sprintf( __( 'Collapse suggested policy text section from %s.' ), $plugin_name ) . '</span>';
     1592                $content .= '</button>';
     1593
     1594                if ( empty( $section['removed'] ) ) {
     1595                    $content .= '<button type="button" class="privacy-text-copy button">';
     1596                        $content .= $copy;
     1597                        $content .= '<span class="screen-reader-text">' . sprintf( __( 'Copy suggested policy text from %s.' ), $plugin_name ) . '</span>';
     1598                    $content .= '</button>';
     1599                }
     1600
     1601            $content .= '</div>'; // End of .privacy-text-actions.
     1602            $content .= "</div>\n"; // End of .privacy-text-section.
    15831603        }
    15841604
     
    15901610            </button>
    15911611            <div class="privacy-text-box-head hndle">
    1592                 <h2><?php _e( 'This suggested privacy policy text comes from plugins you have installed.' ); ?></h2>
     1612                <h2><?php _e( 'This suggested privacy policy text comes from plugins and themes you have installed.' ); ?></h2>
    15931613                <p>
    15941614                    <?php _e( 'We suggest reviewing this text then copying and pasting it into your privacy policy page.' ); ?>
     
    16071627     * Return the default suggested privacy policy content.
    16081628     *
    1609      * @since 4.9.6     
     1629     * @since 4.9.6
    16101630     *
    16111631     * @return string The defauld policy content.
     
    16341654    public static function add_suggested_content() {
    16351655        $content = self::get_default_content();
    1636         wp_add_privacy_policy_content(  'WordPress', $content );
    1637     }
    1638 }
     1656        wp_add_privacy_policy_content( 'WordPress', $content );
     1657    }
     1658}
  • trunk/src/wp-admin/js/post.js

    r42980 r42992  
    12691269    } );
    12701270
     1271} )( jQuery, new wp.utils.WordCounter() );
     1272
     1273( function( $ ) {
    12711274    // Privacy policy postbox, copy button.
    12721275    $( document ).on( 'click', function( event ) {
     
    12741277        var node, range;
    12751278
    1276         if ( $target.is( 'button.privacy-text-copy-button' ) ) {
    1277             node = $target.parent().find( 'div.policy-text' )[0];
     1279        if ( $target.is( 'button.privacy-text-copy' ) ) {
     1280            node = $target.parent().parent().find( 'div.policy-text' )[0];
    12781281
    12791282            if ( node ) {
    12801283                try {
    12811284                    window.getSelection().removeAllRanges();
    1282                     range = document.createRange(); 
    1283                     range.selectNode( node ); 
     1285                    range = document.createRange();
     1286                    range.selectNodeContents( node );
    12841287                    window.getSelection().addRange( range );
    12851288
     
    12881291                } catch ( er ) {}
    12891292            }
     1293        } else if ( $target.is( 'button.policy-text-more' ) ) {
     1294            $target.parents( '.privacy-text-section' ).removeClass( 'folded' )
     1295                .find( '.policy-text' ).attr( 'aria-expanded', 'true' );
     1296        } else if ( $target.is( 'button.policy-text-less' ) ) {
     1297            $target.parents( '.privacy-text-section' ).addClass( 'folded' )
     1298                .find( '.policy-text' ).attr( 'aria-expanded', 'false' );
    12901299        }
    12911300    });
    12921301
    1293 } )( jQuery, new wp.utils.WordCounter() );
     1302} )( jQuery );
Note: See TracChangeset for help on using the changeset viewer.