refactor(chatTrigger): Add new chatTrigger tailwind constants classes

This commit is contained in:
Igor Carvalho 2023-07-07 13:31:35 -03:00
commit d718b153da
2 changed files with 12 additions and 5 deletions

View file

@ -45,7 +45,7 @@ export default function ChatTrigger({ open, setOpen, isBuilt, canOpen }) {
<button
onClick={handleClick}
className={
"shadow-round-btn-shadow hover:shadow-round-btn-shadow fixed bottom-4 right-4 flex h-12 w-12 items-center justify-center rounded-full bg-border px-3 py-1 shadow-md transition-all " +
"shadow-round-btn-shadow hover:shadow-round-btn-shadow message-button " +
(!isBuilt || !canOpen ? "cursor-not-allowed" : "cursor-pointer")
}
>
@ -54,8 +54,8 @@ export default function ChatTrigger({ open, setOpen, isBuilt, canOpen }) {
className={
"h-6 w-6 transition-all " +
(isBuilt && canOpen
? "fill-chat-trigger stroke-chat-trigger stroke-1"
: "fill-chat-trigger-disabled stroke-chat-trigger-disabled stroke-1")
? "message-button-icon"
: "disabled-message-button-icon")
}
style={{ color: "white" }}
strokeWidth={1.5}

View file

@ -217,6 +217,10 @@ The cursor: default; property value restores the browser's default cursor style
.input-dialog{
@apply text-ring cursor-pointer bg-transparent
}
.message-button {
@apply message-button-position flex h-12 w-12 items-center justify-center rounded-full bg-border px-3 py-1 shadow-md transition-all
}
.round-button-form {
@apply flex h-12 w-12 cursor-pointer justify-center rounded-full bg-border px-3 py-1 shadow-md
}
@ -230,10 +234,13 @@ The cursor: default; property value restores the browser's default cursor style
@apply w-6 fill-build-trigger stroke-1 stroke-build-trigger
}
.message-button-position {
@apply absolute bottom-4 right-3
@apply fixed bottom-4 right-4
}
.message-button-icon {
@apply w-6 fill-chat-trigger stroke-chat-trigger stroke-1
@apply fill-chat-trigger stroke-chat-trigger stroke-1
}
.disabled-message-button-icon {
@apply fill-chat-trigger-disabled stroke-chat-trigger-disabled stroke-1
}
.components-disclosure-arrangement {
@apply -mt-px flex w-full select-none items-center justify-between border-y border-y-input bg-muted px-3 py-2