Skip to content

Dev#9

Merged
moinferdi merged 5 commits into
mainfrom
dev
Jun 12, 2026
Merged

Dev#9
moinferdi merged 5 commits into
mainfrom
dev

Conversation

@moinferdi

Copy link
Copy Markdown
Owner

This pull request adds several new customization options for the chatbot widget, including support for a configurable chat title, chat title color, and avatar/profile photo, all of which can be set per site or language. It also introduces session persistence for chat messages and UI state, and improves the visual appearance and flexibility of the chat interface.

New customization options:

  • Added new fields to the page TCA (tx_chatbot_color_title, tx_chatbot_title, tx_chatbot_avatar) to allow configuration of the chat title color, chat title (per-language), and an avatar/profile photo for the assistant. These are now available in the backend and are localized where appropriate. [1] [2] [3] [4]
  • The ChatbotConfig and ConfigurationResolver classes have been updated to support and resolve the new title, title color, and avatar fields. [1] [2]
  • The ChatbotConfigProcessor now provides the localized chat title and avatar URL to the frontend, falling back to defaults if not set. [1] [2]

Frontend and UI improvements:

  • The chat widget now displays the configured chat title and avatar in the header and assistant messages. The title color is applied via a new CSS variable. [1] [2] [3]
  • Improved CSS for avatar display, message layout, and markdown formatting in chat messages.

Session persistence:

  • Added session storage for chat messages and open/closed state, so that user conversations and UI state are preserved across page reloads. [1] [2] [3] [4]

@accesslint accesslint Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Found 4 issues across 2 rules.

html = html.replace(/<\/blockquote>\n<blockquote>/g, "\n");

// Unordered lists
html = html.replace(/^[\-\*] (.+)$/gm, "<li>$1</li>");

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

WCAG 1.3.1: <li> is not contained in a <ul>, <ol>, or <menu>.

<li> elements must be contained in a <ul>, <ol>, or <menu>.

Details

List items (<li>) only have semantic meaning inside a list container (<ul>, <ol>, or <menu>). Outside of these containers, assistive technologies cannot convey the list relationship. Wrap <li> elements in the appropriate list container.


// Unordered lists
html = html.replace(/^[\-\*] (.+)$/gm, "<li>$1</li>");
html = html.replace(/((?:<li>.*<\/li>\n?)+)/g, "<ul>$1</ul>");

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

WCAG 1.3.1: <ul> contains direct text content. Wrap in <li>.

<ul> and <ol> must only contain <li>, <script>, or <template> as direct children.

Details

Screen readers announce list structure ('list with 5 items') based on proper markup. Placing non-<li> elements directly inside <ul> or <ol> breaks this structure. Wrap content in <li> elements, or if you need wrapper divs for styling, restructure your CSS to style the <li> elements directly.

@moinferdi
moinferdi merged commit 13df097 into main Jun 12, 2026
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant