WordPress.org

Making WordPress.org


Ignore:
Timestamp:
08/23/2016 10:35:28 PM (3 years ago)
Author:
obenland
Message:

Plugin Directory: Restructuring Sass and React client.

Merges Sass files into the React component structure. This allows styles to be
bundled with their React components. In an ideal world that would extend to
their PHP fallback templates as well, but it remains to be seen how feasible
that is.
Also introduces Sass Globbing and Pixrem pre-processing to automatically import
Sass files and add pixel fallbacks for rem values.

See #1719.

Location:
sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-plugins/client
Files:
1 copied
1 moved

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-plugins/client/components/search-form/style.scss

    r3844 r3847  
    1 @import "../variables-site/variables-site";
    2 
    31.search-form {
    42    font-size: 0;
    5     margin-bottom: 32px;
    63    margin-bottom: 2rem;
     4
    75    max-width: 100%;
    86    position: relative;
     
    1311        box-shadow: none;
    1412        display: block;
    15         @include font-size( ms-unitless( ms(0) ) );
     13        font-size: ms( 0 );
    1614        margin: 0 auto;
    1715        max-width: 100%;
    18         padding: 8px;
    1916        padding: 0.5rem;
    2017        width: ms(28);
     
    2421        border-left: none;
    2522        border-radius: 0 2px 2px 0;
    26         @include font-size( ms-unitless( ms(0) ) );
     23        font-size: ms( 0 );
    2724        position: relative;
    2825        right: auto;
     
    3633
    3734        .dashicons {
    38             @include font-size( ms-unitless( ms(0) ) );
     35            font-size: ms( 0 );
    3936        }
    4037    }
     
    5451            display: block;
    5552            height: 45px;
    56             padding: 8px 16px;
    5753            padding: 0.5rem 1rem;
    5854            position: absolute;
     
    8076            border-radius: 2px;
    8177            display: inline-block;
    82             @include font-size( ms-unitless( ms(0) ) );
     78            font-size: ms( 0 );
    8379            padding: 5px 10px;
    8480            position: relative;
     
    8985            .search-field {
    9086                border-radius: 2px 0 0 2px;
    91                 @include font-size( ms-unitless( ms(-4) ) );
    92                 width: 126px;
     87                font-size: ms( -4 );
    9388                width: 7rem;
    9489            }
     
    10297        @media screen and (min-width: 60em) {
    10398            .search-field {
    104                 width: 160px;
    10599                width: 10rem;
    106100            }
     
    111105        border: 1px solid $color__border-input;
    112106        box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
    113         padding: 8px;
    114107        padding: 0.5rem;
    115108        width: 100%;
Note: See TracChangeset for help on using the changeset viewer.