Page 1 of 1

Is Conditional statements available in CSS

Posted: Mon Jan 23, 2017 10:01 am
by Raga Mounika
Hi Team,

I am using oXygen Author 18 with Eclipse plugin.
For my customization I need to have generated text for <troubleshooting> topic. Consider an element 'x' . In x/cause/title I should have "Cause" generated text in the below scenarios:
1) It should have "Cause" generated text when <x> is inserted and <cause> is given it.
And also it should have "Cause" generated text when <x/cause> is inserted and <title> is given it without any content in it(<title> is empty).
2) It should not have generated text when <x/cause> is inserted and <title> is having some content in it.

So for this condition is it possible to have If-else (conditional statement) in CSS? If yes, please provide the code.

Thank you!

Regards,
Mounika

Re: Is Conditional statements available in CSS

Posted: Mon Jan 23, 2017 4:41 pm
by Radu
Hi Mounika,

The list with all CSS selectors we support can be found here:

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

There is a certain CSS selector called subject selector:

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

which allows you to match a parent element having a child matching a certain condition. Maybe this selector will help in your case.

Regards,
Radu

Re: Is Conditional statements available in CSS

Posted: Wed Jan 25, 2017 5:22 pm
by Raga Mounika
Hi Team,

Thanks for the reply :)

By using CSS selector the code works partially.
I used a CSS selector '>' and it worked for generated text. The issue now is I should only get the generated text in bold. By the below mentioned code I am getting the complete content in element in bold. If I use " [class~='x/cause']:before{ " the code partially works. It is not working in the condition when title is inserted and it is empty. Please help me with proper code to solve this issue.

Code: Select all

*[class~='x/cause']{
-oxy-foldable: false;
}
cause:not([title]){
content:"Cause ";
font-weight: bold;
}
*[class~='x/cause']! > [class~='topic/title']:empty{
content:"Cause ";
font-weight: bold;
}
*[class~='x/cause']! > [class~='topic/title'] {
content: " ";
}

Re: Is Conditional statements available in CSS

Posted: Thu Jan 26, 2017 9:51 am
by Radu
Hi Mounika,

Maybe you need a selector looking something like this:

Code: Select all

*[class~='x/cause']:has(title:empty):before{
content: "abc";
font-weight:bold;
}
Regards,
Radu

Re: Is Conditional statements available in CSS

Posted: Mon Jan 30, 2017 3:36 pm
by Raga Mounika
Hi Radu,

Thanks for the reply but it is not working in my case.

According to my requirement I should have:
1) Cause generated text when cause is entered
2) Cause generated text in cause\title and title is empty
3) No generated text when cause\title

Please check the below code I used in my customization:

Code: Select all

cause:not([title]):before{
content:"Cause ";
font-weight: bold;
}
*[class~='x/cause']! > [class~='topic/title']:empty:before{
content: "Cause ";
font-weight: bold;
}

*[class~='x/cause']! > [class~='topic/title']:before{
content: " ";
}
The issue I am facing now is
1)In the second case I mentioned above ie., in cause\title and title is empty I am getting "Cause Cause" two generated texts and if any elements are inserted inside cause it is also inheriting the same bold property(ex. <p> if inserted inside <cause> when title is empty content inside <p> is also in bold)
2)"Cause" generated text is appeared in third condition when cause\title is entered and I should not get any generated text as of my code.

I observe I am getting "Cause" generated text because of
cause:not([title]):before{
content:"Cause ";
font-weight: bold;
}
in all the three conditions.

Please provide me an alterate solution other than CSS selector you mentioned in previous mail.

Thank you.

Best Regards,
Mounika

Re: Is Conditional statements available in CSS

Posted: Tue Jan 31, 2017 9:56 am
by Radu
Hi Mounika,

About this selector:

Code: Select all

cause:not([title]):before
Why did you add square brackets to surround the title? Angle brackets are used to match attribute conditions.
If you want to express that the cause must not contain a title, the clause should be:

Code: Select all

cause:not(title):before
Regards,
Radu