WordPress.org
Get WordPress

Make WordPress Core

Changeset 24119


Ignore:
Timestamp:
04/28/2013 10:56:57 AM (12 years ago)
Author:
ocean90
Message:

Revisions UI update:

  • Style status loading as a regular update message like on the other screens
  • Move compare two checkbox to diff header to avoid an overlap on long post titles
  • Restore color shades for the scope of changes visualisation
  • Show tooltips while moving the slider handle
  • Diff header styling
  • Move color declarations to classic/fresh stylesheets
  • Sync admin color stylesheets

props jrbeilke for initial patch. see #23935.

Location:
trunk/wp-admin
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/wp-admin/css/colors-classic.css

    r24098 r24119  
    165165}
    166166
     167#diff-header,
    167168.post-format-options,
    168169.widget .widget-top,
    … …  
    14781479}
    14791480
    1480 .diff-header {
    1481     background-color: #f7f7f7;
     1481#diff-header {
     1482    border: 1px solid #d1e5ee;
     1483}
     1484
     1485#diff-slider .ui-slider-tooltip {
     1486    border-color: #d1e5ee;
     1487    background-color: #fff;
    14821488}
    14831489
    14841490#diff-title-to strong {
    1485     color: #0080aa;
     1491    color: #08a;
    14861492}
    14871493
    … …  
    14931499}
    14941500
    1495 .revision-tick.completed-true {
     1501.revision-tick.completed-false {
     1502    background-image: none;
     1503}
     1504
     1505.revision-tick.scope-of-changes-vsmall {
    14961506    background-color: #d1e5ee;
     1507}
     1508
     1509.revision-tick.scope-of-changes-small {
     1510    background-color: #b4d5e3;
     1511}
     1512
     1513.revision-tick.scope-of-changes-med {
     1514    background-color: #98c5d9;
     1515}
     1516
     1517.revision-tick.scope-of-changes-large {
     1518    background-color: #7bb4ce;
     1519}
     1520
     1521.revision-tick.scope-of-changes-vlarge {
     1522    background-color: #5ea4c4;
    14971523}
    14981524
    … …  
    15081534
    15091535.wp-slider .ui-slider-handle {
    1510     border-color: #acd;
    1511     background: #f4f9fc;
    1512     background-image: -webkit-gradient(linear, left bottom, left top, from(#f4f9fc), to(#fff));
    1513     background-image: -webkit-linear-gradient(bottom, #f4f9fc, #fff);
    1514     background-image:    -moz-linear-gradient(bottom, #f4f9fc, #fff);
    1515     background-image:      -o-linear-gradient(bottom, #f4f9fc, #fff);
    1516     background-image: linear-gradient(to top, #f4f9fc, #fff);
     1536    color: #333;
     1537    border-color: none;
     1538}
     1539
     1540.wp-slider .ui-slider-handle.left-handle {
     1541    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAABAlBMVEXR2uHM1dzCzNW4ydOzxtSxw9Gqwc+bs7+Ss8SVscaZrLqQq7yNrMCKqr+EqsGDqb6GpruCpbl8pL15o7t1n7hwnLVika1djq5giqJXiqlYiqNJgp9ieYlDfqA/epw3dpk7dpg2dpo3dZo6dZc4dJY4dJg3cZY2bpE1bosxaIYxZIMrYX0tXnwtXHYsWHEnVW0mTmglT2cjTGIhRVsfQlYaN0kYM0QULDgTKTYRJzQTJzINISoLHCYNGyYKGCEIFxwJEhcJEhsHEhQDDAkHCg8EBwwCBwoEBAQBAwIBAQEBAQMAAgEBAAAAAAQAAQMBAAIAAAICAAEBAQAAAQAAAAD///+62qV+AAAAVnRSTlP/////////////////////////////////////////////////////////////////////////////////////////////////////////////////AEpNbNkAAAAJcEhZcwAACusAAArrAYKLDVoAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACbSURBVBiVVcvVDoNQEEXRqbu781B3d/dQQknh/P+vtBQKt/tpsnKGEOW4klkQFFvIsqwYzUJUvCts1wJl9gIruxT5hpLEyMBLKG+Z0ToJgrPLTDqOjyCxNN7mcahiaz50uDWsX0Fk+tKahKGJpX55qp1qpAsCY0lt5MdPUD2KoniowBRXn+f5Xp4RZDfCKg1W0D637P/iznn06w0M+083NZW9ZwAAAABJRU5ErkJggg==);
     1542}
     1543
     1544.wp-slider .ui-slider-handle.ui-state-active.left-handle {
     1545    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAAAzFBMVEXZ5ejU4eXM3ODG2NzE1tvB1Nq90deux86sxs2qxcynwsqlwcmjwMihvseevMWdvMSbusOXuMGTtb6IrbiHrLeCqbSBqLN/p7J3oa11oKxzn6tvnKhrmaZqmKVpmKVol6RllaJhk6Bej51djptaiZZZiJVYhpNWg5BUf4xSfYlRfIhPeYRMdYBKcXxFaXNDZnA+X2g9XmY8XGU4VV43VFw2U1s0UFgyTVQxS1IwSVAuR00sREosQ0orQkgqQEYpPkQoPkMoPUMoPUL///8pY4MvAAAARHRSTlP/////////////////////////////////////////////////////////////////////////////////////////AHHSjxIAAAAJcEhZcwAACusAAArrAYKLDVoAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACUSURBVBiVVctXEoJQEETRMaIo5qwF5hwxYOY9ev97EiQ43q+pUz2EYk9n5UElU0rpRO016toO79WhxlVysWqkroRgsswSjAsbnasgpGdsMk25gooZvR3K8CQxCuU9jH8FhZ3022rwJTZ4CK9nnwJBbiO8yVpFKDButm1bOn6iLFyZt5igeZLHOrhgfJ8k/yXTVoLrAxo1P5iCdUg7AAAAAElFTkSuQmCC);
     1546}
     1547
     1548.wp-slider .ui-slider-handle {
     1549    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAAA8FBMVEU2dZipwNBJl8VGmcX///+EpLlBgqpymrNFjru3ydNWiKs6eZzY4uuRrL08faPL3OZBjLSBqsCTssRHlMJEf59cj657o7xKl8OEqsE9gag2dJtEkb+ct8iZs8BHmMePq8BejKZAiK5llK5FjrlJl8c6dZdGl8avxdBJlcZ4nbc6ep6XrbpKgZ+Lqr5KmcdIkbqsws1Gk8E+f6c4dptaiadFirRKl8V8pblImcNIl8eGpruVscZCh7BMlsdIlcFImchEkbs9eJpCjbdGjbk8fJ84dp02dpo8gatMlsM2dps8faVAg61Ej71Ek75IksFIlcOaLCw7AAAAUHRSTlP/////AP///////////////////////////////////////////////////////////////////////////////////////////////////xB6m5UAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACaSURBVBiVVcxZD8FAGIXhjxzUVktQgqKmo7ZYhkgsiS1tQuj//zeomo736uS5OFSo2W6UXc/R5hxXW5foxDlXqUKZx0GFZpXynuM4kXhjgjgyJkGzQIjpvi9Fx1uQ0iQUh4GkR/Ini0CQ2IfQ24YC4X8T+Mn0zj8lO1IgnqZpzlxE0m4YhrFsKYJVn126UGV+W1wHf4LdpByuF0goFKI7tv/dAAAAAElFTkSuQmCC);
    15171550}
    15181551
    15191552.wp-slider .ui-slider-handle.ui-state-hover,
    15201553.wp-slider .ui-slider-handle.ui-state-focus {
    1521     border-color: #79afca;
     1554    border-color: none;
     1555    outline: none;
    15221556}
    15231557
    15241558.wp-slider .ui-slider-handle.ui-state-active {
    1525     border-color: #79afca;
    1526     background: #eff8ff;
    1527     background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#f4f9fc));
    1528     background-image: -webkit-linear-gradient(bottom, #fff, #f4f9fc);
    1529     background-image:    -moz-linear-gradient(bottom, #fff, #f4f9fc);
    1530     background-image:      -o-linear-gradient(bottom, #fff, #f4f9fc);
    1531     background-image: linear-gradient(to top, #fff, #f4f9fc);
     1559    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAAA51BMVEUgZpDkzc0yd6f///8mcqFJm8cjbZZzr80mg78lh8BDk8UngLl+s9AmfKk4hrGeweBaoMhNlMORwt4nd6Zdm8BAjMEnf7RYmsMkb50mhsFWlsYhZ5ImhbwocZg0f61Lk8E9i7twqNBgo8VSmMUofLBcm8o3faUpfK8mh8Aia5MgZpFMmcgpeapDmcJjo8sliMEmh70nhLkkcKAqgLF2sc8sc5ojbZsngrMkh8EnfKw1eaUjbpkkapImeKQgaJAohb0mh8MmhcMng7kkcKEpf68iZ48haJMmhb8kicEmc6MibJkia5UnhLsw1mWvAAAATXRSTlP/AP8A/////////////////////////////////////////////////////////////////////////////////////////////////9/iR18AAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACaSURBVBiVVc15D8FAEIfh+Ymj6761LIrSiCNVVyjbRGgifP/PQ6q22/evyZPJDNXzD6G0qNDq5PtO3DJDFyfRpk+po2Eo0h5Qx9U0LRa3SejdlR2rDMLI41yKh6/AtOSzUiuU4kvemSMUDBsRXGuRIHj/CvCXyTNcSXelQBQYY1uBWMY651xfK4KzbdgzqJI73LK7hGC6r0bTB5apIhqIH/YIAAAAAElFTkSuQmCC);
    15321560}
    15331561

  • trunk/wp-admin/css/colors-fresh.css

    r24098 r24119  
    165165}
    166166
     167#diff-header,
    167168.post-format-options,
    168169.widget .widget-top,
    … …  
    13721373}
    13731374
     1375#diff-header {
     1376    border: 1px solid #dfdfdf;
     1377}
     1378
     1379#diff-slider .ui-slider-tooltip {
     1380    border-color: #d7d7d7;
     1381    background-color: #fff;
     1382}
     1383
    13741384#diff-title-to strong {
    1375     color: #0080aa;
     1385    color: #08a;
    13761386}
    13771387
    … …  
    13821392.revision-tick.completed-false {
    13831393    background-color: #99c;
    1384     background: url(../images/wpspin_light.gif) no-repeat;
     1394    background-image: url(../images/wpspin_light.gif) no-repeat;
    13851395    background-position: middle;
    13861396    background-size: 1px 10px;
    13871397}
    13881398
    1389 .revision-tick.completed-true {
     1399.revision-tick.completed-false {
     1400    background-image: none;
     1401}
     1402
     1403.revision-tick.scope-of-changes-vsmall {
    13901404    background-color: #d7d7d7;
     1405}
     1406
     1407.revision-tick.scope-of-changes-small {
     1408    background-color: #c3c3c3;
     1409}
     1410
     1411.revision-tick.scope-of-changes-med {
     1412    background-color: #b0b0b0;
     1413}
     1414
     1415.revision-tick.scope-of-changes-large {
     1416    background-color: #9c9c9c;
     1417}
     1418
     1419.revision-tick.scope-of-changes-vlarge {
     1420    background-color: #898989;
    13911421}
    13921422
    … …  
    14081438.wp-slider .ui-slider-handle {
    14091439    border-color: none;
     1440    color: #333;
    14101441}
    14111442
    14121443.wp-slider .ui-slider-handle.left-handle {
    1413 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAABAlBMVEXR2uHM1dzCzNW4ydOzxtSxw9Gqwc+bs7+Ss8SVscaZrLqQq7yNrMCKqr+EqsGDqb6GpruCpbl8pL15o7t1n7hwnLVika1djq5giqJXiqlYiqNJgp9ieYlDfqA/epw3dpk7dpg2dpo3dZo6dZc4dJY4dJg3cZY2bpE1bosxaIYxZIMrYX0tXnwtXHYsWHEnVW0mTmglT2cjTGIhRVsfQlYaN0kYM0QULDgTKTYRJzQTJzINISoLHCYNGyYKGCEIFxwJEhcJEhsHEhQDDAkHCg8EBwwCBwoEBAQBAwIBAQEBAQMAAgEBAAAAAAQAAQMBAAIAAAICAAEBAQAAAQAAAAD///+62qV+AAAAVnRSTlP/////////////////////////////////////////////////////////////////////////////////////////////////////////////////AEpNbNkAAAAJcEhZcwAACusAAArrAYKLDVoAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACbSURBVBiVVcvVDoNQEEXRqbu781B3d/dQQknh/P+vtBQKt/tpsnKGEOW4klkQFFvIsqwYzUJUvCts1wJl9gIruxT5hpLEyMBLKG+Z0ToJgrPLTDqOjyCxNN7mcahiaz50uDWsX0Fk+tKahKGJpX55qp1qpAsCY0lt5MdPUD2KoniowBRXn+f5Xp4RZDfCKg1W0D637P/iznn06w0M+083NZW9ZwAAAABJRU5ErkJggg==);
     1444    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAABAlBMVEXR2uHM1dzCzNW4ydOzxtSxw9Gqwc+bs7+Ss8SVscaZrLqQq7yNrMCKqr+EqsGDqb6GpruCpbl8pL15o7t1n7hwnLVika1djq5giqJXiqlYiqNJgp9ieYlDfqA/epw3dpk7dpg2dpo3dZo6dZc4dJY4dJg3cZY2bpE1bosxaIYxZIMrYX0tXnwtXHYsWHEnVW0mTmglT2cjTGIhRVsfQlYaN0kYM0QULDgTKTYRJzQTJzINISoLHCYNGyYKGCEIFxwJEhcJEhsHEhQDDAkHCg8EBwwCBwoEBAQBAwIBAQEBAQMAAgEBAAAAAAQAAQMBAAIAAAICAAEBAQAAAQAAAAD///+62qV+AAAAVnRSTlP/////////////////////////////////////////////////////////////////////////////////////////////////////////////////AEpNbNkAAAAJcEhZcwAACusAAArrAYKLDVoAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACbSURBVBiVVcvVDoNQEEXRqbu781B3d/dQQknh/P+vtBQKt/tpsnKGEOW4klkQFFvIsqwYzUJUvCts1wJl9gIruxT5hpLEyMBLKG+Z0ToJgrPLTDqOjyCxNN7mcahiaz50uDWsX0Fk+tKahKGJpX55qp1qpAsCY0lt5MdPUD2KoniowBRXn+f5Xp4RZDfCKg1W0D637P/iznn06w0M+083NZW9ZwAAAABJRU5ErkJggg==);
    14141445}
    14151446
    14161447.wp-slider .ui-slider-handle.ui-state-active.left-handle {
    1417 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAAAzFBMVEXZ5ejU4eXM3ODG2NzE1tvB1Nq90deux86sxs2qxcynwsqlwcmjwMihvseevMWdvMSbusOXuMGTtb6IrbiHrLeCqbSBqLN/p7J3oa11oKxzn6tvnKhrmaZqmKVpmKVol6RllaJhk6Bej51djptaiZZZiJVYhpNWg5BUf4xSfYlRfIhPeYRMdYBKcXxFaXNDZnA+X2g9XmY8XGU4VV43VFw2U1s0UFgyTVQxS1IwSVAuR00sREosQ0orQkgqQEYpPkQoPkMoPUMoPUL///8pY4MvAAAARHRSTlP/////////////////////////////////////////////////////////////////////////////////////////AHHSjxIAAAAJcEhZcwAACusAAArrAYKLDVoAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACUSURBVBiVVctXEoJQEETRMaIo5qwF5hwxYOY9ev97EiQ43q+pUz2EYk9n5UElU0rpRO016toO79WhxlVysWqkroRgsswSjAsbnasgpGdsMk25gooZvR3K8CQxCuU9jH8FhZ3022rwJTZ4CK9nnwJBbiO8yVpFKDButm1bOn6iLFyZt5igeZLHOrhgfJ8k/yXTVoLrAxo1P5iCdUg7AAAAAElFTkSuQmCC);
     1448    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAAAzFBMVEXZ5ejU4eXM3ODG2NzE1tvB1Nq90deux86sxs2qxcynwsqlwcmjwMihvseevMWdvMSbusOXuMGTtb6IrbiHrLeCqbSBqLN/p7J3oa11oKxzn6tvnKhrmaZqmKVpmKVol6RllaJhk6Bej51djptaiZZZiJVYhpNWg5BUf4xSfYlRfIhPeYRMdYBKcXxFaXNDZnA+X2g9XmY8XGU4VV43VFw2U1s0UFgyTVQxS1IwSVAuR00sREosQ0orQkgqQEYpPkQoPkMoPUMoPUL///8pY4MvAAAARHRSTlP/////////////////////////////////////////////////////////////////////////////////////////AHHSjxIAAAAJcEhZcwAACusAAArrAYKLDVoAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACUSURBVBiVVctXEoJQEETRMaIo5qwF5hwxYOY9ev97EiQ43q+pUz2EYk9n5UElU0rpRO016toO79WhxlVysWqkroRgsswSjAsbnasgpGdsMk25gooZvR3K8CQxCuU9jH8FhZ3022rwJTZ4CK9nnwJBbiO8yVpFKDButm1bOn6iLFyZt5igeZLHOrhgfJ8k/yXTVoLrAxo1P5iCdUg7AAAAAElFTkSuQmCC);
    14181449}
    14191450
    14201451.wp-slider .ui-slider-handle {
    1421     /* Slider drag Triangle CSS */
    1422 background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAAA8FBMVEU2dZipwNBJl8VGmcX///+EpLlBgqpymrNFjru3ydNWiKs6eZzY4uuRrL08faPL3OZBjLSBqsCTssRHlMJEf59cj657o7xKl8OEqsE9gag2dJtEkb+ct8iZs8BHmMePq8BejKZAiK5llK5FjrlJl8c6dZdGl8avxdBJlcZ4nbc6ep6XrbpKgZ+Lqr5KmcdIkbqsws1Gk8E+f6c4dptaiadFirRKl8V8pblImcNIl8eGpruVscZCh7BMlsdIlcFImchEkbs9eJpCjbdGjbk8fJ84dp02dpo8gatMlsM2dps8faVAg61Ej71Ek75IksFIlcOaLCw7AAAAUHRSTlP/////AP///////////////////////////////////////////////////////////////////////////////////////////////////xB6m5UAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACaSURBVBiVVcxZD8FAGIXhjxzUVktQgqKmo7ZYhkgsiS1tQuj//zeomo736uS5OFSo2W6UXc/R5hxXW5foxDlXqUKZx0GFZpXynuM4kXhjgjgyJkGzQIjpvi9Fx1uQ0iQUh4GkR/Ini0CQ2IfQ24YC4X8T+Mn0zj8lO1IgnqZpzlxE0m4YhrFsKYJVn126UGV+W1wHf4LdpByuF0goFKI7tv/dAAAAAElFTkSuQmCC);
     1452    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAAA3NCSVQICAjb4U/gAAAA8FBMVEU2dZipwNBJl8VGmcX///+EpLlBgqpymrNFjru3ydNWiKs6eZzY4uuRrL08faPL3OZBjLSBqsCTssRHlMJEf59cj657o7xKl8OEqsE9gag2dJtEkb+ct8iZs8BHmMePq8BejKZAiK5llK5FjrlJl8c6dZdGl8avxdBJlcZ4nbc6ep6XrbpKgZ+Lqr5KmcdIkbqsws1Gk8E+f6c4dptaiadFirRKl8V8pblImcNIl8eGpruVscZCh7BMlsdIlcFImchEkbs9eJpCjbdGjbk8fJ84dp02dpo8gatMlsM2dps8faVAg61Ej71Ek75IksFIlcOaLCw7AAAAUHRSTlP/////AP///////////////////////////////////////////////////////////////////////////////////////////////////xB6m5UAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAUdEVYdENyZWF0aW9uIFRpbWUAMy85LzEzrdD8jAAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAACaSURBVBiVVcxZD8FAGIXhjxzUVktQgqKmo7ZYhkgsiS1tQuj//zeomo736uS5OFSo2W6UXc/R5hxXW5foxDlXqUKZx0GFZpXynuM4kXhjgjgyJkGzQIjpvi9Fx1uQ0iQUh4GkR/Ini0CQ2IfQ24YC4X8T+Mn0zj8lO1IgnqZpzlxE0m4YhrFsKYJVn126UGV+W1wHf4LdpByuF0goFKI7tv/dAAAAAElFTkSuQmCC);
    14231453}
    14241454

  • trunk/wp-admin/css/wp-admin.css

    r24114 r24119  
    35493549
    35503550table.diff col.diffsplit.middle {
    3551     width: 4%;
     3551    width: auto;
    35523552}
    35533553
    … …  
    35723572}
    35733573
    3574 #revision-diff-container {
     3574#revisions-diff {
    35753575    position: relative;
    35763576}
    … …  
    35803580    top: 0;
    35813581    right: 0;
    3582     padding-top: 15px;
     3582    padding: 9px 9px 0 0;
    35833583}
    35843584
    35853585#loading-status {
    3586     position: absolute;
    3587     top: 0;
    3588     right: 170px;
    3589     line-height: 30px;
    35903586    display: none;
    3591     margin: 9px 0 0;
    35923587}
    35933588
    35943589#loading-status .spinner {
    3595     float: left;
     3590    display: inline-block;
     3591    float: none;
     3592    margin: -4px 0;
    35963593}
    35973594
    35983595#revision-interact {
    3599     border-bottom: 1px solid #dfdfdf;
    36003596    padding: 20px 0;
    36013597}
    … …  
    36143610}
    36153611
    3616 #diff-slider{
     3612#diff-slider {
    36173613    width: 70%;
    36183614    margin: 0 auto;
    … …  
    36213617.comparetwo #diff-slider {
    36223618    width: 95%;
     3619}
     3620
     3621#diff-slider .ui-slider-tooltip {
     3622    display: none;
     3623    position: absolute;
     3624    bottom: 20px;
     3625    margin-left: -4em;
     3626}
     3627
     3628#diff-slider .ui-state-active .ui-slider-tooltip,
     3629#diff-slider .ui-state-focus .ui-slider-tooltip,
     3630#diff-slider .ui-state-hover .ui-slider-tooltip {
     3631    display: block;
    36233632}
    36243633
    … …  
    36463655    padding-left: 3px;
    36473656    font-size: 13px;
     3657}
     3658
     3659#diff-header {
     3660    -webkit-border-radius: 3px;
     3661    border-radius: 3px;
    36483662}
    36493663
    … …  
    36893703.left-model-loading #loading-status,
    36903704.right-model-loading #loading-status,
    3691 .left-model-loading #loading-status .spinner,
    3692 .right-model-loading #loading-status .spinner,
    36933705.comparing-two-revisions #diff-header-from {
    36943706    display: block;
    … …  
    37063718.revision-tick.scope-of-changes-vsmall {
    37073719    width: 1px;
    3708     background-color: #aaa;
    37093720}
    37103721
    37113722.revision-tick.scope-of-changes-small {
    37123723    width: 2px;
    3713     background-color: #aaa;
    37143724    margin-left: -1px;
    37153725}
    … …  
    37183728    width: 3px;
    37193729    margin-left: -2px;
    3720     background-color: #666;
    37213730}
    37223731
    … …  
    37243733    width: 4px;
    37253734    margin-left: -3px;
    3726     background-color: #333;
    37273735}
    37283736
    … …  
    37303738    margin-left: -3px;
    37313739    width: 4px;
    3732     background-color: #111;
    37333740    left: 1;
    37343741}
    … …  
    37483755}
    37493756
    3750 .ui-tooltip-content img {
     3757.ui-tooltip-content img,
     3758.ui-slider-tooltip img {
    37513759    float: left;
    37523760    margin-right: 5px;
    … …  
    37563764/*  jQuery UI Tooltip 1.10.1 */
    37573765
    3758 .ui-tooltip {
     3766.ui-tooltip,
     3767.ui-slider-tooltip {
    37593768    padding: 8px;
    37603769    position: absolute;
    … …  
    37643773}
    37653774
    3766 body .ui-tooltip {
     3775body .ui-tooltip,
     3776body .ui-slider-tooltip {
    37673777    border-width: 1px;
    37683778}
    37693779
    3770 .ui-tooltip, .arrow:after {
     3780.ui-tooltip,
     3781.ui-slider-tooltip,
     3782.arrow:after {
    37713783    border: 1px solid #d7d7d7;
    37723784}
    37733785
    3774 .ui-tooltip {
     3786.ui-tooltip,
     3787.ui-slider-tooltip {
    37753788    padding: 5px 10px;
    37763789}

  • trunk/wp-admin/js/revisions.js

    r24040 r24119  
    398398
    399399        addTooltip: function( handle, message ) {
    400             handle.attr( 'title', '' ).tooltip({
    401                 track: false,
    402 
    403                 position: {
    404                     my: "left-30 top-66",
    405                     at: "top left",
    406                     using: function( position, feedback ) {
    407                         $( this ).css( position );
    408                         $( "<div>" )
    409                         .addClass( "arrow" )
    410                         .addClass( feedback.vertical )
    411                         .addClass( feedback.horizontal )
    412                         .appendTo( $( this ) );
    413                     }
    414                 },
    415                 show: false,
    416                 hide: false,
    417                 content:  function() {
    418                     return message;
    419                 }
    420 
    421             } );
     400            handle.find( '.ui-slider-tooltip' ).html( message );
    422401        },
    423402
    … …  
    427406
    428407        setWidth: function( width ) {
    429             return $( '#diff-slider' ).width( width );
     408            $( '#diff-slider' ).width( width );
    430409        },
    431410
    432411        refresh: function( options, slide ) {
    433412            $( '#diff-slider' ).slider( 'option', options );
     413
     414            // reset all of the slider tooltips during a refresh, but not on prev/next button actions
     415            if ( ! slide )
     416                $( 'a.ui-slider-handle' ).html( '<span class="ui-slider-tooltip ui-widget-content ui-corner-all"></span>' );
    434417
    435418            // Triggers the slide event

  • trunk/wp-admin/revision.php

    r24019 r24119  
    100100    <?php screen_icon(); ?>
    101101    <div id="revision-diff-container" class="current-version right-model-loading">
     102        <h2 class="long-header"><?php echo $h2; ?></h2>
     103
    102104        <div id="loading-status" class="updated message">
    103             <span class="spinner" ></span> <?php _e( 'Calculating revision diffs' ); ?>
     105            <p><span class="spinner" ></span> <?php _e( 'Calculating revision diffs' ); ?></p>
    104106        </div>
    105 
    106         <h2 class="long-header"><?php echo $h2; ?></h2>
    107107
    108108        <div class="diff-slider-ticks-wrapper">
    … …  
    124124    </div>
    125125
    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' ) ); ?>
     126    <div id="diff-header">
     127        <div id="diff-header-from" class="diff-header">
     128            <div id="diff-title-from-current-version" class="diff-title">
     129                <?php printf( '<strong>%1$s</strong> %2$s.' , __( 'From:' ), __( 'the current version' ) ); ?>
     130            </div>
     131
     132            <div id="diff-title-from" class="diff-title">
     133                <strong><?php _e( 'From:' ); ?></strong> {{{ data.titleFrom }}}
     134            </div>
    129135        </div>
    130136
    131         <div id="diff-title-from" class="diff-title">
    132             <strong><?php _e( 'From:' ); ?></strong> {{{ data.titleFrom }}}
     137        <div id="diff-header-to" class="diff-header">
     138            <div id="diff-title-to" class="diff-title">
     139                <strong><?php _e( 'To:' ); ?></strong> {{{ data.titleTo }}}
     140            </div>
     141
     142            <input type="button" id="restore-revision" class="button button-primary" data-restore-link="{{{ data.restoreLink }}}" value="<?php esc_attr_e( 'Restore This Revision' )?>" />
    133143        </div>
    134144    </div>
    135145
    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 }}}
    139         </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' )?>" />
    142146    </div>
    143147
Note: See TracChangeset for help on using the changeset viewer.