Edit colour of the Arrow only

Hi Gail,

You can currently change only the color of the arrow (or remove it completely) by adding your own CSS styles.

If you are on your dashboard, select

‘Plugins > Editor’

Once you are in the plugin editor screen, on the top hand right of the screen is a drop down containing a list of all of your installed plugins. Click the drop down and select my plugin, ‘Expand + Collapse Funk’ and click select.

Once in there, select the first .php file labled ‘expand-collapse-funk.php’ and do a search for the CSS style ‘.expand-content-link:before’. (it’s about 1/3 of the way down the page)

Once there, just add a new color style onto that decleration. For example, to make ONLY the arrow red you would just switch the existing code over to this code:
.expand-content-link:before { font-family: "ecf-icons"; content: "\e600 "; font-size:16px; color:red; }

If you wanted to just hide the arrow all together, you would do something like this:
.expand-content-link:before { font-family: "ecf-icons"; content: "\e600 "; font-size:16px; display:none; }

I hope this helps!

-Evan

Hi Evan,

I really like the plug-in.

As you mentioned that to hide the arrow, we can add display:none;
Is it possible to add line above the content link just like in this website: https://somatheeram.org/en/ayurveda/packages

Thank you in advance.

Regards,
Shivi

Can you provide a link to the page where you would like to achieve this? You can get this done through the use of CSS selectors and a few style declarations using borders.

Thanks,
Evan

Thanks for the prompt reply. Here is the link
https://www.nilgiri.ch/?page_id=109

@evan

Yes I added the borders in the following CSS selectors and its working the way I wanted.
.exp-col-content-holder { margin:15px 0px 15px 0 !important; border-top-style: solid; border-top-width: 1px; border-top-color: #000784; }

Thanks
Shivi