Optionally display a more detailed version of the help text for a question.

[chsinn]

Rationale / Begründung

Long help texts are tiring to read and can be off-putting. A more detailed version of the help text could only be displayed if the user clicks on "Read more".

Minimal functionality

Clicking on "read more" enlarges the text box and more paragraphs appear without reloading the web page.

References / Verweise

• rdmo v1.92

[jochenklar]

I would implement this as a custom markdown tag, something like the <!-- more --> wordpress had, at least when I last used it. We already do that with the [text]{tooltip} syntax.

[MyPyDavid]

There is currently a help text in the DFG Checklist catalog that uses the html <details> element. It also has a style="color:blue; cursor:pointer;" hard coded in it which is not so desirable when someone wants to have another color for example.
The <details> and <summary> may behave different depending on browsers (https://www.scottohara.me/blog/2022/09/12/details-summary.html) but it works as html in the helptext.
Could this also be an option and include the style in the rdmo .scss files?

/* in rdmo/core/static/core/css/base.scss */
summary {
    color: $details-summary-color;
    cursor: $details-summary-cursor;
}

/* rdmo/core/static/core/css/variables.scss */
/* details summary */
$details-summary-color: #101F70;
$details-summary-cursor: pointer;

[jochenklar]

I would not add additional colors, but use those which are already available in variables.scss, we could add something like $summary-color: $link-color; or something. I don't see why details should have a pointer cursor, but maybe I am missing something.

[MyPyDavid]

ok, good idea to use the $link-color for that. The pointer cursor is there to make it look like a clickable element when hovering over with the mouse I think, otherwise it looks like a normal text..

[jochenklar]

I had a look at display/summary again and I would rather go with:

details {
    margin-bottom: 10px;
}

summary {
    display: list-item;
    cursor: pointer;
    margin-bottom: 5px;
}

(not changing the color).

@MyPyDavid ok?

[MyPyDavid]

think it's fine, this will be adaptable in the theme anyway right?