Make WordPress Core

Ticket #24736: 24736.21.patch

File 24736.21.patch, 4.1 KB (added by adamsilverstein, 11 years ago)

adjust ie8 rtl tooltip position

  • wp-admin/js/revisions.js

     
    2828        $.fn.allPositions = function() {
    2929                var position = this.position() || {top: 0, left: 0}, parent = this.parent();
    3030                return _.extend( position, {
    31                         right:  parent.outerWidth()  - position.left - this.outerWidth(),
     31                        right:  parent.offset().left + parent.outerWidth() - position.left - 1,
    3232                        bottom: parent.outerHeight() - position.top  - this.outerHeight()
    3333                });
    3434        };
     
    580580        // The tickmarks view
    581581        revisions.view.Tickmarks = wp.Backbone.View.extend({
    582582                className: 'revisions-tickmarks',
     583                direction: isRtl ? 'right' : 'left',
    583584
    584585                initialize: function() {
    585586                        this.listenTo( this.model, 'change:revision', this.reportTickPosition );
    586587                },
    587588
    588589                reportTickPosition: function( model, revision ) {
    589                         var elWidth, offset, tick, index = this.model.revisions.indexOf( revision );
     590                        var offset, tick, index = this.model.revisions.indexOf( revision ),
     591                                divOffset = this.$el.offset();
    590592                        if ( index === this.model.revisions.length - 1 ) {
    591593                                // Last one
    592                                 tick = this.$('div:nth-of-type(' + index + ')');
     594                                tick = this.$('div:nth-of-type(' + ( index ) + ')');
    593595                                offset = tick.allPositions();
    594                                 elWidth = tick.outerWidth();
    595                                 // adjust
     596
     597                                // Adjust
    596598                                _.extend( offset, {
    597                                         right: offset.right + elWidth + 1,
    598                                         left: offset.left + elWidth + 1
    599                                 });
     599                                        left: this.$el.offset().left + this.$el.width() - this.$el.parent().offset().left - 1,
     600                                        right: this.$el.offset().left + this.$el.width()
     601                                } );
    600602                        } else {
    601603                                // Normal tick
    602604                                tick = this.$('div:nth-of-type(' + (index + 1) + ')');
    603605                                offset = tick.allPositions();
     606                                _.extend( offset, {
     607                                        left: offset.left + this.$el.offset().left - this.$el.parent().offset().left
     608                                } );
     609
    604610                        }
    605611                        this.model.set({ offset: offset });
    606612                },
     
    610616                        tickCount = this.model.revisions.length - 1;
    611617                        tickWidth = 1 / tickCount;
    612618
    613                         _(tickCount).times( function(){ this.$el.append( '<div></div>' ); }, this );
     619                        _(tickCount).times( function( index ) {
     620                                this.$el.append( '<div style="' + this.direction + ': ' + ( 100 * tickWidth * index ) + '%;"></div>' );
     621                        }, this );
    614622
    615                         this.$('div').css( 'width', ( 100 * tickWidth ) + '%' );
    616623                }
    617624        });
    618625
  • wp-admin/css/wp-admin-rtl.css

     
    10261026
    10271027.revisions-tooltip {
    10281028        margin-left: 0;
    1029         margin-right: -70px;
     1029        margin-right: -84px;
    10301030        -webkit-transition: right 15ms;
    10311031        -moz-transition:    right 15ms;
    10321032        -ms-transition:     right 15ms;
     
    10351035}
    10361036
    10371037.ie8 .revisions-tooltip {
    1038         margin-right: -75px;
     1038        margin-right: -90px;
    10391039}
    10401040
    10411041.revisions-tooltip-arrow {
  • wp-admin/css/wp-admin.css

     
    35273527        vertical-align: text-bottom;
    35283528}
    35293529
    3530 .revisions-tickmarks {
     3530.revisions-tickmarks,
     3531.revisions-tooltip-container {
    35313532        position: relative;
    35323533        margin: 0 auto;
    35333534        height: 0.8em;
    35343535        top: 7px;
    3535         width: 100%;
    3536         padding: 0 15%;
     3536        width: 70%;
     3537        padding: 0;
    35373538        -moz-box-sizing: border-box;
    35383539        -webkit-box-sizing: border-box;
    35393540        box-sizing: border-box;
    35403541}
    35413542
    35423543.revisions-tickmarks > div {
    3543         position: relative;
     3544        position: absolute;
    35443545        height: 100%;
    3545         float: left;
    35463546        border-style: solid;
    35473547        border-width: 0 1px 0 0;
    35483548        -moz-box-sizing: border-box;
     
    35503550        box-sizing: border-box;
    35513551}
    35523552
    3553 .revisions-tickmarks > div:last-child {
    3554         border-width: 0;
    3555 }
    3556 
    35573553.comparing-two-revisions .revisions-controls {
    35583554        height: 140px;
    35593555}
     
    37373733
    37383734.revisions-tooltip {
    37393735        position: absolute;
    3740         bottom: 105px;
     3736        bottom: 104px;
    37413737        margin-right: 0;
    3742         margin-left: -70px;
     3738        margin-left: -69px;
    37433739        line-height: 28px;
    37443740        z-index: 1;
    3745         max-width: 350px;
     3741        max-width: 250px;
    37463742        min-width: 130px;
    37473743        padding: 4px;
    37483744        display: none;