Skip to:
Content

BuddyPress.org

Changeset 13709


Ignore:
Timestamp:
01/22/2024 05:54:22 AM (15 months ago)
Author:
imath
Message:

Create a specific CSS file for BP Tooltips

  • Move BP Tooltips default CSS rules into their own BP Core file so that it's easier to add this file as a style dependency.
  • Let BP Template Packs override this BP Core file and create a new bp-tooltips.css file into BP Nouveau to do so.
  • Use this BP Core file as a dependency to Admin's Hello styles as well as BP Template packs main styles.
  • Enqueue BP Tooltips CSS rules when Block widgets are rendered.

Props jnie

See #9070 (trunk)
Closes ​https://github.com/buddypress/buddypress/pull/221

Location:
trunk
Files:
7 added
1 deleted
24 edited

Legend:

Unmodified
Added
Removed

  • trunk/Gruntfile.js

    r13703 r13709  
    3636            '!bp-templates/bp-nouveau/css/primary-nav.css',
    3737            '!bp-templates/bp-nouveau/sass/priority-nav.scss',
     38            '!bp-templates/bp-nouveau/sass/bp-tooltips.scss',
    3839            '!bp-core/admin/css/hello.css',
    3940            '!src/js/**',
    … …  
    120121                ext: '.css',
    121122                flatten: true,
    122                 src: ['bp-templates/bp-nouveau/sass/buddypress.scss', 'bp-templates/bp-nouveau/sass/twenty*.scss', 'bp-templates/bp-nouveau/sass/primary-nav.scss', 'bp-templates/bp-nouveau/sass/priority-nav.scss'],
     123                src: ['bp-templates/bp-nouveau/sass/buddypress.scss', 'bp-templates/bp-nouveau/sass/twenty*.scss', 'bp-templates/bp-nouveau/sass/primary-nav.scss', 'bp-templates/bp-nouveau/sass/priority-nav.scss', 'bp-templates/bp-nouveau/sass/bp-tooltips.scss'],
    123124                dest: SOURCE_DIR + 'bp-templates/bp-nouveau/css/'
     125            },
     126            core: {
     127                cwd: SOURCE_DIR,
     128                extDot: 'last',
     129                expand: true,
     130                ext: '.css',
     131                flatten: true,
     132                src: ['bp-core/sass/*.scss'],
     133                dest: SOURCE_DIR + 'bp-core/css/'
    124134            },
    125135            admin: {

  • trunk/src/bp-activity/bp-activity-blocks.php

    r13537 r13709  
    157157    $GLOBALS['activities_template'] = $reset_activities_template;
    158158
     159    // Enqueue BP Tooltips.
     160    wp_enqueue_style( 'bp-tooltips' );
     161
    159162    // Only add a block wrapper if not loaded into a Widgets sidebar.
    160163    if ( ! did_action( 'dynamic_sidebar_before' ) ) {

  • trunk/src/bp-core/admin/css/common-rtl.css

    r13674 r13709  
    1818    2.3 Settings - URls
    1919    2.4 Tools
    20     2.5 Tooltips
    21203.0 Users
    2221    3.1 Users List
    … …  
    344343body.tools_page_bp-optouts .nav-tab-wrapper {
    345344    margin-bottom: 1em;
    346 }
    347 
    348 /*
    349  * 2.5 Tooltips
    350  */
    351 .bp-tooltip {
    352     position: relative;
    353 }
    354 
    355 .bp-tooltip:after {
    356     background: #fff;
    357     border: 1px solid #aaa;
    358     border-collapse: separate;
    359     border-radius: 1px;
    360     box-shadow: -1px 1px 0 1px rgba(132, 132, 132, 0.3);
    361     color: #000;
    362     content: attr(data-bp-tooltip);
    363     display: none;
    364     font-family: sans-serif;
    365     font-size: 11px;
    366     font-weight: 400;
    367     letter-spacing: normal;
    368     line-height: 1.5;
    369     margin-top: 10px;
    370     max-width: 240px;
    371     opacity: 0;
    372     padding: 3px 6px;
    373     position: absolute;
    374     left: 50%;
    375     text-align: center;
    376     text-decoration: none;
    377     text-shadow: none;
    378     text-transform: none;
    379     top: 100%;
    380     transform: translateX(-50%);
    381     transition: opacity 2s ease-out;
    382     white-space: pre;
    383     word-wrap: break-word;
    384     z-index: 998;
    385 }
    386 
    387 .bp-hello-close .bp-tooltip:after {
    388     left: 0;
    389     text-align: left;
    390     transform: translateX(0);
    391 }
    392 
    393 .bp-hello-social .bp-tooltip:after {
    394     bottom: 120%;
    395     margin-bottom: 20px;
    396     margin-top: 0;
    397     top: auto;
    398     transform: translateX(-15%);
    399 }
    400 
    401 .bp-tooltip:hover:after,
    402 .bp-tooltip:active:after,
    403 .bp-tooltip:focus:after {
    404     display: inline-block;
    405     opacity: 1;
    406     overflow: visible;
    407     text-decoration: none;
    408     z-index: 999;
    409345}
    410346

  • trunk/src/bp-core/admin/css/common.css

    r13674 r13709  
    1818    2.3 Settings - URls
    1919    2.4 Tools
    20     2.5 Tooltips
    21203.0 Users
    2221    3.1 Users List
    … …  
    344343body.tools_page_bp-optouts .nav-tab-wrapper {
    345344    margin-bottom: 1em;
    346 }
    347 
    348 /*
    349  * 2.5 Tooltips
    350  */
    351 .bp-tooltip {
    352     position: relative;
    353 }
    354 
    355 .bp-tooltip:after {
    356     background: #fff;
    357     border: 1px solid #aaa;
    358     border-collapse: separate;
    359     border-radius: 1px;
    360     box-shadow: 1px 1px 0 1px rgba(132, 132, 132, 0.3);
    361     color: #000;
    362     content: attr(data-bp-tooltip);
    363     display: none;
    364     font-family: sans-serif;
    365     font-size: 11px;
    366     font-weight: 400;
    367     letter-spacing: normal;
    368     line-height: 1.5;
    369     margin-top: 10px;
    370     max-width: 240px;
    371     opacity: 0;
    372     padding: 3px 6px;
    373     position: absolute;
    374     right: 50%;
    375     text-align: center;
    376     text-decoration: none;
    377     text-shadow: none;
    378     text-transform: none;
    379     top: 100%;
    380     transform: translateX(50%);
    381     transition: opacity 2s ease-out;
    382     white-space: pre;
    383     word-wrap: break-word;
    384     z-index: 998;
    385 }
    386 
    387 .bp-hello-close .bp-tooltip:after {
    388     right: 0;
    389     text-align: right;
    390     transform: translateX(0);
    391 }
    392 
    393 .bp-hello-social .bp-tooltip:after {
    394     bottom: 120%;
    395     margin-bottom: 20px;
    396     margin-top: 0;
    397     top: auto;
    398     transform: translateX(15%);
    399 }
    400 
    401 .bp-tooltip:hover:after,
    402 .bp-tooltip:active:after,
    403 .bp-tooltip:focus:after {
    404     display: inline-block;
    405     opacity: 1;
    406     overflow: visible;
    407     text-decoration: none;
    408     z-index: 999;
    409345}
    410346

  • trunk/src/bp-core/admin/css/hello-rtl.css

    r13385 r13709  
    206206}
    207207
     208.bp-hello-social li a.bp-tooltip:after {
     209    bottom: 120%;
     210    margin-bottom: 20px;
     211    margin-top: 0;
     212    top: auto;
     213    transform: translateX(85%);
     214}
     215
    208216/*
    209217 * 4.2 - Header content

  • trunk/src/bp-core/admin/css/hello.css

    r13385 r13709  
    206206}
    207207
     208.bp-hello-social li a.bp-tooltip:after {
     209    bottom: 120%;
     210    margin-bottom: 20px;
     211    margin-top: 0;
     212    top: auto;
     213    transform: translateX(-85%);
     214}
     215
    208216/*
    209217 * 4.2 - Header content

  • trunk/src/bp-core/admin/sass/hello.scss

    r13385 r13709  
    228228        a {
    229229            text-decoration: none;
     230
     231            &.bp-tooltip:after {
     232                bottom: 120%;
     233                margin-bottom: 20px;
     234                margin-top: 0;
     235                top: auto;
     236                transform: translateX(-85%);
     237            }
    230238        }
    231239    }

  • trunk/src/bp-core/bp-core-cssjs.php

    r13523 r13709  
    104104     */
    105105    $admin_bar_file = apply_filters( 'bp_core_admin_bar_css', "{$url}admin-bar{$min}.css" );
     106
     107    // Set default BP Tooltips styles.
     108    $tooltips_uri      = "{$url}bp-tooltips{$min}.css";
     109    $template_tooltips = bp_locate_template_asset( "css/bp-tooltips{$min}.css" );
     110
     111    if ( isset( $template_tooltips['uri'] ) && $template_tooltips['uri'] ) {
     112        $tooltips_uri = $template_tooltips['uri'];
     113    }
    106114
    107115    /**
    … …  
    120128            'file'         => "{$url}avatar{$min}.css",
    121129            'dependencies' => array( 'jcrop' )
     130        ),
     131        'bp-tooltips' => array(
     132            'file'         => $tooltips_uri,
     133            'dependencies' => array()
    122134        ),
    123135    ) );

  • trunk/src/bp-core/classes/class-bp-admin.php

    r13696 r13709  
    13831383            'bp-hello-css' => array(
    13841384                'file'         => "{$url}hello{$min}.css",
    1385                 'dependencies' => array( 'bp-admin-common-css', 'thickbox' ),
     1385                'dependencies' => array( 'bp-admin-common-css', 'thickbox', 'bp-tooltips' ),
    13861386            ),
    13871387        ) );

  • trunk/src/bp-members/bp-members-blocks.php

    r13676 r13709  
    663663            implode( "\n", $member_avatars )
    664664        );
     665
     666        // Only enqueue BP Tooltips if there is some content to style.
     667        wp_enqueue_style( 'bp-tooltips' );
    665668    } else {
    666669        $widget_content .= sprintf(

  • trunk/src/bp-messages/bp-messages-blocks.php

    r13464 r13709  
    119119    $widget_content .= '</div>';
    120120
     121    // Enqueue BP Tooltips.
     122    wp_enqueue_style( 'bp-tooltips' );
     123
    121124    if ( ! did_action( 'dynamic_sidebar_before' ) ) {
    122125        return sprintf(

  • trunk/src/bp-templates/bp-legacy/buddypress-functions.php

    r13672 r13709  
    224224        // LTR.
    225225        if ( ! is_rtl() && isset( $ltr['location'], $ltr['handle'] ) ) {
    226             wp_enqueue_style( $ltr['handle'], $ltr['location'], array(), $this->version, 'screen' );
     226            wp_enqueue_style( $ltr['handle'], $ltr['location'], array( 'bp-tooltips' ), $this->version, 'screen' );
    227227
    228228            if ( $min ) {
    … …  
    237237            if ( isset( $rtl['location'], $rtl['handle'] ) ) {
    238238                $rtl['handle'] = str_replace( '-css', '-css-rtl', $rtl['handle'] );  // Backwards compatibility.
    239                 wp_enqueue_style( $rtl['handle'], $rtl['location'], array(), $this->version, 'screen' );
     239                wp_enqueue_style( $rtl['handle'], $rtl['location'], array( 'bp-tooltips' ), $this->version, 'screen' );
    240240
    241241                if ( $min ) {
    … …  
    250250            // Use a unique handle.
    251251            $theme['handle'] = 'bp-' . get_template();
    252             wp_enqueue_style( $theme['handle'], $theme['location'], array(), $this->version, 'screen' );
     252            wp_enqueue_style( $theme['handle'], $theme['location'], array( 'bp-tooltips' ), $this->version, 'screen' );
    253253
    254254            if ( $min ) {
    … …  
    263263            if ( isset( $theme_rtl['location'] ) ) {
    264264                $theme_rtl['handle'] = $theme['handle'] . '-rtl';
    265                 wp_enqueue_style( $theme_rtl['handle'], $theme_rtl['location'], array(), $this->version, 'screen' );
     265                wp_enqueue_style( $theme_rtl['handle'], $theme_rtl['location'], array( 'bp-tooltips' ), $this->version, 'screen' );
    266266
    267267                if ( $min ) {

  • trunk/src/bp-templates/bp-legacy/css/buddypress-rtl.css

    r13684 r13709  
    200520053.11 - Tooltips
    20062006--------------------------------------------------------------*/
    2007 
    2008 .buddypress .bp-tooltip {
    2009     position: relative;
    2010 }
    2011 
    2012 .bp-tooltip:after {
    2013     background: #fff;
    2014     border: 1px solid #aaa;
    2015     border-collapse: separate;
    2016     border-radius: 1px;
    2017     box-shadow: -1px 1px 0 1px rgba(132, 132, 132, 0.3);
    2018     color: #000;
    2019     content: attr(data-bp-tooltip);
    2020     display: none;
    2021     font-family: sans-serif;
    2022     font-size: 11px;
    2023     font-weight: 400;
    2024     letter-spacing: normal;
    2025     line-height: 1.5;
    2026     margin-top: 10px;
    2027     max-width: 240px;
    2028     opacity: 0;
    2029     padding: 3px 6px;
    2030     position: absolute;
    2031     left: 50%;
    2032     text-align: center;
    2033     text-decoration: none;
    2034     text-shadow: none;
    2035     text-transform: none;
    2036     top: 100%;
    2037     transform: translateX(-50%);
    2038     transition: opacity 2s ease-out;
    2039     white-space: pre;
    2040     word-wrap: break-word;
    2041     z-index: 998;
    2042 }
    2043 
    2044 .bp-tooltip:hover:after,
    2045 .bp-tooltip:active:after,
    2046 .bp-tooltip:focus:after {
    2047     display: inline-block;
    2048     opacity: 1;
    2049     overflow: visible;
    2050     text-decoration: none;
    2051     z-index: 999;
    2052 }
    2053 
    20542007#group-admins .bp-tooltip:after,
    20552008#group-mods .bp-tooltip:after,

  • trunk/src/bp-templates/bp-legacy/css/buddypress.css

    r13684 r13709  
    200520053.11 - Tooltips
    20062006--------------------------------------------------------------*/
    2007 
    2008 .buddypress .bp-tooltip {
    2009     position: relative;
    2010 }
    2011 
    2012 .bp-tooltip:after {
    2013     background: #fff;
    2014     border: 1px solid #aaa;
    2015     border-collapse: separate;
    2016     border-radius: 1px;
    2017     box-shadow: 1px 1px 0 1px rgba(132, 132, 132, 0.3);
    2018     color: #000;
    2019     content: attr(data-bp-tooltip);
    2020     display: none;
    2021     font-family: sans-serif;
    2022     font-size: 11px;
    2023     font-weight: 400;
    2024     letter-spacing: normal;
    2025     line-height: 1.5;
    2026     margin-top: 10px;
    2027     max-width: 240px;
    2028     opacity: 0;
    2029     padding: 3px 6px;
    2030     position: absolute;
    2031     right: 50%;
    2032     text-align: center;
    2033     text-decoration: none;
    2034     text-shadow: none;
    2035     text-transform: none;
    2036     top: 100%;
    2037     transform: translateX(50%);
    2038     transition: opacity 2s ease-out;
    2039     white-space: pre;
    2040     word-wrap: break-word;
    2041     z-index: 998;
    2042 }
    2043 
    2044 .bp-tooltip:hover:after,
    2045 .bp-tooltip:active:after,
    2046 .bp-tooltip:focus:after {
    2047     display: inline-block;
    2048     opacity: 1;
    2049     overflow: visible;
    2050     text-decoration: none;
    2051     z-index: 999;
    2052 }
    2053 
    20542007#group-admins .bp-tooltip:after,
    20552008#group-mods .bp-tooltip:after,

  • trunk/src/bp-templates/bp-nouveau/buddypress-functions.php

    r13672 r13709  
    271271         * @param array $value Array of style dependencies. Default Dashicons.
    272272         */
    273         $css_dependencies = apply_filters( 'bp_nouveau_css_dependencies', array( 'dashicons' ) );
     273        $css_dependencies = apply_filters( 'bp_nouveau_css_dependencies', array( 'dashicons', 'bp-tooltips' ) );
    274274
    275275        /**

  • trunk/src/bp-templates/bp-nouveau/common-styles/_bp_activity_entries.scss

    r13342 r13709  
    44
    55.activity-list {
     6
     7    .bp-tooltip {
     8
     9        @include bp-tooltip-bottom-left;
     10    }
    611
    712    padding: $pad-sml;

  • trunk/src/bp-templates/bp-nouveau/common-styles/_bp_buttons.scss

    r12773 r13709  
    157157
    158158            }
     159
     160            .bp-tooltip {
     161
     162                @include bp-tooltip-bottom-right;
     163            }
     164
     165            #send-invites-editor .bp-tooltip {
     166
     167                // override .bp-invites-content .bp-tooltip
     168                &:after {
     169                    left: 0;
     170                    right: auto;
     171                }
     172            }
    159173        }
    160174

  • trunk/src/bp-templates/bp-nouveau/common-styles/_bp_group_header.scss

    r12789 r13709  
    5757                padding: 4px;
    5858            }
     59
     60            // Bottom Left Tooltip for mobile and Bottom Right Tooltip for tablet/desktop
     61            .bp-tooltip {
     62
     63                @include bp-tooltip-bottom-left;
     64
     65                @include medium-up() {
     66
     67                    @include bp-tooltip-bottom-right;
     68                }
     69            }
    5970        }
    6071

  • trunk/src/bp-templates/bp-nouveau/common-styles/_bp_messages.scss

    r12082 r13709  
    7070        overflow: hidden;
    7171        position: relative;
     72
     73        .actions .bp-tooltip {
     74
     75            @include bp-tooltip-bottom-right;
     76        }
    7277    }
    7378
    … …  
    129134    content: "\f155";
    130135}
     136
     137.participants-list .bp-tooltip {
     138
     139    @include bp-tooltip-bottom-left;
     140}

  • trunk/src/bp-templates/bp-nouveau/common-styles/_bp_tables.scss

    r12814 r13709  
    111111        .notification-actions {
    112112            width: 15%;
     113
     114            .bp-tooltip {
     115
     116                @include bp-tooltip-bottom-left;
     117            }
    113118        }
    114119    }

  • trunk/src/bp-templates/bp-nouveau/css/buddypress-rtl.css

    r13684 r13709  
    12461246}
    12471247
     1248.activity-list .bp-tooltip:after {
     1249    right: 0;
     1250    transform: translate(0, 0);
     1251}
     1252
    12481253.activity-list .activity-item:before,
    12491254.activity-list .activity-item:after {
    … …  
    24652470    margin-right: 4px;
    24662471    padding: 4px;
     2472}
     2473
     2474.groups-header .moderators-lists .user-list .bp-tooltip:after {
     2475    right: 0;
     2476    transform: translate(0, 0);
     2477}
     2478
     2479@media screen and (min-width: 46.8em) {
     2480    .groups-header .moderators-lists .user-list .bp-tooltip:after {
     2481        right: auto;
     2482        left: 0;
     2483        transform: translate(0, 0);
     2484    }
    24672485}
    24682486
    … …  
    33893407    content: "";
    33903408    display: table;
     3409}
     3410
     3411.bp-messages-content .preview-pane-header .actions .bp-tooltip:after,
     3412.bp-messages-content .single-message-thread-header .actions .bp-tooltip:after {
     3413    right: auto;
     3414    left: 0;
     3415    transform: translate(0, 0);
    33913416}
    33923417
    … …  
    40824107}
    40834108
     4109.buddypress-wrap table.notifications .actions .bp-tooltip:after,
     4110.buddypress-wrap table.notifications .notification-actions .bp-tooltip:after {
     4111    right: 0;
     4112    transform: translate(0, 0);
     4113}
     4114
    40844115.buddypress-wrap table.notification-settings th.title,
    40854116.buddypress-wrap table.profile-settings th.title {
    … …  
    43214352}
    43224353
     4354.buddypress .buddypress-wrap .bp-invites-content .bp-tooltip:after {
     4355    right: auto;
     4356    left: 0;
     4357    transform: translate(0, 0);
     4358}
     4359
     4360.buddypress .buddypress-wrap .bp-invites-content #send-invites-editor .bp-tooltip:after {
     4361    right: 0;
     4362    left: auto;
     4363}
     4364
    43234365.buddypress .buddypress-wrap #item-buttons:empty {
    43244366    display: none;
    … …  
    47824824.buddypress-wrap input.loading:hover {
    47834825    color: #777;
    4784 }
    4785 
    4786 [data-bp-tooltip] {
    4787     position: relative;
    4788 }
    4789 
    4790 [data-bp-tooltip]:after {
    4791     background-color: #fff;
    4792     display: none;
    4793     opacity: 0;
    4794     position: absolute;
    4795     transform: translate3d(0, 0, 0);
    4796     visibility: hidden;
    4797 }
    4798 
    4799 [data-bp-tooltip]:after {
    4800     border: 1px solid #737373;
    4801     border-radius: 1px;
    4802     box-shadow: -4px 4px 8px rgba(0, 0, 0, 0.2);
    4803     color: #333;
    4804     content: attr(data-bp-tooltip);
    4805     font-family: "Helvetica Neue", helvetica, arial, san-serif;
    4806     font-size: 12px;
    4807     font-weight: 400;
    4808     letter-spacing: normal;
    4809     line-height: 1.25;
    4810     max-width: 200px;
    4811     padding: 5px 8px;
    4812     pointer-events: none;
    4813     text-shadow: none;
    4814     text-transform: none;
    4815     transition: all 1.5s ease;
    4816     white-space: nowrap;
    4817     word-wrap: break-word;
    4818     z-index: 100000;
    4819 }
    4820 
    4821 [data-bp-tooltip]:hover:after, [data-bp-tooltip]:active:after, [data-bp-tooltip]:focus:after {
    4822     display: block;
    4823     opacity: 1;
    4824     overflow: visible;
    4825     visibility: visible;
    4826 }
    4827 
    4828 [data-bp-tooltip=""] {
    4829     display: none;
    4830     opacity: 0;
    4831     visibility: hidden;
    4832 }
    4833 
    4834 .bp-tooltip:after {
    4835     right: 50%;
    4836     margin-top: 7px;
    4837     top: 110%;
    4838     transform: translate(50%, 0);
    4839 }
    4840 
    4841 .user-list .bp-tooltip:after {
    4842     right: 0;
    4843     transform: translate(0, 0);
    4844 }
    4845 
    4846 @media screen and (min-width: 46.8em) {
    4847     .user-list .bp-tooltip:after {
    4848         right: auto;
    4849         left: 0;
    4850         transform: translate(0, 0);
    4851     }
    4852 }
    4853 
    4854 .activity-list .bp-tooltip:after,
    4855 .activity-meta-action .bp-tooltip:after,
    4856 .avatar-block .item-avatar .bp-tooltip:after,
    4857 .notification-actions .bp-tooltip:after,
    4858 .participants-list .bp-tooltip:after {
    4859     right: 0;
    4860     transform: translate(0, 0);
    4861 }
    4862 
    4863 .bp-invites-content .bp-tooltip:after,
    4864 .message-metadata .actions .bp-tooltip:after,
    4865 .single-message-thread-header .actions .bp-tooltip:after {
    4866     right: auto;
    4867     left: 0;
    4868     transform: translate(0, 0);
    4869 }
    4870 
    4871 .bp-invites-content #send-invites-editor .bp-tooltip:after {
    4872     right: 0;
    4873     left: auto;
    48744826}
    48754827

  • trunk/src/bp-templates/bp-nouveau/css/buddypress.css

    r13684 r13709  
    12461246}
    12471247
     1248.activity-list .bp-tooltip:after {
     1249    left: 0;
     1250    transform: translate(0, 0);
     1251}
     1252
    12481253.activity-list .activity-item:before,
    12491254.activity-list .activity-item:after {
    … …  
    24652470    margin-left: 4px;
    24662471    padding: 4px;
     2472}
     2473
     2474.groups-header .moderators-lists .user-list .bp-tooltip:after {
     2475    left: 0;
     2476    transform: translate(0, 0);
     2477}
     2478
     2479@media screen and (min-width: 46.8em) {
     2480    .groups-header .moderators-lists .user-list .bp-tooltip:after {
     2481        left: auto;
     2482        right: 0;
     2483        transform: translate(0, 0);
     2484    }
    24672485}
    24682486
    … …  
    33893407    content: "";
    33903408    display: table;
     3409}
     3410
     3411.bp-messages-content .preview-pane-header .actions .bp-tooltip:after,
     3412.bp-messages-content .single-message-thread-header .actions .bp-tooltip:after {
     3413    left: auto;
     3414    right: 0;
     3415    transform: translate(0, 0);
    33913416}
    33923417
    … …  
    40824107}
    40834108
     4109.buddypress-wrap table.notifications .actions .bp-tooltip:after,
     4110.buddypress-wrap table.notifications .notification-actions .bp-tooltip:after {
     4111    left: 0;
     4112    transform: translate(0, 0);
     4113}
     4114
    40844115.buddypress-wrap table.notification-settings th.title,
    40854116.buddypress-wrap table.profile-settings th.title {
    … …  
    43214352}
    43224353
     4354.buddypress .buddypress-wrap .bp-invites-content .bp-tooltip:after {
     4355    left: auto;
     4356    right: 0;
     4357    transform: translate(0, 0);
     4358}
     4359
     4360.buddypress .buddypress-wrap .bp-invites-content #send-invites-editor .bp-tooltip:after {
     4361    left: 0;
     4362    right: auto;
     4363}
     4364
    43234365.buddypress .buddypress-wrap #item-buttons:empty {
    43244366    display: none;
    … …  
    47824824.buddypress-wrap input.loading:hover {
    47834825    color: #777;
    4784 }
    4785 
    4786 [data-bp-tooltip] {
    4787     position: relative;
    4788 }
    4789 
    4790 [data-bp-tooltip]:after {
    4791     background-color: #fff;
    4792     display: none;
    4793     opacity: 0;
    4794     position: absolute;
    4795     transform: translate3d(0, 0, 0);
    4796     visibility: hidden;
    4797 }
    4798 
    4799 [data-bp-tooltip]:after {
    4800     border: 1px solid #737373;
    4801     border-radius: 1px;
    4802     box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
    4803     color: #333;
    4804     content: attr(data-bp-tooltip);
    4805     font-family: "Helvetica Neue", helvetica, arial, san-serif;
    4806     font-size: 12px;
    4807     font-weight: 400;
    4808     letter-spacing: normal;
    4809     line-height: 1.25;
    4810     max-width: 200px;
    4811     padding: 5px 8px;
    4812     pointer-events: none;
    4813     text-shadow: none;
    4814     text-transform: none;
    4815     transition: all 1.5s ease;
    4816     white-space: nowrap;
    4817     word-wrap: break-word;
    4818     z-index: 100000;
    4819 }
    4820 
    4821 [data-bp-tooltip]:hover:after, [data-bp-tooltip]:active:after, [data-bp-tooltip]:focus:after {
    4822     display: block;
    4823     opacity: 1;
    4824     overflow: visible;
    4825     visibility: visible;
    4826 }
    4827 
    4828 [data-bp-tooltip=""] {
    4829     display: none;
    4830     opacity: 0;
    4831     visibility: hidden;
    4832 }
    4833 
    4834 .bp-tooltip:after {
    4835     left: 50%;
    4836     margin-top: 7px;
    4837     top: 110%;
    4838     transform: translate(-50%, 0);
    4839 }
    4840 
    4841 .user-list .bp-tooltip:after {
    4842     left: 0;
    4843     transform: translate(0, 0);
    4844 }
    4845 
    4846 @media screen and (min-width: 46.8em) {
    4847     .user-list .bp-tooltip:after {
    4848         left: auto;
    4849         right: 0;
    4850         transform: translate(0, 0);
    4851     }
    4852 }
    4853 
    4854 .activity-list .bp-tooltip:after,
    4855 .activity-meta-action .bp-tooltip:after,
    4856 .avatar-block .item-avatar .bp-tooltip:after,
    4857 .notification-actions .bp-tooltip:after,
    4858 .participants-list .bp-tooltip:after {
    4859     left: 0;
    4860     transform: translate(0, 0);
    4861 }
    4862 
    4863 .bp-invites-content .bp-tooltip:after,
    4864 .message-metadata .actions .bp-tooltip:after,
    4865 .single-message-thread-header .actions .bp-tooltip:after {
    4866     left: auto;
    4867     right: 0;
    4868     transform: translate(0, 0);
    4869 }
    4870 
    4871 .bp-invites-content #send-invites-editor .bp-tooltip:after {
    4872     left: 0;
    4873     right: auto;
    48744826}
    48754827

  • trunk/src/bp-templates/bp-nouveau/sass/_nouveau_messages.scss

    r13196 r13709  
    322322            display: table;
    323323        }
     324
     325        .actions .bp-tooltip {
     326
     327            @include bp-tooltip-bottom-right;
     328        }
    324329    }
    325330

  • trunk/src/bp-templates/bp-nouveau/sass/buddypress.scss

    r13485 r13709  
    427427@import "../common-styles/_bp_animations";
    428428
    429 // Import BP Tooltips
    430 
    431 @import "../common-styles/_bp_tooltips";
    432 
    433429/**
    434430*-------------------------------------------------------------------------------
Note: See TracChangeset for help on using the changeset viewer.