Making WordPress.org

Ticket #2552: 2552.1.patch

File 2552.1.patch, 1.5 KB (added by vladytimy, 4 years ago)

By moving the inline css of the banner to a stylesheet we can fix its position on mobile devices. This is just a proposal, maybe there's a better approach.

  • sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-bbp-also-viewing/wporg-bbp-also-viewing.js

     
    4343                        }
    4444
    4545                        jQuery('#main').before(
    46                                 '<div id="also-viewing-banner" style="display: none; font-size: 0.8rem; color: #fff; line-height: 2rem; background: #d54e21; width:100%; text-align: center; position: initial; top: 32px; left: 0; z-index: 9999;"></div>'
     46                                '<div id="also-viewing-banner"></div>'
    4747                        );
    4848                        banner = jQuery( '#also-viewing-banner' );
    4949                }
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-support/sass/elements/_banners.scss

     
    1212                max-width: $size__site-main;
    1313        }
    1414}
     15
     16#also-viewing-banner {
     17        display: none;
     18        font-size: 0.8rem;
     19        color: #fff;
     20        line-height: 2rem;
     21        background: #d54e21;
     22        width:100%;
     23        text-align: center;
     24        position: initial;
     25        top: 32px;
     26        left: 0;
     27        z-index: 9999;
     28       
     29        @media ( max-width: 782px ) {
     30                top: 0;
     31        }
     32       
     33}