Skip to:
Content

BuddyPress.org

Ticket #7083: 7083-admin-css.2.patch

File 7083-admin-css.2.patch, 12.2 KB (added by dcavins, 8 years ago)

Use .input-options instead of div:not(.field-visibility-settings) in CSS selector. Also use a float on the legend for Firefox compat.

  • src/bp-members/admin/css/admin-rtl.css

    diff --git src/bp-members/admin/css/admin-rtl.css src/bp-members/admin/css/admin-rtl.css
    index bc204f8..96da85f 100644
     
    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 {
    46        position: relative;
    div#community-profile-page p.not-activated { 
    141143        margin-right: 200px;
    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}
    150157.field-visibility-settings-notoggle,
    div#community-profile-page p.not-activated { 
    167174#your-profile .bp-profile-field .checkbox legend,
    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;
    173180        line-height: 1.4em;
    div#community-profile-page p.not-activated { 
    176183        width: 192px;
    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
    184191.bp-profile-field .radio .clear-value {
    div#community-profile-page p.not-activated { 
    190197        #your-profile .bp-profile-field .datebox legend,
    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;
    196204        }
    197         .bp-profile-field .checkbox > label,
    198         .bp-profile-field .checkbox > label + label {
    199                 margin-right: 50px;
    200         }
    201205        .bp-profile-field .checkbox label,
    202206        .bp-profile-field .radio label {
    203207                line-height: 1.4em;
    div#community-profile-page p.not-activated { 
    210214        }
    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"],
    215220        .bp-profile-field input[type="radio"],
    div#community-profile-page p.not-activated { 
    231236}
    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"],
    240244        .bp-profile-field input[type="radio"],
  • src/bp-members/admin/css/admin.css

    diff --git src/bp-members/admin/css/admin.css src/bp-members/admin/css/admin.css
    index 6f730d3..bda35a0 100644
     
    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 {
    46        position: relative;
    div#community-profile-page p.not-activated { 
    141143        margin-left: 200px;
    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}
    150157.field-visibility-settings-notoggle,
    div#community-profile-page p.not-activated { 
    167174#your-profile .bp-profile-field .checkbox legend,
    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;
    173180        line-height: 1.4em;
    div#community-profile-page p.not-activated { 
    176183        width: 192px;
    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
    184191.bp-profile-field .radio .clear-value {
    div#community-profile-page p.not-activated { 
    190197        #your-profile .bp-profile-field .datebox legend,
    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;
    196204        }
    197         .bp-profile-field .checkbox > label,
    198         .bp-profile-field .checkbox > label + label {
    199                 margin-left: 50px;
    200         }
    201205        .bp-profile-field .checkbox label,
    202206        .bp-profile-field .radio label {
    203207                line-height: 1.4em;
    div#community-profile-page p.not-activated { 
    210214        }
    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"],
    215220        .bp-profile-field input[type="radio"],
    div#community-profile-page p.not-activated { 
    231236}
    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"],
    240244        .bp-profile-field input[type="radio"],
  • src/bp-xprofile/classes/class-bp-xprofile-field-type-checkbox.php

    diff --git src/bp-xprofile/classes/class-bp-xprofile-field-type-checkbox.php src/bp-xprofile/classes/class-bp-xprofile-field-type-checkbox.php
    index 34d752d..d986cd0 100644
    class BP_XProfile_Field_Type_Checkbox extends BP_XProfile_Field_Type { 
    176176                        $html .= apply_filters( 'bp_get_the_profile_field_options_checkbox', $new_html, $options[$k], $this->field_obj->id, $selected, $k );
    177177                }
    178178
    179                 echo $html;
     179                printf( '<div id="%1$s" class="input-options checkbox-options">%2$s</div>',
     180                        esc_attr( 'field_' . $this->field_obj->id ),
     181                        $html
     182                );
    180183        }
    181184
    182185        /**
  • src/bp-xprofile/classes/class-bp-xprofile-field-type-datebox.php

    diff --git src/bp-xprofile/classes/class-bp-xprofile-field-type-datebox.php src/bp-xprofile/classes/class-bp-xprofile-field-type-datebox.php
    index b0fb3cd..6074c5b 100644
    class BP_XProfile_Field_Type_Datebox extends BP_XProfile_Field_Type { 
    8585                                <?php bp_the_profile_field_required_label(); ?>
    8686                        </legend>
    8787
    88                         <?php
    89 
    90                         /**
    91                          * Fires after field label and displays associated errors for the field.
    92                          *
    93                          * This is a dynamic hook that is dependent on the associated
    94                          * field ID. The hooks will be similar to `bp_field_12_errors`
    95                          * where the 12 is the field ID. Simply replace the 12 with
    96                          * your needed target ID.
    97                          *
    98                          * @since 1.8.0
    99                          */
    100                         do_action( bp_get_the_profile_field_errors_action() ); ?>
    101 
    102                         <label for="<?php bp_the_profile_field_input_name(); ?>_day" class="<?php echo is_admin() ? 'screen-reader-text' : 'bp-screen-reader-text' ;?>"><?php
    103                                 /* translators: accessibility text */
    104                                 esc_html_e( 'Select day', 'buddypress' );
    105                         ?></label>
    106                         <select <?php echo $this->get_edit_field_html_elements( $day_r ); ?>>
    107                                 <?php bp_the_profile_field_options( array(
    108                                         'type'    => 'day',
    109                                         'user_id' => $user_id
    110                                 ) ); ?>
    111                         </select>
    112 
    113                         <label for="<?php bp_the_profile_field_input_name(); ?>_month" class="<?php echo is_admin() ? 'screen-reader-text' : 'bp-screen-reader-text' ;?>"><?php
    114                                 /* translators: accessibility text */
    115                                 esc_html_e( 'Select month', 'buddypress' );
    116                         ?></label>
    117                         <select <?php echo $this->get_edit_field_html_elements( $month_r ); ?>>
    118                                 <?php bp_the_profile_field_options( array(
    119                                         'type'    => 'month',
    120                                         'user_id' => $user_id
    121                                 ) ); ?>
    122                         </select>
    123 
    124                         <label for="<?php bp_the_profile_field_input_name(); ?>_year" class="<?php echo is_admin() ? 'screen-reader-text' : 'bp-screen-reader-text' ;?>"><?php
    125                                 /* translators: accessibility text */
    126                                 esc_html_e( 'Select year', 'buddypress' );
    127                         ?></label>
    128                         <select <?php echo $this->get_edit_field_html_elements( $year_r ); ?>>
    129                                 <?php bp_the_profile_field_options( array(
    130                                         'type'    => 'year',
    131                                         'user_id' => $user_id
    132                                 ) ); ?>
    133                         </select>
     88                        <div class="input-options datebox-selects">
     89
     90                                <?php
     91
     92                                /**
     93                                 * Fires after field label and displays associated errors for the field.
     94                                 *
     95                                 * This is a dynamic hook that is dependent on the associated
     96                                 * field ID. The hooks will be similar to `bp_field_12_errors`
     97                                 * where the 12 is the field ID. Simply replace the 12 with
     98                                 * your needed target ID.
     99                                 *
     100                                 * @since 1.8.0
     101                                 */
     102                                do_action( bp_get_the_profile_field_errors_action() ); ?>
     103
     104                                <label for="<?php bp_the_profile_field_input_name(); ?>_day" class="<?php echo is_admin() ? 'screen-reader-text' : 'bp-screen-reader-text' ;?>"><?php
     105                                        /* translators: accessibility text */
     106                                        esc_html_e( 'Select day', 'buddypress' );
     107                                ?></label>
     108                                <select <?php echo $this->get_edit_field_html_elements( $day_r ); ?>>
     109                                        <?php bp_the_profile_field_options( array(
     110                                                'type'    => 'day',
     111                                                'user_id' => $user_id
     112                                        ) ); ?>
     113                                </select>
     114
     115                                <label for="<?php bp_the_profile_field_input_name(); ?>_month" class="<?php echo is_admin() ? 'screen-reader-text' : 'bp-screen-reader-text' ;?>"><?php
     116                                        /* translators: accessibility text */
     117                                        esc_html_e( 'Select month', 'buddypress' );
     118                                ?></label>
     119                                <select <?php echo $this->get_edit_field_html_elements( $month_r ); ?>>
     120                                        <?php bp_the_profile_field_options( array(
     121                                                'type'    => 'month',
     122                                                'user_id' => $user_id
     123                                        ) ); ?>
     124                                </select>
     125
     126                                <label for="<?php bp_the_profile_field_input_name(); ?>_year" class="<?php echo is_admin() ? 'screen-reader-text' : 'bp-screen-reader-text' ;?>"><?php
     127                                        /* translators: accessibility text */
     128                                        esc_html_e( 'Select year', 'buddypress' );
     129                                ?></label>
     130                                <select <?php echo $this->get_edit_field_html_elements( $year_r ); ?>>
     131                                        <?php bp_the_profile_field_options( array(
     132                                                'type'    => 'year',
     133                                                'user_id' => $user_id
     134                                        ) ); ?>
     135                                </select>
     136
     137                        </div>
    134138
    135139                </fieldset>
    136140        <?php
  • src/bp-xprofile/classes/class-bp-xprofile-field-type-radiobutton.php

    diff --git src/bp-xprofile/classes/class-bp-xprofile-field-type-radiobutton.php src/bp-xprofile/classes/class-bp-xprofile-field-type-radiobutton.php
    index afe37d8..f8e0d5d 100644
    class BP_XProfile_Field_Type_Radiobutton extends BP_XProfile_Field_Type { 
    111111                $option_value = BP_XProfile_ProfileData::get_value_byid( $this->field_obj->id, $args['user_id'] );
    112112                $options      = $this->field_obj->get_children();
    113113
    114                 $html = sprintf( '<div id="%s">', esc_attr( 'field_' . $this->field_obj->id ) );
     114                $html = '';
    115115
    116116                for ( $k = 0, $count = count( $options ); $k < $count; ++$k ) {
    117117
    class BP_XProfile_Field_Type_Radiobutton extends BP_XProfile_Field_Type { 
    154154                        $html .= apply_filters( 'bp_get_the_profile_field_options_radio', $new_html, $options[$k], $this->field_obj->id, $selected, $k );
    155155                }
    156156
    157                 echo $html . '</div>';
     157                printf( '<div id="%1$s" class="input-options radio-button-options">%2$s</div>',
     158                        esc_attr( 'field_' . $this->field_obj->id ),
     159                        $html
     160                );
    158161        }
    159162
    160163        /**