Make WordPress Core

Changeset 24768


Ignore:
Timestamp:
07/22/2013 09:09:49 PM (11 years ago)
Author:
markjaquith
Message:

Revisions: tweak how tickmarks are rendered, to play nice with browsers who always round subpixel values down (Safari, Opera).

Also, some IE tweaks.

Fixes #24736. Props adamsilverstein, markjaquith, ocean90.

Location:
trunk/wp-admin
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/css/wp-admin-rtl.css

    r24761 r24768  
    10311031.revisions-tooltip {
    10321032    margin-left: 0;
    1033     margin-right: -70px;
     1033    margin-right: -69px;
    10341034}
    10351035
     
    10411041.ie8 .revisions-tooltip {
    10421042    margin-right: -75px;
     1043}
     1044
     1045.ie8 .revisions-tooltip.flipped {
     1046    margin-left: -63px;
    10431047}
    10441048
     
    10631067    right: auto;
    10641068    left: 20px;
     1069}
     1070
     1071.ie8 .revisions-tooltip-arrow > span {
     1072    right: 21px;
    10651073}
    10661074
  • trunk/wp-admin/css/wp-admin.css

    r24761 r24768  
    35403540    height: 0.8em;
    35413541    top: 7px;
    3542     width: 100%;
    3543     padding: 0 15%;
     3542    width: 70%;
    35443543    -moz-box-sizing: border-box;
    35453544    -webkit-box-sizing: border-box;
     
    35483547
    35493548.revisions-tickmarks > div {
    3550     position: relative;
     3549    position: absolute;
    35513550    height: 100%;
    3552     float: left;
    35533551    border-style: solid;
    35543552    border-width: 0 1px 0 0;
     
    35583556}
    35593557
    3560 .revisions-tickmarks > div:last-child {
     3558.revisions-tickmarks > div:first-child {
    35613559    border-width: 0;
    35623560}
     
    37653763    bottom: 105px;
    37663764    margin-right: 0;
    3767     margin-left: -70px;
     3765    margin-left: -69px;
    37683766    z-index: 1;
    37693767    max-width: 350px;
     
    38253823
    38263824.ie8 .revisions-tooltip-arrow > span {
    3827     left: 14px;
     3825    left: 15px;
    38283826    top: -25px;
    38293827    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476)";
     3828}
     3829
     3830.ie8 .revisions-tooltip.flipped .revisions-tooltip-arrow > span {
     3831    right: 25px;
    38303832}
    38313833
  • trunk/wp-admin/js/revisions.js

    r24761 r24768  
    616616    revisions.view.Tickmarks = wp.Backbone.View.extend({
    617617        className: 'revisions-tickmarks',
     618        direction: isRtl ? 'right' : 'left',
    618619
    619620        initialize: function() {
     
    622623
    623624        reportTickPosition: function( model, revision ) {
    624             var elWidth, offset, tick, index = this.model.revisions.indexOf( revision );
     625            var offset, thisOffset, parentOffset, tick, index = this.model.revisions.indexOf( revision );
     626            thisOffset = this.$el.allOffsets();
     627            parentOffset = this.$el.parent().allOffsets();
    625628            if ( index === this.model.revisions.length - 1 ) {
    626629                // Last one
    627                 tick = this.$('div:nth-of-type(' + index + ')');
    628                 offset = tick.allPositions();
    629                 elWidth = tick.outerWidth();
    630                 _.extend( offset, {
    631                     rightPlusWidth: offset.right,
    632                     leftPlusWidth: offset.left
    633                 });
     630                offset = {
     631                    rightPlusWidth: thisOffset.left - parentOffset.left + 1,
     632                    leftPlusWidth: thisOffset.right - parentOffset.right + 1
     633                };
    634634            } else {
    635635                // Normal tick
     
    637637                offset = tick.allPositions();
    638638                _.extend( offset, {
    639                     leftPlusWidth: offset.left + tick.outerWidth() + 1,
    640                     rightPlusWidth: offset.right + tick.outerWidth() + 1
     639                    left: offset.left + thisOffset.left - parentOffset.left,
     640                    right: offset.right + thisOffset.right - parentOffset.right
     641                });
     642                _.extend( offset, {
     643                    leftPlusWidth: offset.left + tick.outerWidth(),
     644                    rightPlusWidth: offset.right + tick.outerWidth()
    641645                });
    642646            }
     
    649653            tickWidth = 1 / tickCount;
    650654
    651             _(tickCount).times( function(){ this.$el.append( '<div></div>' ); }, this );
    652 
    653             this.$('div').css( 'width', ( 100 * tickWidth ) + '%' );
     655            _(tickCount).times( function( index ){
     656                this.$el.append( '<div style="' + this.direction + ': ' + ( 100 * tickWidth * index ) + '%"></div>' ); }, this );
    654657        }
    655658    });
Note: See TracChangeset for help on using the changeset viewer.