Copilot plugin chat container CSS snippet

My first CSS snippet, wooohooo.
I had two kinds of issues with the chat bot output: the text size I found a little too big – for longer responses, I might want to take in the whole of the output…but I’d usually want to copy the response anyway, which, when the response was lengthy, was difficult as the copy button was at the head of the individual output, so I needed to scroll up (which is kind of slow for some reason). Therefore, I put the copy button (which I made a tad bigger) on the bottom.

Someone may find it useful (feel free to change stuff around in it):

div.chat-container {
  /* Styles for the chat container */
}

div.chat-container div.message.bot-message {
  font-size: 13px;
}

div.chat-container button.copy-message-button {
  align-self: flex-end;
  width: 30px;
  height: 30px;
  padding: 6px;
}
1 Like

This no longer seems to work and the copy button was fixed by the dev.

I am using for the latest 2.7.15 version:

div.chat-container {
  font-size: 11px;}

div.chat-container div.message.bot-message {
  font-size: 11px;
}

.text-muted {
  font-size: 11px;
}

.text-sm {
  font-size: 11px;
}

.chat-icons-container {
    width: 100%;
    padding: 0 0 0px;
}

Now I am able to see all my models as well, as there is no way to scroll on the models.