Skip to:
Content

BuddyPress.org

Changeset 10856


Ignore:
Timestamp:
06/01/2016 06:50:58 PM (6 years ago)
Author:
dcavins
Message:

Xprofile: Fix layout issues with input types in wp-admin.

Align input fields on the extended profile
pane of a user’s profile in wp-admin.

See #7080.

Props mercime, dcavins.

Location:
trunk/src/bp-members/admin/css
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/bp-members/admin/css/admin-rtl.css

    r10810 r10856  
    1 /**** BP Members Profile Administration Screens ****/
     1/**** BP Members Profile Administration Screens
     2* TO DO: Organize and clean up stylesheet.
     3****/
    24
    35div#profile-page.wrap form#your-profile {
     
    142144    width: auto;
    143145}
    144 .field_type_radio .radio div:not(.field-visibility-settings) label {  /* force radio buttons to new lines */
     146.field_type_radio .radio .input-options label,
     147.field_type_checkbox .checkbox .input-options label {
     148    /* force checkboxes and radio buttons to new lines */
    145149    display: block;
    146150}
    147 .field_type_radio .radio div:not(.field-visibility-settings) {  /* make the radio buttons sit in the right side column */
     151.field_type_checkbox .checkbox .input-options,
     152.field_type_datebox .datebox .input-options,
     153.field_type_radio .radio .input-options {
     154    /* make the checkboxes, select menus, and radio buttons sit in the right side column */
    148155    display: inline-block;
    149156}
     
    168175#your-profile .bp-profile-field .datebox legend,
    169176#your-profile .bp-profile-field .radio legend {
    170     display: inline-block;
     177    float:right; /* Firefox will not apply display: inline-block to legends */
    171178    font-size: 14px;
    172179    font-weight: 600;
     
    177184}
    178185
    179 #your-profile .bp-profile-field .radio legend {
     186#your-profile .bp-profile-field .radio legend,
     187#your-profile .bp-profile-field .checkbox legend {
    180188    margin-bottom: 20px;
    181     vertical-align: top;
    182189}
    183190
     
    191198    #your-profile .bp-profile-field .radio legend,
    192199    .bp-profile-field label {
     200        float: none;
    193201        clear: right;
    194202        display: block;
    195203        margin-bottom: 12px;
    196     }
    197     .bp-profile-field .checkbox > label,
    198     .bp-profile-field .checkbox > label + label {
    199         margin-right: 50px;
    200204    }
    201205    .bp-profile-field .checkbox label,
     
    211215    .bp-profile-field .clear-value,
    212216    .bp-profile-field .description,
     217    .bp-profile-field input[type="checkbox"],
    213218    .bp-profile-field input[type="email"],
    214219    .bp-profile-field input[type="number"],
     
    232237
    233238@media screen and (max-width: 480px) {
    234     .bp-profile-field .checkbox > label,
    235     .bp-profile-field .checkbox > label + label,
    236239    .bp-profile-field .clear-value,
    237240    .bp-profile-field .description,
     241    .bp-profile-field input[type="checkbox"],
    238242    .bp-profile-field input[type="email"],
    239243    .bp-profile-field input[type="number"],
  • trunk/src/bp-members/admin/css/admin.css

    r10810 r10856  
    1 /**** BP Members Profile Administration Screens ****/
     1/**** BP Members Profile Administration Screens
     2* TO DO: Organize and clean up stylesheet.
     3****/
    24
    35div#profile-page.wrap form#your-profile {
     
    142144    width: auto;
    143145}
    144 .field_type_radio .radio div:not(.field-visibility-settings) label {  /* force radio buttons to new lines */
     146.field_type_radio .radio .input-options label,
     147.field_type_checkbox .checkbox .input-options label {
     148    /* force checkboxes and radio buttons to new lines */
    145149    display: block;
    146150}
    147 .field_type_radio .radio div:not(.field-visibility-settings) {  /* make the radio buttons sit in the right side column */
     151.field_type_checkbox .checkbox .input-options,
     152.field_type_datebox .datebox .input-options,
     153.field_type_radio .radio .input-options {
     154    /* make the checkboxes, select menus, and radio buttons sit in the right side column */
    148155    display: inline-block;
    149156}
     
    168175#your-profile .bp-profile-field .datebox legend,
    169176#your-profile .bp-profile-field .radio legend {
    170     display: inline-block;
     177    float:left; /* Firefox will not apply display: inline-block to legends */
    171178    font-size: 14px;
    172179    font-weight: 600;
     
    177184}
    178185
    179 #your-profile .bp-profile-field .radio legend {
     186#your-profile .bp-profile-field .radio legend,
     187#your-profile .bp-profile-field .checkbox legend {
    180188    margin-bottom: 20px;
    181     vertical-align: top;
    182189}
    183190
     
    191198    #your-profile .bp-profile-field .radio legend,
    192199    .bp-profile-field label {
     200        float: none;
    193201        clear: left;
    194202        display: block;
    195203        margin-bottom: 12px;
    196     }
    197     .bp-profile-field .checkbox > label,
    198     .bp-profile-field .checkbox > label + label {
    199         margin-left: 50px;
    200204    }
    201205    .bp-profile-field .checkbox label,
     
    211215    .bp-profile-field .clear-value,
    212216    .bp-profile-field .description,
     217    .bp-profile-field input[type="checkbox"],
    213218    .bp-profile-field input[type="email"],
    214219    .bp-profile-field input[type="number"],
     
    232237
    233238@media screen and (max-width: 480px) {
    234     .bp-profile-field .checkbox > label,
    235     .bp-profile-field .checkbox > label + label,
    236239    .bp-profile-field .clear-value,
    237240    .bp-profile-field .description,
     241    .bp-profile-field input[type="checkbox"],
    238242    .bp-profile-field input[type="email"],
    239243    .bp-profile-field input[type="number"],
Note: See TracChangeset for help on using the changeset viewer.