Make WordPress Core

Ticket #24736: 24736.7b.patch

File 24736.7b.patch, 8.1 KB (added by adamsilverstein, 11 years ago)

put tootltips inside centered 70% div that matches slider

  • wp-admin/js/revisions.js

     
    452452                render: function() {
    453453                        wp.Backbone.View.prototype.render.apply( this, arguments );
    454454
     455                        $('html').css( 'overflow-y', 'scroll' );
    455456                        $('#wpbody-content .wrap').append( this.el );
    456457                        this.updateCompareTwoMode();
    457458                        this.renderDiff( this.model.diff() );
     
    532533                        tickCount = this.model.revisions.length - 1;
    533534                        tickWidth = 1 / tickCount;
    534535
    535                         _(tickCount).times( function(){ this.$el.append( '<div></div>' ); }, this );
     536                        _(tickCount - 1).times( function(){ this.$el.append( '<div></div>' ); }, this );
     537
    536538                        this.$('div').css( 'width', ( 100 * tickWidth ) + '%' );
    537539                }
    538540        });
     
    627629
    628630                        // Set the position.
    629631                        offset = this.model.revisions.indexOf( this.model.get('revision') ) / ( this.model.revisions.length - 1 );
    630                         // 15% to get us to the start of the slider
    631                         // 0.7 to convert the slider-relative percentage to a page-relative percentage
    632                         // 100 to convert to a percentage
    633                         offset = 15 + (0.7 * offset * 100 ); // Now in a percentage
    634                         this.$el.css( isRtl ? 'right' : 'left', offset + '%' );
     632
     633                        offset = ( offset * 100 ); // Now in a percentage
     634                        this.$el.children(0).css( isRtl ? 'right' : 'left', offset + '%' );
    635635                }
    636636        });
    637637
  • wp-admin/revision.php

     
    131131</script>
    132132
    133133<script id="tmpl-revisions-tooltip" type="text/html">
    134         <div class="revisions-tooltip-content">
    135         <# if ( 'undefined' !== typeof data && 'undefined' !== typeof data.author ) { #>
    136                         {{{ data.author.avatar }}} {{{ data.author.name }}},
    137                         {{{ data.timeAgo }}}
    138                         ({{{ data.dateShort }}})
    139         <# } #>
     134        <div class="revisions-tooltip-inner">
     135                <div class="revisions-tooltip-content">
     136                <# if ( 'undefined' !== typeof data && 'undefined' !== typeof data.author ) { #>
     137                                {{{ data.author.avatar }}} {{{ data.author.name }}},
     138                                {{{ data.timeAgo }}}
     139                                ({{{ data.dateShort }}})
     140                <# } #>
     141                </div>
     142                <div class="revisions-tooltip-arrow"><span></span></div>
    140143        </div>
    141         <div class="revisions-tooltip-arrow"></div>
    142144</script>
    143145
    144146<script id="tmpl-revisions-checkbox" type="text/html">
  • wp-admin/css/ie.css

     
    630630* html #adminmenu div.wp-menu-image {
    631631        height: 29px;
    632632}
     633
     634/* Revisions */
     635.revisions-tooltip-arrow span {
     636        left: 25px;
     637        top: -24px;
     638        filter: progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476); /* IE7 */
     639}
     640
     641.revisions-controls .revisions-tickmarks > div {
     642        margin-right: -1px;
     643        border-width: 0 0 0 0;
     644                border-style: none;
     645}
     646 No newline at end of file
  • wp-admin/css/colors-fresh.css

     
    13791379        border: 1px solid #dfdfdf;
    13801380}
    13811381
    1382 .revisions-tooltip,
    1383 .revisions-tooltip-arrow:after {
     1382.revisions-tooltip > div,
     1383.revisions-tooltip-arrow span {
    13841384        border-color: #d7d7d7;
    13851385        background-color: #fff;
    13861386}
  • wp-admin/css/wp-admin-rtl.css

     
    10241024        margin: 5px 0 0 5px;
    10251025}
    10261026
     1027.revisions-tooltip-inner {
     1028        margin-right: -62px;
     1029        margin-left: 0;
     1030}
     1031
    10271032.revisions-tooltip {
    1028         margin-right: -73px;
    1029         margin-left: 0;
    10301033        -webkit-transition: right 15ms;
    10311034        -moz-transition:    right 15ms;
    10321035        -ms-transition:     right 15ms;
     
    10371040.revisions-tooltip-arrow {
    10381041        right: 0;
    10391042        margin-left: 0;
    1040         margin-right: 35px;
     1043        margin-right: 25px;
    10411044}
    10421045
    10431046.revisions-tooltip-image {
  • wp-admin/css/wp-admin.css

     
    35003500/*------------------------------------------------------------------------------
    35013501  11.2 - Post Revisions
    35023502------------------------------------------------------------------------------*/
    3503 body.revision-php {
    3504         overflow-y: scroll; /* Force a scrollbar, so centering doesn't jump */
    3505 }
    3506 
    35073503.revisions-control-frame,
    35083504.revisions-diff-frame {
    35093505        position: relative;
     
    35203516        vertical-align: text-bottom;
    35213517}
    35223518
     3519.revisions-tooltip,
    35233520.revisions-tickmarks {
    35243521        position: relative;
    3525         margin: 0 auto 0;
    3526         height: 0.8em;
    3527         z-index: 2;
    3528         top: 7px;
     3522        margin: 0 auto;
    35293523        width: 70%;
    35303524        -moz-box-sizing: border-box;
    35313525        -webkit-box-sizing: border-box;
    3532         -ms-box-sizing: border-box; /* ie8 only */
    35333526        box-sizing: border-box;
    35343527}
    35353528
     3529.revisions-tooltip {
     3530        top: -5px;
     3531        -webkit-transition: left 15ms;
     3532        -moz-transition:    left 15ms;
     3533        -ms-transition:     left 15ms;
     3534        -o-transition:      left 15ms;
     3535        transition:         left 15ms;
     3536}
     3537
     3538.revisions-tickmarks {
     3539        height: 0.8em;
     3540        z-index: 2;
     3541        top: 7px;
     3542}
     3543
    35363544.revisions-tickmarks > div {
    35373545        position: relative;
    35383546        height: 100%;
    35393547        float: left;
    35403548        z-index: 10002;
    35413549        border-style: solid;
    3542         border-width: 0 0 0 1px;
     3550        border-width: 0 1px 0 0;
    35433551        -moz-box-sizing: border-box;
    35443552        -webkit-box-sizing: border-box;
    3545         -ms-box-sizing: border-box; /* ie8 only */
    35463553        box-sizing: border-box;
    35473554}
    35483555
    3549 .revisions-tickmarks > div:first-of-type {
    3550         border-left-width: 0;
    3551 }
    3552 
    35533556.comparing-two-revisions .revisions-controls {
    35543557        height: 140px;
    35553558}
     
    35593562        text-align: center;
    35603563        vertical-align: middle;
    35613564        opacity: 0;
     3565        filter: alpha(opacity=0);
    35623566        margin: 0 auto;
    35633567        width: 100%;
    35643568        height: 32px;
     
    35693573        -ms-transition:     opacity 0.5s;
    35703574        -o-transition:      opacity 0.5s;
    35713575        transition:         opacity 0.5s;
     3576        filter: alpha(opacity=0); /* ie8 and earlier */
    35723577}
    35733578
    35743579.revisions.loading .loading-indicator {
    35753580        opacity: 1;
     3581        filter: alpha(opacity=100); /* ie8 and earlier */
    35763582}
    35773583
    35783584.revisions .diff {
     
    35853591
    35863592.revisions.loading .diff {
    35873593        opacity: 0.5;
     3594        filter: alpha(opacity=50); /* ie8 and earlier */
    35883595}
    35893596
    35903597.revisions-meta {
     
    36123619
    36133620.wp-slider {
    36143621        width: 70%;
    3615         margin: 0 auto 0;
     3622        margin: 0 auto;
    36163623        top: -3px;
    36173624}
    36183625
     
    37043711        display: block;
    37053712}
    37063713
    3707 .revisions-tooltip {
     3714.revisions-tooltip-inner {
    37083715        position: absolute;
    3709         bottom: 105px;
    3710         margin-left: -69px;
     3716        bottom: 0px;
     3717        margin-left: -70px;
    37113718        line-height: 28px;
    37123719        z-index: 9999;
    37133720        max-width: 350px;
    3714         min-width: 130px;
     3721        min-width: 220px;
    37153722        padding: 4px;
    3716         display: none;
    3717         opacity: 0;
    3718         -webkit-transition: left 15ms;
    3719         -moz-transition:    left 15ms;
    3720         -ms-transition:     left 15ms;
    3721         -o-transition:      left 15ms;
    3722         transition:         left 15ms;
     3723        display: block;
     3724        opacity: 1;
    37233725}
    37243726
    3725 .comparing-two-revisions .revisions-tooltip {
    3726         bottom: 145px;
    3727 }
    3728 
    37293727.revisions-tooltip img {
    37303728        float: left;
    37313729        margin: 2px 5px 0 0;
     
    37443742        z-index: 10000;
    37453743}
    37463744
    3747 .revisions-tooltip-arrow:after {
     3745.revisions-tooltip-arrow > span {
    37483746        content: "";
    37493747        position: absolute;
    37503748        left: 20px;
     
    37583756        tranform: rotate(45deg);
    37593757}
    37603758
    3761 .revisions-tooltip,
    3762 .revisions-tooltip-arrow:after {
     3759.ie8 .revisions-tooltip-arrow > span {
     3760        left: 14px;
     3761        top: -25px;
     3762        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476)"; /* IE8 */
     3763}
     3764
     3765.revisions-tooltip > div,
     3766.revisions-tooltip-arrow > span {
    37633767        border-width: 1px;
    37643768        border-style: solid;
    37653769}
  • wp-admin/css/colors-classic.css

     
    14861486}
    14871487
    14881488.revisions-tooltip,
    1489 .revisions-tooltip-arrow:after {
     1489.revisions-tooltip-arrow span {
    14901490        border-color: #d1e5ee;
    14911491        background-color: #fff;
    14921492}