baobeld/benjaminpalko
1
0
Fork 0
Code Pull requests Packages 2 Activity Actions
benjaminpalko/.opencode/skills/daisyui/components/chat.md
Benjamin Palko f526f5c0aa
Some checks failed
Deploy / deploy (push) Failing after 39s
Details
set up new workflow and migrate to .forgejo dir (#5) 
Co-authored-by: Benjamin Palko <benjaminpalko@hotmail.com>
Reviewed-on: #5
2026-08-11 20:55:29 -04:00

973 B
Raw Blame History

chat

Chat bubbles are used to show one line of conversation and all its data, including the author image, author name, time, etc

chat docs

Class names

  • component: chat
  • part: chat-image, chat-header, chat-footer, chat-bubble
  • placement: chat-start, chat-end
  • color: chat-bubble-neutral, chat-bubble-primary, chat-bubble-secondary, chat-bubble-accent, chat-bubble-info, chat-bubble-success, chat-bubble-warning, chat-bubble-error

Syntax

<div class="chat {PLACEMENT}">
	<div class="chat-image"></div>
	<div class="chat-header"></div>
	<div class="chat-bubble {COLOR}">Message text</div>
	<div class="chat-footer"></div>
</div>

Rules

  • {PLACEMENT} is required and must be either chat-start or chat-end
  • {COLOR} is optional and can have one of the color class names
  • To add an avatar, use <div class="chat-image avatar"> and nest the avatar content inside