website/islands/AiChatBox.css

65 lines
1.1 KiB
CSS
Raw Normal View History

.islands__ai_chat_box__button {
color: var(--_font-color);
border: var(--_border-size) solid transparent;
outline: none;
background-color: transparent;
&:active,
&:focus-visible {
border-color: currentColor;
}
}
.islands__ai_chat_box__dialog {
justify-content: center;
align-content: end;
width: 80%;
height: 80%;
border: var(--_border-size) solid currentColor;
background: var(--_background-image) repeat top left / 800px;
background-color: var(--_background-color);
&[open] {
display: grid;
}
}
.islands__ai_chat_box__dialog__content {
overflow-y: scroll;
display: grid;
align-content: end;
gap: var(--_gap);
max-height: 100%;
overscroll-behavior: contain;
& div {
display: block;
}
}
.islands__ai_chat_box__history__user {
justify-self: right;
}
.islands__ai_chat_box__history__bot {
justify-self: left;
}
.islands__ai_chat_box__dialog__form {
display: flex;
gap: var(--_gap);
color: var(--_font-color);
& > * {
background-color: var(--_translucent);
outline: none;
padding: var(--_gap-half);
border: var(--_border-size) solid transparent;
}
& > *:active,
& > *:focus-visible {
border-color: currentColor;
}
}