Make WordPress Core

Changeset 23901


Ignore:
Timestamp:
04/04/2013 03:49:28 PM (11 years ago)
Author:
markjaquith
Message:

Revisions CSS cleanup.

props ocean90. fixes #23933

Location:
trunk/wp-admin
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/css/colors-classic.css

    r23638 r23901  
    14771477}
    14781478
    1479 #diffsubheader{
     1479.diff-header {
    14801480    background-color: #f7f7f7;
    14811481}
    14821482
    1483 #att-info {
    1484     background-color: #e4f2fd;
     1483#diff-title-to strong {
     1484    color: #0080aa;
     1485}
     1486
     1487.revision-tick.loading-true {
     1488    background-color: #9999cc;
     1489    background: url(../images/wpspin_light.gif) no-repeat;
     1490    background-position: middle;
     1491    background-size: 1px 10px;
     1492}
     1493
     1494.revision-tick.loading-false {
     1495    background-color: #aaa;
    14851496}
    14861497
  • trunk/wp-admin/css/colors-fresh.css

    r23769 r23901  
    13801380}
    13811381
    1382 .diff-to-title {
    1383     color: #0080AA;
    1384 }
    1385 
    1386 #diffsubheader{
     1382#diff-title-to strong {
     1383    color: #0080aa;
     1384}
     1385
     1386.diff-header {
    13871387    background-color: #f7f7f7;
    13881388}
    13891389
    1390 .comparetwo#diffsubheader.diff-left-hand-meta-row {
    1391     background-color: #fcfcfc;
    1392 }
    1393 
    1394 .revision-tick.revision-toloadtrue {
     1390.revision-tick.loading-true {
    13951391    background-color: #9999cc;
    13961392    background: url(../images/wpspin_light.gif) no-repeat;
     
    13991395}
    14001396
    1401 .revision-tick.revision-toloadfalse {
     1397.revision-tick.loading-false {
    14021398    background-color: #aaa;
    1403 }
    1404 
    1405 #att-info {
    1406     background-color: #e4f2Fd;
    14071399}
    14081400
  • trunk/wp-admin/css/wp-admin.css

    r23871 r23901  
    36183618------------------------------------------------------------------------------*/
    36193619
     3620/* Revision meta box */
     3621.post-revisions li img {
     3622    vertical-align: middle;
     3623}
     3624
    36203625table.diff {
    36213626    width: 100%;
     
    36543659}
    36553660
    3656 #revisions-meta-mostrecent,
    3657 #revisions-meta-stored,
    3658 #revisions-meta-oldest,
    3659 #revisions-meta-link {
     3661#revision-diff-container {
     3662    position: relative;
     3663}
     3664
     3665#toogle-revision-compare-mode {
     3666    position: absolute;
     3667    top: 0;
     3668    right: 0;
     3669    padding-top: 15px;
     3670}
     3671
     3672#loading-status {
     3673    position: absolute;
     3674    top: 0;
     3675    right: 170px;
    36603676    line-height: 30px;
    3661     height: 30px;
    3662     vertical-align: middle;
    3663     padding-right: 10px;
    3664 }
    3665 
    3666 #revisions-meta-mostrecent img,
    3667 #revisions-meta-oldest img {
    3668     vertical-align: middle;
    3669 }
    3670 
    3671 .diff-from-title,
    3672 .diff-to-title {
    3673     font-size: 14px;
    3674     font-weight: bold;
    3675     width:60px;
    3676     text-align: right;
    3677     float: left;
    3678     margin-right: 5px;
    3679 }
    3680 
    3681 .revisiondiffcontainer {
    3682     width: 96%;
    3683 }
    3684 
    3685 .revisiondiffcontainer input.button {
    3686     margin: 2px;
    3687 }
    3688 
    3689 #diffnext {
     3677    display: none;
     3678    margin: 9px 0 0;
     3679}
     3680
     3681#loading-status .spinner {
     3682    float: left;
     3683}
     3684
     3685#revision-interact {
     3686    border-bottom: 1px solid #dfdfdf;
     3687    padding: 20px 0;
     3688}
     3689
     3690#diff-next-revision,
     3691#diff-previous-revision {
     3692    margin-top: -.4em; /* Same line as the slider (height: .8em) */
     3693}
     3694
     3695#diff-next-revision {
    36903696    float: right;
    3691     margin-right: 5px;
    3692 }
    3693 
    3694 #diffrestore input{
    3695     margin-left: 10px;
    3696 }
    3697 
    3698 #diffprevious,
    3699 #difftitle,
    3700 #difftitlefrom,
    3701 #diff_from_current_revision {
    3702     float: left;
    3703     margin-left: 5px;
    3704     height: 35px;
    3705 }
    3706 
    3707 #diffprevious,
    3708 #diffnext {
    3709     height: 30px;
    3710 }
    3711 
    3712 #diffheader, #diffsubheader {
    3713     clear: both;
    3714     width: 100%;
    3715 }
    3716 
    3717 #diffheader {
    3718     border-bottom: 1px solid #dfdfdf;
    3719     width: 100%;
    3720     height: 40px;
    3721     line-height: 40px;
    3722     padding-top: 30px;
    3723 }
    3724 
    3725 #diffsubheader,.diff-left-hand-meta-row {
    3726     width: 100%;
    3727     height:35px;
    3728     line-height: 35px;
    3729     display: block;
    3730 }
    3731 
    3732 #diffslider{
     3697}
     3698
     3699#diff-previous-revision {
     3700    float: left;
     3701}
     3702
     3703#diff-slider{
    37333704    width: 70%;
    3734     margin-left: auto;
    3735     margin-right: auto;
    3736     text-align: center;
    3737     height: 0.8em;
    3738     margin-top: 20px;
     3705    margin: 0 auto;
     3706}
     3707
     3708.comparetwo #diff-slider {
     3709    width: 95%;
    37393710}
    37403711
    37413712.diff-slider-ticks-wrapper {
    3742     margin-left: auto;
    3743     margin-right: auto;
     3713    margin: 0 auto;
    37443714    text-align: center;
    37453715}
     
    37473717#diff-slider-ticks {
    37483718    position: absolute;
    3749     margin-top: 50px;
    37503719    z-index: 1;
    3751 }
    3752 
    3753 #revisioncount {
    3754     width: 50%;
    3755     margin-left: auto;
    3756     margin-right: auto;
    3757     margin-top: 0;
    3758     line-height: 1em;
    3759     height: 1em;
    3760     text-align: center;
    3761     clear: none;
    3762     padding: 5px;
    3763 }
    3764 
    3765 .revisiondiffcontainer {
    3766     margin-top: 10px;
    3767 }
    3768 
    3769 #diffsliderwrap {
    3770     width: 80%;
    3771     margin-left: auto;
    3772     margin-right: auto;
    3773 }
    3774 
    3775 #diffsliderwrap #sliderinner {
    3776     position: relative;
    3777     top: 47px;
    3778 }
    3779 
    3780 #removedandadded {
     3720    margin-top: 20px;
     3721}
     3722
     3723.diff-header {
     3724    height: 35px;
     3725    line-height: 35px;
     3726}
     3727
     3728.diff-title {
     3729    float: left;
     3730}
     3731
     3732.diff-title strong {
     3733    font-size: 14px;
     3734    width: 60px;
     3735    text-align: right;
     3736    float: left;
     3737    margin-right: 5px;
     3738}
     3739
     3740.diff-title img {
     3741    vertical-align: middle;
     3742}
     3743
     3744#restore-revision {
     3745    margin-left: 10px;
     3746}
     3747
     3748.diff-col-titles {
     3749    font-size: 16px;
    37813750    width: 100%;
    3782     padding-bottom: 30px;
    3783     padding-top: 3px;
    3784     font-size: 16px;
    3785 }
    3786 
    3787 #removed,
    3788 #added {
     3751    margin: 20px 0 10px;
     3752}
     3753
     3754.diff-col-title-added,
     3755.diff-col-title-removed {
    37893756    width: auto;
    37903757    text-align: left;
    3791     padding-left: 5px;
    3792     padding-right: 5px;
    3793     padding-top: 5px;
    3794     padding-bottom: 5px;
    3795     float: left;
    3796 }
    3797 
    3798 .diffsplit #added {
     3758    float: left;
     3759    width: 48%;
     3760}
     3761
     3762.diff-col-title-added span,
     3763.diff-col-title-removed span {
     3764    padding: .5em;
     3765}
     3766
     3767.diff-col-title-added {
    37993768    float: right;
    3800     width: 47%;
    3801     text-align: left;
    3802 }
    3803 
    3804 .diffsplit #removedandadded {
    3805     width: 100%;
    3806 }
    3807 
    3808 #added {
    3809     padding-left: 10px;
    38103769    color: #00a100;
    38113770}
    38123771
    3813 #removed {
    3814     padding-left: 0px;
     3772.diff-col-title-removed {
    38153773    color: #d2281f;
    38163774}
    38173775
    3818 #comparetworevisions {
    3819     float: right;
    3820     position: absolute;
    3821     top: 10px;
    3822     right: 10px;
    3823     line-height: 35px;
    3824     padding-right: 5px;
    3825 }
    3826 
    3827 #comparetworevisions input {
    3828     margin-right: 2px;
    3829 }
    3830 
    3831 #difftitle img,
    3832 #difftitlefrom img,
    3833 .post-revisions li img {
    3834     vertical-align: middle;
    3835     margin-left: 5px;
    3836 }
    3837 .post-revisions li {
    3838     vertical-align: middle;
    3839     height: 28px;
    3840 }
    3841 
    3842 #showsplitviewoption,
    3843 #toggleshowautosavesoption {
    3844     float: right;
    3845     padding-left: 10px;
    3846     padding-right: 10px;
    3847 }
    3848 
    3849 #revisionoptions {
    3850     margin-top: 0px;
    3851     line-height: 40px;
    3852     clear: both;
    3853     width: 100%;
    3854 }
    3855 
    3856 .comparetwo #diffslider {
    3857     width: 95%;
    3858 }
    3859 
    3860 .comparetwo #diffprevious,
    3861 .comparetwo #diffnext,
    3862 span#diff_left_current_revision,
    3863 #diff_from_current_revision,
    3864 .currentversion span#diff_left_count,
    3865 .currentversion span#diff_left_count_inner,
    3866 .comparetwo.currentversion #diff_from_current_revision,
    3867 #diffsubheader.diff-left-hand-meta-row {
     3776.comparing-two-revisions #diff-previous-revision,
     3777.comparing-two-revisions #diff-next-revision,
     3778#diff-title-from-current-version,
     3779.comparing-two-revisions.current-version #diff-title-from-current-version,
     3780#diff-header-from {
    38683781    display: none;
    38693782}
    38703783
    3871 .currentversion span#diff_left_current_revision,
    3872 span#diff_left_count,
    3873 span#diff_left_count_inner,
    3874 .comparetwo #difftitlefrom,
    3875 .leftmodelloading #modelsloading,
    3876 .rightmodelloading #modelsloading,
    3877 .leftmodelloading #modelsloading .spinner,
    3878 .rightmodelloading #modelsloading .spinner,
    3879 .comparetwo #diffsubheader.diff-left-hand-meta-row {
     3784.comparing-two-revisions #diff-title-from,
     3785.left-model-loading #loading-status,
     3786.right-model-loading #loading-status,
     3787.left-model-loading #loading-status .spinner,
     3788.right-model-loading #loading-status .spinner,
     3789.comparing-two-revisions #diff-header-from {
    38803790    display: block;
    38813791}
     
    38843794    width: 1px;
    38853795    float: left;
    3886     margin-right: 15px;
    3887     height: 11px;
     3796    margin: 1px 15px 0 0;
     3797    height: .8em;
    38883798    padding: 0;
    38893799    margin-left: 0px;
    38903800}
    38913801
    3892 .revision-tick.revision-scopeofchanges-vsmall {
    3893         width: 1px;
    3894         background-color: #aaa;
    3895 }
    3896 
    3897 .revision-tick.revision-scopeofchanges-small {
    3898         width: 2px;
    3899         background-color: #aaa;
    3900         margin-left: -1px;
    3901 }
    3902 
    3903 .revision-tick.revision-scopeofchanges-med {
    3904         width: 3px;
    3905         margin-left: -2px;
    3906         background-color: #666;
    3907 }
    3908 
    3909 .revision-tick.revision-scopeofchanges-large {
    3910         width: 4px;
    3911         margin-left: -3px;
    3912         background-color: #333;
    3913 }
    3914 
    3915 .revision-tick.revision-scopeofchanges-vlarge {
    3916         margin-left: -3px;
    3917         width: 4px;
    3918         background-color: #111;
    3919         left: 1;
     3802.revision-tick.scope-of-changes-vsmall {
     3803    width: 1px;
     3804    background-color: #aaa;
     3805}
     3806
     3807.revision-tick.scope-of-changes-small {
     3808    width: 2px;
     3809    background-color: #aaa;
     3810    margin-left: -1px;
     3811}
     3812
     3813.revision-tick.scope-of-changes-med {
     3814    width: 3px;
     3815    margin-left: -2px;
     3816    background-color: #666;
     3817}
     3818
     3819.revision-tick.scope-of-changes-large {
     3820    width: 4px;
     3821    margin-left: -3px;
     3822    background-color: #333;
     3823}
     3824
     3825.revision-tick.scope-of-changes-vlarge {
     3826    margin-left: -3px;
     3827    width: 4px;
     3828    background-color: #111;
     3829    left: 1;
    39203830}
    39213831
     
    39253835    height: 200px;
    39263836}
    3927 .diff-loading .spinner
    3928 {
     3837
     3838.diff-loading .spinner {
    39293839    clear: both;
    39303840    margin-left: auto;
     
    39343844}
    39353845
    3936 #modelsloading {
    3937     float: right;
    3938     position: absolute;
    3939     line-height: 30px;
    3940     display: none;
    3941     clear: none;
    3942     right: 170px;
    3943     margin-top: -40px;
    3944 }
    3945 
    3946 #modelsloading .spinner {
    3947     float: left;
    3948 }
    3949 
    39503846.ui-tooltip-content img {
    39513847    float: left;
    39523848    margin-right: 5px;
    39533849}
    3954 
    39553850
    39563851
     
    39863881    bottom: -16px;
    39873882    z-index: 99999;
    3988 
    39893883}
    39903884
  • trunk/wp-admin/js/revisions.js

    r23898 r23901  
    117117        startLeftModelLoading: function() {
    118118            this.leftModelLoading = true;
    119             $('.revisiondiffcontainer').addClass('leftmodelloading');
     119            $('#revision-diff-container').addClass('left-model-loading');
    120120        },
    121121
     
    126126        startRightModelLoading: function() {
    127127            this.rightModelLoading = true;
    128             $('.revisiondiffcontainer').addClass('rightmodelloading');
     128            $('#revision-diff-container').addClass('right-model-loading');
    129129        },
    130130
     
    134134
    135135        stopModelLoadingSpinner: function() {
    136             $('.revisiondiffcontainer').removeClass('rightmodelloading');
    137             $('.revisiondiffcontainer').removeClass('leftmodelloading');
     136            $('#revision-diff-container').removeClass('right-model-loading');
     137            $('#revision-diff-container').removeClass('left-model-loading');
    138138        },
    139139
     
    280280     */
    281281    revisions.view.Slider = Backbone.View.extend({
    282         el: $( '#slider' ),
     282        el: $( '#diff-slider' ),
    283283        singleRevision: true,
    284284
     
    315315
    316316                if ( 0 === Diff.leftDiff ) {
    317                     $( '.revisiondiffcontainer' ).addClass( 'currentversion' );
     317                    $( '#revision-diff-container' ).addClass( 'currentversion' );
    318318                } else {
    319                     $( '.revisiondiffcontainer' ).removeClass( 'currentversion' );
     319                    $( '#revision-diff-container' ).removeClass( 'currentversion' );
    320320                }
    321321
     
    381381
    382382        addTooltip: function( handle, message ) {
    383 
    384383            handle.attr( 'title', '' ).tooltip({
    385384                track: false,
     
    407406
    408407        width: function() {
    409             return $( '#slider' ).width();
     408            return $( '#diff-slider' ).width();
    410409        },
    411410
    412411        setWidth: function( width ) {
    413             return $( '#slider' ).width( width );
     412            return $( '#diff-slider' ).width( width );
    414413        },
    415414
    416415        refresh: function( options, slide ) {
    417             $( '#slider' ).slider( 'option', options );
     416            $( '#diff-slider' ).slider( 'option', options );
    418417
    419418            // Triggers the slide event
    420419            if ( slide )
    421                 $( '#slider' ).trigger( 'slide' );
     420                $( '#diff-slider' ).trigger( 'slide' );
    422421        },
    423422
    424423        option: function( key ) {
    425             return $( '#slider' ).slider( 'option', key );
     424            return $( '#diff-slider' ).slider( 'option', key );
    426425        },
    427426
     
    429428            var self = this;
    430429            // this.$el doesn't work, why?
    431             $( '#slider' ).slider( {
     430            $( '#diff-slider' ).slider( {
    432431                slide: $.proxy( self.slide, self ),
    433432                start: $.proxy( self.start, self ),
     
    466465            Diff.slider.setWidth( sliderWidth );
    467466            $( '.diff-slider-ticks-wrapper' ).width( sliderWidth );
    468             $( '#diffslider' ).width( sliderWidth );
    469467            $( '#diff-slider-ticks' ).width( sliderWidth );
    470468
     
    508506    // TODO: Change Interact to something else.
    509507    revisions.view.Interact = Backbone.View.extend({
    510         el: $('#backbonerevisionsinteract'),
    511         template: wp.template('revision-interact'),
     508        el: $( '#revision-interact' ),
     509        template: wp.template( 'revision-interact' ),
    512510
    513511        // next and previous buttons, only available in compare one mode
     
    518516
    519517        render: function() {
    520             var self = this;
    521 
    522             var addHtml = this.template;
    523             this.$el.html( addHtml );
     518            this.$el.html( this.template );
    524519
    525520            var modelcount = Diff.revisions.length;
     
    535530                });
    536531
    537                 $( '.revisiondiffcontainer' ).removeClass( 'comparetwo' );
     532                $( '#revision-diff-container' ).removeClass( 'comparing-two-revisions' );
    538533
    539534            } else {
     
    545540                });
    546541
    547                 $( '.revisiondiffcontainer' ).addClass( 'comparetwo' );
    548                 $( '#diffslider a.ui-slider-handle' ).first().addClass( 'left-handle' );
    549                 $( '#diffslider a.ui-slider-handle' ).last().addClass( 'right-handle' );
     542                $( '#revision-diff-container' ).addClass( 'comparing-two-revisions' );
     543                $( '#diff-slider a.ui-slider-handle' ).first().addClass( 'left-handle' );
     544                $( '#diff-slider a.ui-slider-handle' ).last().addClass( 'right-handle' );
    550545
    551546            }
     
    585580     */
    586581    revisions.view.Diff = Backbone.View.extend({
    587         el: $('#backbonerevisionsdiff'),
    588         template: wp.template('revision'),
     582        el: $( '#revisions-diff' ),
     583        template: wp.template( 'revisions-diff' ),
    589584        draggingLeft: false,
    590585
    591586        // the compare two button is in this view, add the interaction here
    592587        events: {
    593             'click #comparetwo': 'compareTwo',
    594             'click #restore':    'restore'
     588            'click #compare-two-revisions': 'compareTwo',
     589            'click #restore-revision':      'restore'
    595590        },
    596591
     
    614609                }
    615610            } else { // end compare two revisions mode, eg only one slider handle
    616                 this.comparetwochecked = '';
    617611                if ( this.model.at( Diff.rightDiff - 1 ) ) {
    618612                    addHtml = this.template( this.model.at( Diff.rightDiff - 1 ).toJSON() );
     
    622616
    623617            if ( this.model.length < 2 ) {
    624                 $( '#diffslider' ).hide(); // don't allow compare two if fewer than three revisions
     618                $( '#diff-slider' ).hide(); // don't allow compare two if fewer than three revisions
    625619                $( '.diff-slider-ticks-wrapper' ).hide();
    626620            }
     
    641635            // hide the restore button when on the last sport/current post data
    642636            if ( Diff.rightDiff === Diff.revisions.length ){
    643                 $( '#restore' ).hide();
     637                $( '#restore-revision' ).hide();
    644638            } else {
    645                 $( '#restore' ).show();
     639                $( '#restore-revision' ).show();
    646640            }
    647641
     
    652646            // don't allow compare two if fewer than three revisions
    653647            if ( this.model.length < 3 )
    654                 $( '#comparetworevisions' ).hide();
    655 
    656             $( '#comparetwo' ).prop( 'checked', ! Diff.singleRevision );
     648                $( '#toogle-revision-compare-mode' ).hide();
     649
     650            $( '#compare-two-revisions' ).prop( 'checked', ! Diff.singleRevision );
    657651        },
    658652
    659653        // turn on/off the compare two mode
    660654        compareTwo: function() {
    661             if ( $( 'input#comparetwo' ).is( ':checked' ) ) { // compare 2 mode
     655            if ( $( '#compare-two-revisions' ).is( ':checked' ) ) { // compare 2 mode
    662656                Diff.singleRevision = false ;
    663657
  • trunk/wp-admin/revision.php

    r23898 r23901  
    7676else
    7777    $parent_file = $submenu_file = 'edit.php';
     78
    7879wp_enqueue_script( 'revisions' );
    79 
    80 require_once( './admin-header.php' );
    8180
    8281$strings = array(
     
    9291
    9392$strings['settings'] = $settings;
    94 
    9593wp_localize_script( 'revisions', 'wpRevisionsL10n', $strings );
    9694
    97 $comparetworevisionslink = get_edit_post_link( $revision->ID );
     95require_once( './admin-header.php' );
     96
    9897?>
    9998
    100 <div id="backbonerevisionsoptions">
    101 </div>
    10299<div class="wrap">
    103     <div class="icon32 icon32-posts-post" id="icon-edit">
    104         <br>
    105     </div>
    106     <div class="revisiondiffcontainer diffsplit currentversion rightmodelloading">
    107         <div id="modelsloading" class="updated message">
     100    <?php screen_icon(); ?>
     101    <div id="revision-diff-container" class="current-version right-model-loading">
     102        <div id="loading-status" class="updated message">
    108103            <span class="spinner" ></span> <?php _e( 'Calculating revision diffs' ); ?>
    109104        </div>
     105
    110106        <h2 class="long-header"><?php echo $h2; ?></h2>
     107
    111108        <div class="diff-slider-ticks-wrapper">
    112             <div id="diff-slider-ticks">
    113             </div>
     109            <div id="diff-slider-ticks"></div>
    114110        </div>
    115         <div id="backbonerevisionsinteract">
    116         </div>
    117         <div id="backbonerevisionsdiff">
    118         </div>
     111
     112        <div id="revision-interact"></div>
     113
     114        <div id="revisions-diff"></div>
    119115    </div>
    120116</div>
    121117
    122 <script id="tmpl-revision" type="text/html">
    123     <div id="comparetworevisions">
     118<script id="tmpl-revisions-diff" type="text/html">
     119    <div id="toogle-revision-compare-mode">
    124120        <label>
    125             <input type="checkbox" id="comparetwo" />
     121            <input type="checkbox" id="compare-two-revisions" />
    126122            <?php esc_attr_e( 'Compare two revisions' ); ?>
    127123        </label>
    128124    </div>
    129125
    130     <div id="diffsubheader" class="diff-left-hand-meta-row">
    131         <div id="diff_from_current_revision">
    132             <?php printf( '<b>%1$s</b> %2$s.' , __( 'From:' ), __( 'the current version' ) ); ?>
     126    <div id="diff-header-from" class="diff-header">
     127        <div id="diff-title-from-current-version" class="diff-title">
     128            <?php printf( '<strong>%1$s</strong> %2$s.' , __( 'From:' ), __( 'the current version' ) ); ?>
    133129        </div>
    134         <div id="difftitlefrom">
    135             <div class="diff-from-title"><?php _e( 'From:' ); ?></div>{{{ data.titleFrom }}}
     130
     131        <div id="diff-title-from" class="diff-title">
     132            <strong><?php _e( 'From:' ); ?></strong> {{{ data.titleFrom }}}
    136133        </div>
    137134    </div>
    138135
    139     <div id="diffsubheader">
    140         <div id="difftitle">
    141             <div class="diff-to-title"><?php _e( 'To:' ); ?></div>{{{ data.titleTo }}}
     136    <div id="diff-header-to" class="diff-header">
     137        <div id="diff-title-to" class="diff-title">
     138            <strong><?php _e( 'To:' ); ?></strong> {{{ data.titleTo }}}
    142139        </div>
    143         <div id="diffrestore">
    144             <input class="button button-primary" data-restore-link="{{{ data.restoreLink }}}" type="button" id="restore" value="<?php esc_attr_e( 'Restore This Revision' )?>" />
    145         </div>
     140
     141        <input type="button" id="restore-revision" class="button button-primary" data-restore-link="{{{ data.restoreLink }}}" value="<?php esc_attr_e( 'Restore This Revision' )?>" />
    146142    </div>
    147143
    148     <div id="removedandadded">
    149         <div id="removed"><?php _e( 'Removed -' ); ?></div>
    150         <div id="added"><?php _e( 'Added +' ); ?></div>
     144    <div class="diff-col-titles">
     145        <div class="diff-col-title-removed"><span><?php _e( 'Removed -' ); ?></span></div>
     146        <div class="diff-col-title-added"><span><?php _e( 'Added +' ); ?></span></div>
     147        <div class="clear"></div>
    151148    </div
     149
    152150    <div>{{{ data.diff }}}</div>
    153151</script>
    154152
    155153<script id="tmpl-revision-interact" type="text/html">
    156     <div id="diffheader">
    157         <div id="diffprevious"><input class="button" type="submit" id="previous" value="<?php esc_attr_e( 'Previous' ); ?>" />
    158         </div>
    159         <div id="diffnext"><input class="button" type="submit" id="next" value="<?php esc_attr_e( 'Next' ); ?>" />
    160         </div>
    161         <div id="diffslider">
    162             <div id="slider" class="wp-slider">
    163             </div>
    164         </div>
     154    <div id="diff-previous-revision">
     155        <input class="button" type="button" id="previous" value="<?php esc_attr_e( 'Previous' ); ?>" />
    165156    </div>
     157
     158    <div id="diff-next-revision">
     159        <input class="button" type="button" id="next" value="<?php esc_attr_e( 'Next' ); ?>" />
     160    </div>
     161
     162    <div id="diff-slider" class="wp-slider"></div>
    166163</script>
    167164
    168165<script id="tmpl-revision-ticks" type="text/html">
    169     <div class="revision-tick revision-toload{{{ data.revision_toload }}} revision-scopeofchanges-{{{ data.scope_of_changes }}}">
    170     </div>
     166    <div class="revision-tick loading-{{{ data.revision_toload }}} scope-of-changes-{{{ data.scope_of_changes }}}"></div>
    171167</script>
    172168<?php
Note: See TracChangeset for help on using the changeset viewer.