michael-milette / moodle-filter_filtercodes

FilterCodes filter for Moodle enables content creators to easily customize and personalize course and site content using plain text tags (no HTML). For premium support, contact us at https://www.tngconsulting.ca/contact
https://moodle.org/plugins/filter_filtercodes
GNU General Public License v3.0
32 stars 43 forks source link

Feature request - details/summary tag enhancement #229

Closed andrewrowatt closed 1 year ago

andrewrowatt commented 1 year ago

Hi Michael & team,

We are starting to promote the use of {details}{summary}{/summary}{/details}. But, some users have asked for some visual (CSS) presets e.g., the summary content should look like a heading or can the widget be presented in "accordion" style when they are stacked.

I was thinking that a potential implementation is for the {details} tag to allow for an optional parameter e.g., {details style1} or {details style2} which would generate the HTML . My theme stylesheet would contain the relevant CSS i.e., this would not be part of the FilterCode code.

I am happy to get this developed as long as you don't think it goes against your plans.

A couple of samples are below.

I would also note that I will not be overriding default (browser) styling of details/summary.

Thanks, Andrew

/ Sample #1 - Simple / details.style1 {} details.style1 > summary {font-weight:bold;}

/ Sample #2 "Accordian", useful for when a number of details/summary blocks are stacked e.g., for a simple FAQ set / details.style2 { border: 1px solid #eee; padding: .5em .5em 0; background-color:#eee;

}

details.style2[open] { padding: .5em; }

details.style2[open] > summary + p + p { padding-top: .5em; }

details.style2 > summary { margin: -.5em -.5em 0; padding: .5em; font-weight:bold; background-color:#ddd; }

andrewrowatt commented 1 year ago

Sorry, added with wrong github account.