Files
luban-lite/doc/webhelp/template/css/aic-highlight-changes.css
刘可亮 11c97ef399 v1.2.1
2025-07-22 11:15:46 +08:00

489 lines
10 KiB
CSS

/*
* ==========================================
*
* Side notes. These are the oXygen review processing instructions
* converted to elements. They are floating to one
* side of the page.
*
* For the WebHelp HTML output, the review elements are converted
* to 'div' and 'span's having with a class name matching the name
* of the element.
*
* ==========================================
*/
@media screen {
oxy-attributes,
oxy-comment,
oxy-delete,
oxy-insert,
.oxy-attributes,
.oxy-comment,
.oxy-delete,
.oxy-insert {
margin: 0.5em;
width: 20%;
min-width: 7em;
}
table oxy-attributes,
table oxy-comment,
table oxy-delete,
table oxy-insert,
table .oxy-attributes,
table .oxy-comment,
table .oxy-delete,
table .oxy-insert {
margin: 0.5em;
width: 50%;
}
}
@media print, screen {
/*
* Main callouts properties.
*/
oxy-attributes,
oxy-comment,
oxy-delete,
oxy-insert,
.oxy-attributes,
.oxy-comment,
.oxy-delete,
.oxy-insert {
font-size: small;
/* Do not take text styles from the context. */
font-weight: normal !important;
text-decoration: none !important;
font-family: arial, helvetica, sans-serif;
position: relative;
float: right;
clear: right;
padding: 0.5em 1em 0.5em 1em;
min-height: 1em;
page-break-inside: avoid;
border-radius: 10px;
link: attr(href);
-ah-link: attr(href);
-oxy-link: attr(href);
}
/*
* Style the comment replies.
*/
oxy-attributes oxy-comment,
oxy-comment oxy-comment,
oxy-delete oxy-comment,
oxy-insert oxy-comment,
.oxy-attributes .oxy-comment,
.oxy-comment .oxy-comment,
.oxy-delete .oxy-comment,
.oxy-insert .oxy-comment {
border-left: 2pt solid;
padding-left: 0.5em;
padding-right: 0;
margin: 2pt 0 2pt 10%;
width: 90%;
border-radius: 0;
}
/*
* Hide the links from the replies.
*/
oxy-attributes oxy-comment:before,
oxy-comment oxy-comment:before,
oxy-delete oxy-comment:before,
oxy-insert oxy-comment:before,
.oxy-attributes .oxy-comment:before,
.oxy-comment .oxy-comment:before,
.oxy-delete .oxy-comment:before,
.oxy-insert .oxy-comment:before {
display: none;
}
/*
* Hide some meta information.
*/
oxy-comment-id,
oxy-comment-parent-id,
oxy-mid,
oxy-hour,
oxy-tz,
.oxy-comment-id,
.oxy-comment-parent-id,
.oxy-mid,
.oxy-hour,
.oxy-tz {
display: none;
}
/* The ID of the change, like the number of a footnote. */
oxy-attributes[hr_id]:before,
oxy-comment[hr_id]:before,
oxy-delete[hr_id]:before,
oxy-insert[hr_id]:before {
content: '[' attr(hr_id) '] ';
display: none !important ;
}
.oxy-attributes[hr_id]:before,
.oxy-comment[hr_id]:before,
.oxy-delete[hr_id]:before,
.oxy-insert[hr_id]:before {
/* For HTML, the hr_id is missing, the link is created as an "A" element. */
content: none !important;
}
/* Author */
oxy-author,
.oxy-author {
font-weight: bold;
display: none !important;
}
/* Comment */
oxy-comment-text,
.oxy-comment-text {
display: block;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
/* Content of the change */
oxy-content,
.oxy-content {
display: block;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
oxy-delete > oxy-content,
.oxy-delete > .oxy-content {
text-decoration: line-through;
}
oxy-insert > oxy-content,
.oxy-insert > .oxy-content {
font-style: italic;
}
oxy-insert > oxy-content:before,
.oxy-insert > .oxy-content:before {
content: "<<";
}
oxy-insert > oxy-content:after,
.oxy-insert > .oxy-content:after {
content: ">>";
}
/* Date */
oxy-date,
.oxy-date {
display: none;
margin-top: 0.5em;
margin-bottom: 0.5em;
text-align: right;
font-size: 0.8em;
}
/* Old and cuattribute value */
oxy-old-value,
.oxy-old-value {
display: block;
text-decoration: line-through;
}
oxy-old-value:before,
.oxy-old-value:before,
oxy-current-value:before,
.oxy-current-value:before {
display: block;
font-weight: bold;
text-decoration: none;
}
oxy-current-value[unknown = 'true']:before,
.oxy-current-value[unknown = 'true']:before {
content: "<< Cannot determine the current value >>";
color: red;
}
oxy-current-value,
.oxy-current-value
{
display: block;
}
oxy-attribute-change:before,
.oxy-attribute-change:before {
display: none !important;
}
oxy-range-start,
.oxy-range-start,
oxy-range-end,
.oxy-range-end {
display: none !important;
}
/*
* This is the link to the floated comment.
* This remains in the main content flow.
*/
oxy-range-start:before,
.oxy-range-start:before {
display: none !important;
}
/*
* This marks the end of the range.
*/
oxy-range-end:before,
.oxy-range-end:before {
display: none !important;
}
}
@media print {
oxy-attributes,
oxy-comment,
oxy-delete,
oxy-insert,
.oxy-attributes,
.oxy-comment,
.oxy-delete,
.oxy-insert {
font-size: 0.8rem;
margin: 0.5em -0.7in 0.5em 0.5em;
/* This should be correlated with the page margin from the p-page-size.css */
width: 1.5in;
}
}
/*
*
* Colors
*
*/
oxy-attributes,
oxy-comment,
oxy-delete,
oxy-insert,
.oxy-attributes,
.oxy-comment,
.oxy-delete,
.oxy-insert {
white-space: initial;
background-color: #FFFFAA;
color: black;
}
/*
* The highlight part.
* This is also built-in Chemistry processor,
* but if one uses other processors is good to have it here also.
*/
oxy-insert-hl,
.oxy-insert-hl {
display: inline;
background-color: #cef7d7;
color: black;
text-decoration: underline;
}
oxy-delete-hl,
.oxy-delete-hl {
display: none !important;
}
oxy-comment-hl,
.oxy-comment-hl {
display: inline;
background-color: yellow;
}
oxy-color-hl[color],
.oxy-color-hl[color] {
display: inline;
background-color: attr(color, color);
}
/*
* The marked as done changes should be grayed out.
*/
oxy-attributes[flag ~= "done"],
oxy-comment[flag ~= "done"],
oxy-delete[flag ~= "done"],
oxy-insert[flag ~= "done"],
.oxy-attributes[flag ~= "done"],
.oxy-comment[flag ~= "done"],
.oxy-delete[flag ~= "done"],
.oxy-insert[flag ~= "done"] {
color: gray;
}
oxy-attributes,
.oxy-attributes {
border-color: black;
}
oxy-comment,
.oxy-comment {
border-color: transparent;
}
oxy-delete,
.oxy-delete {
border-color: rgb(255, 0, 157);
}
oxy-insert,
.oxy-insert {
border-color: red;
}
oxy-range-start,
.oxy-range-start,
oxy-range-end,
.oxy-range-end {
background-color: yellow;
}
oxy-attributes oxy-comment,
oxy-comment oxy-comment,
oxy-delete oxy-comment,
oxy-insert oxy-comment,
.oxy-attributes .oxy-comment,
.oxy-comment .oxy-comment,
.oxy-delete .oxy-comment,
.oxy-insert .oxy-comment {
border-left-color: orange;
}
/*
Because Chemistry does not support the float:right, we use footnotes instead.
Starting with Chemistry 21 the oxy-attributes, oxy-comment, oxy-delete and oxy-insert are
moved from footnotes to PDF annotations. To keep them as footnotes, use
the -no-pdf-annotaotions-for-change-tracking-and-comments Chemistry command line parameter.
*/
@media oxygen-chemistry {
oxy-attributes,
oxy-comment,
oxy-delete,
oxy-insert,
.oxy-attributes,
.oxy-comment,
.oxy-delete,
.oxy-insert {
margin: 0.5em;
position: static;
float: footnote;
}
/*
* Footnotes in footnotes are not allowed in the FO and they are not OK to represent the replies.
* So leave the replies as normal blocks, inside the parent change.
*/
oxy-attributes oxy-comment,
oxy-comment oxy-comment,
oxy-delete oxy-comment,
oxy-insert oxy-comment,
.oxy-attributes .oxy-comment,
.oxy-comment .oxy-comment,
.oxy-delete .oxy-comment,
.oxy-insert .oxy-comment {
float: none;
}
oxy-attributes[hr_id]:before,
oxy-comment[hr_id]:before,
oxy-delete[hr_id]:before,
oxy-insert[hr_id]:before {
content: none;
}
.oxy-attributes[hr_id]:before,
.oxy-comment[hr_id]:before,
.oxy-delete[hr_id]:before,
.oxy-insert[hr_id]:before {
content: none;
}
/* Do not leave the range id in the content, it creates confusion with the footnotes numbers. */
oxy-range-start,
.oxy-range-start,
oxy-range-end,
.oxy-range-end {
background-color: inherit;
color: maroon;
}
oxy-range-start:before,
.oxy-range-start:before {
content: '{';
font-weight: bold;
}
oxy-range-end:before,
.oxy-range-end:before {
content: '}';
font-weight: bold;
}
oxy-range-start[is-changebar]:before(100),
.oxy-range-start[is-changebar]:before(100) {
content: "";
display: -oxy-changebar-start;
-oxy-changebar-color: gray;
-oxy-changebar-width: 1.5pt;
}
oxy-range-end[is-changebar]:before(100),
.oxy-range-end[is-changebar]:before(100) {
content: "";
display: -oxy-changebar-end;
}
/* Remove the link from the HTML output, we already have a link from the footnote marker to the call. */
.oxy-attributes > a,
.oxy-comment > a,
.oxy-delete > a,
.oxy-insert > a {
display: none;
}
oxy-attributes,
oxy-attributes:footnote-call,
oxy-attributes:footnote-marker,
.oxy-attributes,
.oxy-attributes:footnote-call,
.oxy-attributes:footnote-marker {
background-color: cyan;
}
oxy-comment,
oxy-comment:footnote-call,
oxy-comment:footnote-marker,
.oxy-comment,
.oxy-comment:footnote-call,
.oxy-comment:footnote-marker {
background-color: #FFFFAA;
}
oxy-delete,
oxy-delete:footnote-call,
oxy-delete:footnote-marker,
.oxy-delete,
.oxy-delete:footnote-call,
.oxy-delete:footnote-marker {
background-color: #FFAAAA;
}
oxy-insert,
oxy-insert:footnote-call,
oxy-insert:footnote-marker,
.oxy-insert,
.oxy-insert:footnote-call,
.oxy-insert:footnote-marker {
background-color: #DDDDFF;
}
}