WordPress.org

Make WordPress Core

Ticket #27440: 27440-return-and-display-banners.6.diff

File 27440-return-and-display-banners.6.diff, 6.8 KB (added by stephdau, 3 years ago)

Moves the static styles from their experimental location inline to wp-admin/css/common.css. Also introduces a smaller screens mode for banner display: https://cloudup.com/cKMBUfgXefg

  • wp-admin/includes/plugin-install.php

     
    311311function install_plugin_information() { 
    312312        global $tab; 
    313313 
    314         $api = plugins_api( 'plugin_information', array( 'slug' => wp_unslash( $_REQUEST['plugin'] ), 'is_ssl' => is_ssl() ) ); 
     314        $api = plugins_api( 'plugin_information', array( 'slug' => wp_unslash( $_REQUEST['plugin'] ), 'is_ssl' => is_ssl(), 'fields' => array( 'banners' => true ) ) ); 
    315315 
    316316        if ( is_wp_error( $api ) ) 
    317317                wp_die( $api ); 
     
    354354 
    355355        iframe_header( __('Plugin Install') ); 
    356356 
    357         echo "<div id='{$_tab}-title'>{$api->name}</div>"; 
    358         echo "<div id='{$_tab}-tabs'>\n"; 
     357        $_with_banner = ''; 
    359358 
     359        if ( !empty( $api->banners ) && ( !empty( $api->banners['low'] ) || !empty( $api->banners['high'] ) ) ) { 
     360                $_with_banner = 'with-banner'; 
     361                $low  = ( !empty( $api->banners['low'] ) ) ? $api->banners['low'] : $api->banners['high']; 
     362                $high = ( !empty( $api->banners['high'] ) ) ? $api->banners['high'] : $api->banners['low']; 
     363                ?> 
     364                <style type="text/css"> 
     365                        #plugin-information-title.with-banner { 
     366                                background-image: url(<?php echo $low ?>); 
     367                        } 
     368                        @media only screen and (-webkit-min-device-pixel-ratio: 1.5) { 
     369                                #plugin-information-title.with-banner { 
     370                                        background-image: url(<?php echo $high ?>}); 
     371                                } 
     372                        } 
     373                </style> 
     374                <?php 
     375        } 
     376 
     377        echo "<div id='{$_tab}-title' class='{$_with_banner}'><div class='vignette'></div><h2>{$api->name}</h2></div>"; 
     378        echo "<div id='{$_tab}-tabs' class='{$_with_banner}'>\n"; 
     379 
    360380        foreach ( (array)$api->sections as $section_name => $content ) { 
    361381 
    362382                if ( isset( $plugins_section_titles[ $section_name ] ) ) 
     
    374394        echo "</div>\n"; 
    375395 
    376396        ?> 
    377         <div id="<?php echo $_tab; ?>-content"> 
     397        <div id="<?php echo $_tab; ?>-content" class='<?php echo $_with_banner; ?>'> 
    378398        <div class="fyi"> 
    379399                <ul> 
    380400<?php if ( ! empty( $api->version ) ) : ?> 
     
    394414                        <li><a target="_blank" href="https://wordpress.org/plugins/<?php echo $api->slug ?>/"><?php _e('WordPress.org Plugin Page &#187;') ?></a></li> 
    395415<?php endif; if ( ! empty( $api->homepage ) ) : ?> 
    396416                        <li><a target="_blank" href="<?php echo $api->homepage ?>"><?php _e('Plugin Homepage &#187;') ?></a></li> 
     417<?php endif;if ( ! empty( $api->donate_link ) && empty( $api->contributors ) ) : ?> 
     418                        <li><a target="_blank" href="<?php echo $api->donate_link ?>"><?php _e('Donate to this plugin &#187;') ?></a></li> 
    397419<?php endif; ?> 
    398420                </ul> 
    399421                <?php if ( ! empty( $api->rating ) ) : ?> 
     
    401423                <?php wp_star_rating( array( 'rating' => $api->rating, 'type' => 'percent', 'number' => $api->num_ratings ) ); ?> 
    402424                <small><?php printf( _n('(based on %s rating)', '(based on %s ratings)', $api->num_ratings), number_format_i18n($api->num_ratings) ); ?></small> 
    403425                <?php endif; ?> 
     426                <?php if ( ! empty( $api->contributors ) ) : ?> 
     427                        <h3><?php _e('Contributors') ?></h3> 
     428                        <ul class="contributors"> 
     429                                <?php 
     430                                foreach ( (array) $api->contributors as $contrib_username => $contrib_profile ) { 
     431                                        if ( empty( $contrib_username ) && empty( $contrib_profile ) ) 
     432                                                continue; 
     433                                        if ( empty( $contrib_username ) ) 
     434                                                $contrib_username = preg_replace( '/^.+\/(.+)\/?$/', '\1', $contrib_profile ); 
     435                                        $contrib_username = sanitize_user( $contrib_username ); 
     436                                        if ( empty( $contrib_profile ) ) 
     437                                                echo "<li><img src='https://wordpress.org/grav-redirect.php?user={$contrib_username}&s=36' width='18' height='18' /> {$contrib_username}</li>"; 
     438                                        else 
     439                                                echo "<li><a href='{$contrib_profile}' target='_blank'><img src='https://wordpress.org/grav-redirect.php?user={$contrib_username}&s=36' width='18' height='18' /> {$contrib_username}</a></li>"; 
     440                                } 
     441                                ?> 
     442                        </ul> 
     443                        <?php if ( ! empty( $api->donate_link ) ) : ?> 
     444                                <a target="_blank" href="<?php echo $api->donate_link ?>"><?php _e('Donate to this plugin &#187;') ?></a> 
     445                        <?php endif; ?> 
     446                <?php endif; ?> 
    404447        </div> 
    405448        <div id="section-holder" class="wrap"> 
    406449        <?php 
  • wp-admin/css/common.css

     
    17991799} 
    18001800 
    18011801/* Plugin install thickbox */ 
     1802.plugin-install-php .tb-close-icon { 
     1803        color: #444; 
     1804        background: rgba(255,255,255,.3); 
     1805} 
     1806 
     1807.plugin-install-php .tb-close-icon:hover { 
     1808        color: #2ea2cc; 
     1809        background: rgba(255,255,255,.6); 
     1810} 
     1811 
    18021812#plugin-information { 
    18031813        background: #fcfcfc; 
    18041814        position: fixed; 
     
    18241834        white-space: nowrap; 
    18251835} 
    18261836 
     1837#plugin-information-title.with-banner { 
     1838        height: 250px; 
     1839        bottom: 250px; 
     1840        background-size: 100% auto; 
     1841} 
     1842 
     1843@media only screen and (max-width: 800px) { 
     1844        #plugin-information-title.with-banner { 
     1845                height: 100px; 
     1846                bottom: 100px; 
     1847        } 
     1848} 
     1849 
     1850#plugin-information-title h2 { 
     1851        font-family: "Helvetica Neue", sans-serif; 
     1852        padding:0; 
     1853        margin: 0; 
     1854        max-width: 760px; 
     1855} 
     1856 
     1857#plugin-information-title.with-banner h2 { 
     1858        font-size: 30px; 
     1859        font-weight: bold; 
     1860        max-width: 760px; 
     1861        position: absolute; 
     1862        left: 20px; 
     1863        top: 175px; 
     1864        padding: 0 15px; 
     1865        margin: 0; 
     1866        color: #fff; 
     1867        background: rgba( 30, 30, 30, 0.9 ); 
     1868        text-shadow: 0 1px 3px rgba( 0, 0, 0, 0.4 ); 
     1869        -webkit-box-shadow: 0 0 30px rgba( 255, 255, 255, 0.1 ); 
     1870        -moz-box-shadow: 0 0 30px rgba( 255, 255, 255, 0.1 ); 
     1871        box-shadow: 0 0 30px rgba( 255, 255, 255, 0.1 ); 
     1872        -webkit-border-radius: 8px; 
     1873        border-radius: 8px; 
     1874} 
     1875 
     1876@media only screen and (max-width: 800px) { 
     1877        #plugin-information-title.with-banner h2 { 
     1878                top:25px; 
     1879        } 
     1880} 
     1881 
     1882#plugin-information-title div.vignette { 
     1883        display: none; 
     1884} 
     1885 
     1886#plugin-information-title.with-banner div.vignette { 
     1887        display: block; 
     1888        top: 0; 
     1889        height: 250px; 
     1890        width: 830px; 
     1891        margin: 0 -20px; 
     1892        background: transparent; 
     1893        -webkit-box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 ); 
     1894        -moz-box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 ); 
     1895        box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 ); 
     1896} 
     1897 
     1898@media only screen and (max-width: 800px) { 
     1899        #plugin-information-title.with-banner div.vignette { 
     1900                height: 100px; 
     1901                bottom: 100px; 
     1902                width: 800%; 
     1903        } 
     1904} 
     1905 
    18271906#plugin-information-tabs { 
    18281907        padding: 0 16px; 
    18291908        position: absolute; 
     
    18341913        z-index: 1; 
    18351914} 
    18361915 
     1916#plugin-information-tabs.with-banner { 
     1917        top:250px; 
     1918} 
     1919 
     1920@media only screen and (max-width: 800px) { 
     1921        #plugin-information-tabs.with-banner { 
     1922                top:100px; 
     1923        } 
     1924} 
     1925 
    18371926#plugin-information-tabs a { 
    18381927        position: relative; 
    18391928        float: left; 
     
    18711960        left: 0; 
    18721961} 
    18731962 
     1963#plugin-information-content.with-banner { 
     1964        top:284px; 
     1965} 
     1966 
     1967@media only screen and (max-width: 800px) { 
     1968        #plugin-information-content.with-banner { 
     1969                top:134px; 
     1970        } 
     1971} 
     1972 
    18741973#section-holder { 
    18751974        margin: 0; 
    18761975        padding: 10px 26px;