home *** CD-ROM | disk | FTP | other *** search
/ HTML Examples / WP.iso / wordpress2 / wp-admin / css / revisions.css < prev    next >
Encoding:
Cascading Style Sheet File  |  2017-07-15  |  9.6 KB  |  579 lines
  1. /*------------------------------------------------------------------------------
  2.   11.2 - Post Revisions
  3. ------------------------------------------------------------------------------*/
  4. .revisions-control-frame,
  5. .revisions-diff-frame {
  6.     position: relative;
  7. }
  8.  
  9. .revisions-controls {
  10.     padding-top: 40px;
  11.     height: 100px;
  12.     z-index: 1;
  13. }
  14.  
  15. .revisions-controls input[type="checkbox"] {
  16.     position: relative;
  17.     top: -1px;
  18.     vertical-align: text-bottom;
  19. }
  20.  
  21. .revisions.pinned .revisions-controls {
  22.     position: fixed;
  23.     top: 0;
  24.     height: 82px;
  25.     background: #fff;
  26.     box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  27. }
  28.  
  29. .revisions-tickmarks {
  30.     position: relative;
  31.     margin: 0 auto;
  32.     height: 0.7em;
  33.     top: 7px;
  34.     max-width: 70%;
  35.     box-sizing: border-box;
  36.     background-color: #fff;
  37. }
  38.  
  39. .revisions-tickmarks > div {
  40.     position: absolute;
  41.     height: 100%;
  42.     border-left: 1px solid #a0a5aa;
  43.     box-sizing: border-box;
  44. }
  45.  
  46. .revisions-tickmarks > div:first-child {
  47.     border-width: 0;
  48. }
  49.  
  50. .comparing-two-revisions .revisions-controls {
  51.     height: 140px;
  52. }
  53.  
  54. .comparing-two-revisions.pinned .revisions-controls {
  55.     height: 124px;
  56. }
  57.  
  58. .revisions .diff-error {
  59.     position: absolute;
  60.     text-align: center;
  61.     margin: 0 auto;
  62.     width: 100%;
  63.     display: none;
  64. }
  65.  
  66. .revisions.diff-error .diff-error {
  67.     display: block;
  68. }
  69.  
  70. .revisions .loading-indicator {
  71.     position: absolute;
  72.     vertical-align: middle;
  73.     opacity: 0;
  74.     width: 100%;
  75.     width: calc( 100% - 30px );
  76.     top: 50%;
  77.     top: calc( 50% - 10px );
  78.     transition: opacity 0.5s;
  79.     filter: alpha(opacity=0); /* ie8 and earlier */
  80. }
  81.  
  82. body.folded .revisions .loading-indicator {
  83.     margin-left: -32px;
  84. }
  85.  
  86. .revisions .loading-indicator span.spinner {
  87.     display: block;
  88.     margin: 0 auto;
  89.     float: none;
  90. }
  91.  
  92. .revisions.loading .loading-indicator {
  93.     opacity: 1;
  94.     filter: alpha(opacity=100); /* ie8 and earlier */
  95. }
  96.  
  97. .revisions .diff {
  98.     transition: opacity 0.5s;
  99. }
  100.  
  101. .revisions.loading .diff {
  102.     opacity: 0.5;
  103.     filter: alpha(opacity=50); /* ie8 and earlier */
  104. }
  105.  
  106. .revisions.diff-error .diff {
  107.     visibility: hidden;
  108. }
  109.  
  110. .revisions-meta {
  111.     margin-top: 20px;
  112.     background-color: #fff;
  113.     box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  114. }
  115.  
  116. .revisions.pinned .revisions-meta {
  117.     box-shadow: none;
  118. }
  119.  
  120. .revision-toggle-compare-mode {
  121.     position: absolute;
  122.     top: 0;
  123.     right: 0;
  124. }
  125.  
  126. .comparing-two-revisions .revisions-previous,
  127. .comparing-two-revisions .revisions-next,
  128. .revisions-meta .diff-meta-to strong {
  129.     display: none;
  130. }
  131.  
  132. .revisions-controls .author-card .date {
  133.     color: #72777c;
  134. }
  135.  
  136. .revisions-controls .author-card.autosave {
  137.     color: #d54e21;
  138. }
  139.  
  140. .revisions-controls .author-card .author-name {
  141.     font-weight: 600;
  142. }
  143.  
  144. .comparing-two-revisions .diff-meta-to strong {
  145.     display: block;
  146. }
  147.  
  148. .revisions.pinned .revisions-buttons {
  149.     padding: 0 11px;
  150. }
  151.  
  152. .revisions-previous,
  153. .revisions-next {
  154.     position: relative;
  155.     z-index: 1;
  156. }
  157.  
  158. .revisions-previous {
  159.     float: left;
  160. }
  161.  
  162. .revisions-next {
  163.     float: right;
  164. }
  165.  
  166. .revisions-controls .wp-slider {
  167.     max-width: 70%;
  168.     margin: 0 auto;
  169.     top: -3px;
  170. }
  171.  
  172. .revisions-diff {
  173.     padding: 15px;
  174.     background-color: #fff;
  175.     box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  176. }
  177.  
  178. .revisions-diff h3:first-child {
  179.     margin-top: 0;
  180. }
  181.  
  182. /* Revision meta box */
  183. .post-revisions li img,
  184. #revisions-meta-restored img {
  185.     vertical-align: middle;
  186. }
  187.  
  188. table.diff tbody tr td:nth-child(2) {
  189.     width: 4%;
  190. }
  191.  
  192. table.diff {
  193.     table-layout: fixed;
  194.     width: 100%;
  195.     white-space: pre-wrap;
  196. }
  197.  
  198. table.diff col.content {
  199.     width: auto;
  200. }
  201.  
  202. table.diff col.content.diffsplit {
  203.     width: 48%;
  204. }
  205.  
  206. table.diff col.diffsplit.middle {
  207.     width: auto;
  208. }
  209.  
  210. table.diff col.ltype {
  211.     width: 30px;
  212. }
  213.  
  214. table.diff tr {
  215.     background-color: transparent;
  216. }
  217.  
  218. table.diff td,
  219. table.diff th {
  220.     font-family: Consolas, Monaco, monospace;
  221.     font-size: 14px;
  222.     line-height: 1.618;
  223.     padding: .5em;
  224.     vertical-align: top;
  225.     word-wrap: break-word;
  226. }
  227.  
  228. table.diff td h1,
  229. table.diff td h2,
  230. table.diff td h3,
  231. table.diff td h4,
  232. table.diff td h5,
  233. table.diff td h6 {
  234.     margin: 0;
  235. }
  236.  
  237. table.diff .diff-deletedline del,
  238. table.diff .diff-addedline ins {
  239.     text-decoration: none;
  240. }
  241.  
  242. table.diff .diff-deletedline {
  243.     background-color: #ffe9e9;
  244. }
  245.  
  246. table.diff .diff-deletedline del {
  247.     background-color: #faa;
  248. }
  249.  
  250. table.diff .diff-addedline {
  251.     background-color: #e9ffe9;
  252. }
  253.  
  254. table.diff .diff-addedline ins {
  255.     background-color: #afa;
  256. }
  257.  
  258. .diff-meta {
  259.     padding: 5px;
  260.     clear: both;
  261.     min-height: 32px;
  262. }
  263.  
  264. .diff-title strong {
  265.     line-height: 32px;
  266.     min-width: 60px;
  267.     text-align: right;
  268.     float: left;
  269.     margin-right: 5px;
  270. }
  271.  
  272. .revisions-controls .author-card .author-info {
  273.     font-size: 12px;
  274.     line-height: 16px;
  275. }
  276.  
  277. .revisions-controls .author-card .avatar,
  278. .revisions-controls .author-card .author-info {
  279.     float: left;
  280.     margin-left: 6px;
  281.     margin-right: 6px;
  282. }
  283.  
  284. .revisions-controls .author-card .byline {
  285.     display: block;
  286.     font-size: 12px;
  287. }
  288.  
  289. .revisions-controls .author-card .avatar {
  290.     vertical-align: middle;
  291. }
  292.  
  293. .diff-meta input.restore-revision {
  294.     float: right;
  295.     margin-left: 6px;
  296.     margin-right: 6px;
  297.     margin-top: 4px;
  298. }
  299.  
  300. .diff-meta-from {
  301.     display: none;
  302. }
  303.  
  304. .comparing-two-revisions .diff-meta-from {
  305.     display: block;
  306. }
  307.  
  308. .revisions-tooltip {
  309.     position: absolute;
  310.     bottom: 105px;
  311.     margin-right: 0;
  312.     margin-left: -69px;
  313.     z-index: 0;
  314.     max-width: 350px;
  315.     min-width: 130px;
  316.     padding: 8px 4px;
  317.     display: none;
  318.     opacity: 0;
  319. }
  320.  
  321. .revisions-tooltip.flipped {
  322.     margin-left: 0;
  323.     margin-right: -70px;
  324. }
  325.  
  326. .revisions.pinned .revisions-tooltip {
  327.     display: none !important;
  328. }
  329.  
  330. .comparing-two-revisions .revisions-tooltip {
  331.     bottom: 145px;
  332. }
  333.  
  334. .revisions-tooltip-arrow {
  335.     width: 70px;
  336.     height: 15px;
  337.     overflow: hidden;
  338.     position: absolute;
  339.     left: 0;
  340.     margin-left: 35px;
  341.     bottom: -15px;
  342. }
  343.  
  344. .revisions-tooltip.flipped .revisions-tooltip-arrow {
  345.     margin-left: 0;
  346.     margin-right: 35px;
  347.     left: auto;
  348.     right: 0;
  349. }
  350.  
  351. .revisions-tooltip-arrow > span {
  352.     content: "";
  353.     position: absolute;
  354.     left: 20px;
  355.     top: -20px;
  356.     width: 25px;
  357.     height: 25px;
  358.     -webkit-transform: rotate(45deg);
  359.     transform: rotate(45deg);
  360. }
  361.  
  362. .revisions-tooltip.flipped .revisions-tooltip-arrow > span {
  363.     left: auto;
  364.     right: 20px;
  365. }
  366.  
  367. .ie8 .revisions-tooltip-arrow > span {
  368.     left: 15px;
  369.     top: -25px;
  370.     -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476)";
  371. }
  372.  
  373. .ie8 .revisions-tooltip.flipped .revisions-tooltip-arrow > span {
  374.     right: 25px;
  375. }
  376.  
  377. .revisions-tooltip,
  378. .revisions-tooltip-arrow > span {
  379.     border: 1px solid #ddd;
  380.     background-color: #fff;
  381. }
  382.  
  383. .revisions-tooltip {
  384.     display: none;
  385. }
  386.  
  387. .arrow {
  388.     width: 70px;
  389.     height: 16px;
  390.     overflow: hidden;
  391.     position: absolute;
  392.     left: 0;
  393.     margin-left: -35px;
  394.     bottom: 90px;
  395.     z-index: 10000;
  396. }
  397.  
  398. .arrow:after {
  399.     z-index: 9999;
  400.     background-color: #fff;
  401.     box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  402. }
  403.  
  404. .arrow.top {
  405.     top: -16px;
  406.     bottom: auto;
  407. }
  408.  
  409. .arrow.left {
  410.     left: 20%;
  411. }
  412.  
  413. .arrow:after {
  414.     content: "";
  415.     position: absolute;
  416.     left: 20px;
  417.     top: -20px;
  418.     width: 25px;
  419.     height: 25px;
  420.     -webkit-transform: rotate(45deg);
  421.     transform: rotate(45deg);
  422. }
  423.  
  424. .revisions-tooltip,
  425. .revisions-tooltip-arrow:after {
  426.     border-width: 1px;
  427.     border-style: solid;
  428. }
  429.  
  430. div.revisions-controls > .wp-slider > .ui-slider-handle {
  431.     margin-left: -10px;
  432. }
  433.  
  434. .rtl div.revisions-controls > .wp-slider > .ui-slider-handle {
  435.     margin-right: -10px;
  436. }
  437.  
  438. /* jQuery UI Slider */
  439. .wp-slider.ui-slider {
  440.     position: relative;
  441.     border: 1px solid #ddd;
  442.     text-align: left;
  443.     cursor: pointer;
  444. }
  445.  
  446. .wp-slider .ui-slider-handle {
  447.     border-radius: 50%;
  448.     height: 18px;
  449.     margin-top: -5px;
  450.     outline: none;
  451.     padding: 2px;
  452.     position: absolute;
  453.     width: 18px;
  454.     z-index: 2;
  455.     touch-action: none;
  456. }
  457.  
  458. .wp-slider .ui-slider-handle,
  459. .wp-slider .ui-slider-handle.focus {
  460.     background: #f7f7f7;
  461.     border: 1px solid #ccc;
  462.     box-shadow: 0 1px 0 #cccccc;
  463. }
  464.  
  465. .wp-slider .ui-slider-handle:hover,
  466. .wp-slider .ui-slider-handle.ui-state-hover {
  467.     background: #fafafa;
  468.     border-color: #999;
  469. }
  470.  
  471. .wp-slider .ui-slider-handle:active,
  472. .wp-slider .ui-slider-handle.ui-state-active {
  473.     background: #eee;
  474.     border-color: #999;
  475.      box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
  476.      -webkit-transform: translateY(1px);
  477.      transform: translateY(1px);
  478. }
  479.  
  480.  
  481. .wp-slider .ui-slider-handle:before {
  482.     background: none;
  483.     position: absolute;
  484.     top: 2px;
  485.     left: 2px;
  486.     color: #555;
  487.     content: "\f229";
  488.     font: normal 18px/1 dashicons;
  489.     speak: none;
  490.     -webkit-font-smoothing: antialiased;
  491.     -moz-osx-font-smoothing: grayscale;
  492. }
  493.  
  494. .wp-slider .ui-slider-handle:hover:before,
  495. .wp-slider .ui-slider-handle.ui-state-hover:before {
  496.     color: #23282d;
  497. }
  498.  
  499. .wp-slider .ui-slider-handle.from-handle:before,
  500. .wp-slider .ui-slider-handle.to-handle:before {
  501.     font-size: 20px !important;
  502.     margin: -1px 0 0 -1px;
  503. }
  504.  
  505. .wp-slider .ui-slider-handle.from-handle:before {
  506.     content: "\f139";
  507. }
  508.  
  509. .wp-slider .ui-slider-handle.to-handle:before {
  510.     content: "\f141";
  511. }
  512.  
  513. .rtl .wp-slider .ui-slider-handle.from-handle:before {
  514.     content: "\f141";
  515. }
  516.  
  517. .rtl .wp-slider .ui-slider-handle.to-handle:before {
  518.     content: "\f139";
  519.     right: -1px;
  520. }
  521.  
  522. .wp-slider .ui-slider-range {
  523.     position: absolute;
  524.     font-size: .7em;
  525.     display: block;
  526.     border: 0;
  527.     background-color: transparent;
  528.     background-image: none;
  529. }
  530.  
  531. .wp-slider.ui-slider-horizontal {
  532.     height: .7em;
  533. }
  534.  
  535. .wp-slider.ui-slider-horizontal .ui-slider-handle {
  536.     top: -.25em;
  537.     margin-left: -.6em;
  538. }
  539.  
  540. .wp-slider.ui-slider-horizontal .ui-slider-range {
  541.     top: 0;
  542.     height: 100%;
  543. }
  544.  
  545. .wp-slider.ui-slider-horizontal .ui-slider-range-min {
  546.     left: 0;
  547. }
  548.  
  549. .wp-slider.ui-slider-horizontal .ui-slider-range-max {
  550.     right: 0;
  551. }
  552.  
  553. /* =Media Queries
  554. -------------------------------------------------------------- */
  555.  
  556. /**
  557.  * HiDPI Displays
  558.  */
  559. @media print,
  560.   (-webkit-min-device-pixel-ratio: 1.25),
  561.   (min-resolution: 120dpi) {
  562.     .revision-tick.completed-false {
  563.         background-image: url(../images/spinner-2x.gif);
  564.     }
  565. }
  566.  
  567. @media screen and ( max-width: 782px ) {
  568.     #diff-next-revision,
  569.     #diff-previous-revision {
  570.         margin-top: -1em;
  571.     }
  572.  
  573.     table.diff {
  574.         -ms-word-break: break-all;
  575.         word-break: break-all;
  576.         word-wrap: break-word;
  577.     }
  578. }
  579.