So we've defined two dropdownbody styles, and we would like the body of the each dropdown style to have a different background colour (ie, the body of one is white, the body of the other is grey). I've defined the dropdown styles as needed. But I notice that the additional style only uses the default dropDownBody style: in the Chrome inspector, it's clear that the additional class isn't even applied to the dropdown body.
So far, I'm making do with a ridiculous number of CSS selectors to turn then on and off depending on the parent class (ridiculous because we're also nesting the dropdowns in different configurations, so I have to turn the background on or off accordingly). The only other option I can think of is to wrap the contents of one of the dropdowns in a div to give a background, but both of these are pretty fragile solutions.
Is there a way to get Flare to apply the class to the body as it should? Or is it a bug that the class isn't added?
Defining multiple dropdownBody styles
-
- Propeller Head
- Posts: 18
- Joined: Sat Nov 09, 2013 12:51 am
Re: Defining multiple dropdownBody styles
It works fine for me; e.g. if I create this class, and apply it to a MadCap:dropDownBody tag in the editor, I can see the background colour in both the editor and in the built output (HTML5).
Code: Select all
MadCap|dropDownBody.test
{
background-color: #9cda51;
}
-
- Propeller Head
- Posts: 18
- Joined: Sat Nov 09, 2013 12:51 am
Re: Defining multiple dropdownBody styles
This is the CSS I have:
But both dropDown styles use the regular dropDown body: I get that background and border on both.
Here is the result in the Chrome inspector: only the regular dropDownBody class is applied to the dropdown body div: I'm using 2017, though, not R2. (we need to fix some custom scripts to work with the new TOC generation before we can upgrade).
It obeys the CSS for the hotspot stuff, and adds the class correctly to the outer wrapper div of the dropdown.But both dropDown styles use the regular dropDown body: I get that background and border on both.
Here is the result in the Chrome inspector: only the regular dropDownBody class is applied to the dropdown body div: I'm using 2017, though, not R2. (we need to fix some custom scripts to work with the new TOC generation before we can upgrade).
You do not have the required permissions to view the files attached to this post.
Re: Defining multiple dropdownBody styles
Apologies for the simple question - but are you applying the headingFirst class to the MadCap:dropDownBody in the editor?
For me, I apply a MadCap|dropDownBody.test class in the source, which looks like this in text view:
Which is included as a dropDownBodytest class in the output.
For me, I apply a MadCap|dropDownBody.test class in the source, which looks like this in text view:
Code: Select all
<MadCap:dropDownBody class="test">
Code: Select all
<div class="MCDropDownBody dropDownBody dropDownBodytest" style="display: block;">
-
- Propeller Head
- Posts: 18
- Joined: Sat Nov 09, 2013 12:51 am
Re: Defining multiple dropdownBody styles
Good question: I was not adding the class in the source manually. The XML editor doesn't allow the body to be selected to apply a class, which implied (to me) that the software thinks it's not necessary to do so and will cascade naturally when you set the "entire" dropdown to the class. Nor does the help instruct you to go into the source and add the class to achieve the result.
I think I'll still report [not being able to select the body in the XML editor to add a class as a bug]. At the very least, the step should be in their help; it's not intuitive.
Thank you for your help!
I think I'll still report [not being able to select the body in the XML editor to add a class as a bug]. At the very least, the step should be in their help; it's not intuitive.
Thank you for your help!
Re: Defining multiple dropdownBody styles
No, CSS will never cascade/inherit a class from a parent to child tag.Sofie Bird wrote:Good question: I was not adding the class in the source manually. The XML editor doesn't allow the body to be selected to apply a class, which implied (to me) that the software thinks it's not necessary to do so and will cascade naturally when you set the "entire" dropdown to the class. Nor does the help instruct you to go into the source and add the class to achieve the result.
I think I'll still report [not being able to select the body in the XML editor to add a class as a bug]. At the very least, the step should be in their help; it's not intuitive.
Thank you for your help!
You don't have to apply the class manually in the text editor, you can apply it from the styles list. Just make sure the MadCap:dropDownBody tag is highlighted first, which I can only do via the arrow keys (and is apparently not selectable using the mouse).
-
- Propeller Head
- Posts: 18
- Joined: Sat Nov 09, 2013 12:51 am
Re: Defining multiple dropdownBody styles
TIL you can select the tags with arrow keys--thanks! That will make things much easier.
They accepted my feature request about making it either mouse-selectable or updating their help section on custom dropdown styles to reflect that both sections have to be manually styled, so we'll see what they do. Thanks for your help.
They accepted my feature request about making it either mouse-selectable or updating their help section on custom dropdown styles to reflect that both sections have to be manually styled, so we'll see what they do. Thanks for your help.