Allow CSS content: to be set in oxy|processing-instruction

Are you missing a feature? Request it's implementation here.
chrispitude
Posts: 322
Joined: Thu May 02, 2019 2:32 pm

Allow CSS content: to be set in oxy|processing-instruction

Post by chrispitude » Wed Sep 30, 2020 4:09 pm

We have an external tool that populates the target text of cross-book (scoped) <xref> elements. To tell the difference between user-written tool-generated link text, the tool inserts a <?snps gentext?> XML processing instruction to indicate generated text content:

Code: Select all

<p>Also see <xref keyref="cc_seuser.using_templates" scope="peer">Using
        Templates<?snps gentext?></xref>.</p>
However, CSS styling for PIs in the Oxygen editor are limited. I can set the background color and change the font width:

Code: Select all

oxy|processing-instruction[snps] {
    background-color: lightgreen;
    font-family: "Arial Narrow";
}
but this still results in somewhat writer-hostile display, and the displayed PI text can also accidentally be typed in and corrupted:

oxygen_editor_pi.gif
oxygen_editor_pi.gif (136.51 KiB) Viewed 692 times

The primary enhancement request is
  • Support the CSS content: property so I can replace the PI text with a small icon to indicate generated text.
The secondary enhancement requests are
  • Allow the PI content to be locked via a CSS property so it cannot be modified.
  • Provide CSS selection for the text ("gentext") following the PI name ("?snps").
We would also use this to make other PIs more writer-friendly (and writer-proof!), such as PIs placed in content for local Schematron rule disabling.

Radu
Posts: 7422
Joined: Fri Jul 09, 2004 5:18 pm

Re: Allow CSS content: to be set in oxy|processing-instruction

Post by Radu » Thu Oct 01, 2020 7:05 am

Hi Chris,

How about something like this?

Code: Select all

@namespace oxy "http://www.oxygenxml.com/extensions/author";

oxy|processing-instruction[snps] {
    background-color: lightgreen;
    font-family: "Arial Narrow";
    -oxy-display-tags:none;
    -oxy-editable:false;
    visibility:-oxy-collapse-text;    
}
oxy|processing-instruction[snps]:before {
    content: oxy_url('logo.png');
}
I made the PI content not editable but I also used "visibility:-oxy-collapse-text;" to hide its entire text. The tags are hidden for the element. I added a :before with an image, the image path is relative to the CSS:

https://www.oxygenxml.com/doc/versions/ ... ction.html

About this request:
Provide CSS selection for the text ("gentext") following the PI name ("?snps").
I do not quite understand what you mean by that. What is CSS selection?

Regards,
Radu
Radu Coravu
<oXygen/> XML Editor
http://www.oxygenxml.com

chrispitude
Posts: 322
Joined: Thu May 02, 2019 2:32 pm

Re: Allow CSS content: to be set in oxy|processing-instruction

Post by chrispitude » Thu Oct 01, 2020 3:50 pm

Wow Radu, this is like magic - thank you!

I created a base 18x13px SVG icon with Inkscape:

gentext.svg.zip
(1.8 KiB) Downloaded 29 times

then rendered it to a PNG:

gentext.png
gentext.png (377 Bytes) Viewed 662 times

and it looks great in the editor!

image.png
image.png (6.09 KiB) Viewed 662 times

We use the following CSS rule to draw a dotted line around scoped keyrefs, and the icon fits nicely inside:

Code: Select all

*[keyref][keyref][keyref][keyref*="."] {  /* highlight scoped keys */
    border-style: dotted;
    border-color: green;
    border-width: thin;
}
The "selection" statement was a poorly worded reference to CSS selectors. For example, I was thinking it would be useful to differentiate between <?snps gentext?> and <?snps sch?>. But now that you've shown me how to hide the text, I think just using separate PI names themseves (<?snps-gentext?>, <?snps-waive RULE001?>) will be a better approach.

Thanks as always for all your help! Please disregard the content: enhancement request, as this works perfectly.

chrispitude
Posts: 322
Joined: Thu May 02, 2019 2:32 pm

Re: Allow CSS content: to be set in oxy|processing-instruction

Post by chrispitude » Thu Oct 01, 2020 3:53 pm

I attached the wrong SVG file, it's this one:

gentext.svg.zip
(1.31 KiB) Downloaded 39 times
Attachments
gentext.zip
(1.31 KiB) Downloaded 29 times

Radu
Posts: 7422
Joined: Fri Jul 09, 2004 5:18 pm

Re: Allow CSS content: to be set in oxy|processing-instruction

Post by Radu » Thu Oct 01, 2020 4:13 pm

Hi Chris,

It's good that you converted the SVG to PNG and used the PNG in the CSS, PNG rendering is faster.
I also consider that processing instructions should better be differentiated by their target and not by their data. And yes right now the CSS can match PIs only by the target, not by their data part which is usually variable.

Regards,
Radu
Radu Coravu
<oXygen/> XML Editor
http://www.oxygenxml.com

Post Reply