remix-nlux
Version:
Remix IDE NLUX integration. Remix IDE is the leading IDE for building and deploying smart contracts on Ethereum. NLUX is a JavaScript and React library for building conversational AI experiences.
41 lines (33 loc) • 1.23 kB
CSS
.nlux-comp-chatItem.nlux-comp-chatItem--bubblesLayout {
align-items: var(--nlux-chItm--algnItms);
> .nlux-comp-message {
padding: var(--nlux-chItm-mmsg-bblLt--pdng-tpBtm) var(--nlux-chItm-mmsg-bblLt--pdng-lr);
border-width: var(--nlux-chItm-mmsg-bblLt--brdrWd);
border-style: solid;
border-radius: var(--nlux-chItm-mmsg-bblLt--brdrRd);
}
> .nlux-comp-chatItem-participantInfo > .nlux-comp-avatar {
border-width: var(--nlux-chItm-mmsg-bblLt--brdrWd);
}
> .nlux-comp-chatItem-participantInfo > .nlux-comp-chatItem-participantName {
display: none;
}
&.nlux-comp-chatItem--sent {
flex-direction: row-reverse;
padding-left: 65px;
> .nlux-comp-message {
color: var(--nlux-hmMsg--txtClr);
border-color: var(--nlux-hmMsg--brdClr);
background-color: var(--nlux-hmMsg--bgClr);
}
}
&.nlux-comp-chatItem--received {
flex-direction: row;
padding-right: 65px;
> .nlux-comp-message {
color: var(--nlux-aiMsg--txtClr);
border-color: var(--nlux-aiMsg--brdClr);
background-color: var(--nlux-aiMsg--bgClr);
}
}
}