 |
Resumo | AI Bot - Novo Modal de Perguntas |
 |
Repositório | GitHub - VaperinaDEV/aibot-new-question-modal |
 |
Guia de Instalação | Como instalar um tema ou componente de tema |
 |
Novo em Temas do Discourse? | Guia para iniciantes no uso de Temas do Discourse |
Instalar este componente de tema
Olá 
Discourse AI - AI Bot é necessário para usar isto.
Este componente de tema é, na verdade, uma versão modal das funções da página inicial do ask.discourse.com. Assim, você pode criar uma nova conversa com o AI Bot destinatário.
Este modal é em tela cheia, o que dá a impressão de que você está em outra página. Ou algo assim teria sido o objetivo.
As partes principais:
Avatar: O avatar do aibot tem um spinner que está sempre girando no avatar do modal, mas também indica quando ele está escrevendo.
Mensagem de IA: Você também pode usar HTML aqui.
Links rápidos: Adicione quantas perguntas desejar.
A exibição de links rápidos é limitada pelas configurações e é embaralhada quando você abre o modal novamente.
max quick links desktop padrão: 5
max quick links mobile padrão: 3
Conversas Recentes: Este botão redireciona para a página /search com os parâmetros in:messages, @aibot-username
É tudo sobre o modal. Você pode alterar e personalizar tudo nas configurações do tema. 
O botão de abertura do modal AI Bot pode ser colocado na barra lateral em 3 pontos.
-
sidebar-footer-actions
-
before-sidebar-sections
-
after-sidebar-sections
Nas configurações do tema, você pode alterar o estilo do botão.
Vamos ver as configurações do tema
Configurações do Tema
- quick_links: Aqui você pode configurar as perguntas dos botões rápidos.
- max quick links desktop: Número máximo de links rápidos exibidos no desktop
- max quick links mobile: Número máximo de links rápidos exibidos no mobile
- show_for_groups: Configuração Obrigatória. Adicione o nome do grupo para exibir o botão da barra lateral.
- aibot_id: Configuração Obrigatória. Adicione o ID do AI Bot que você deseja usar para isso.
- aibot_username: Configuração Obrigatória. Adicione o nome de usuário do AI Bot que você deseja usar para isso.
- aibot_avatar: Configuração Obrigatória. Carregue uma imagem para o AI Bot que aparece no modal.
- sibebar aibot button postition: Selecione a posição do botão da barra lateral.
- sidebar-footer-actions (padrão)
- before-sidebar-sections (topo da barra lateral)
- after-sidebar-sections (fundo da barra lateral)
- sibebar aibot button style: Selecione o estilo do botão da barra lateral.
- btn-primary (padrão)
- btn-default
- sidebar aibot button border-radius: Altere o arredondamento do botão da barra lateral.
- sidebar aibot button before icon: Altere o ícone do botão da barra lateral.
- aibot recent messages icon: Altere o ícone do botão de conversas recentes.
- modal background: Altere o fundo do modal.
- modal content wrapper background: Altere o fundo do contêiner de conteúdo do modal.
- modal content wrapper border radius: Altere o arredondamento do contêiner de conteúdo do modal.
- quick buttons style: Selecione o estilo dos botões rápidos.
- btn-primary (padrão)
- btn-default
- quick buttons border radius: Altere o arredondamento dos botões rápidos.
- mobile quick buttons wrapper border radius: Altere o arredondamento do contêiner dos botões rápidos mobile.
- aibot avatar spinner primary color: Altere a cor primária do spinner do avatar
var(--tertiary)por padrão. - aibot avatar spinner secondary color: Altere a cor secundária do spinner do avatar
#ffffffpor padrão. - aibot message border color: Esta borda fica no lado direito da mensagem.
var(--tertiary)por padrão. - textarea border-radius: Altere o arredondamento da área de texto.
- send button border radius: Altere o arredondamento do botão de envio.
- recent messages button border radius: Altere o arredondamento do botão de mensagens recentes.
- recent messages button color: Altere a cor do botão de mensagens recentes. Isso também altera a cor do ícone.
- recent messages button hover color: Altere a cor de hover do botão de mensagens recentes.
- recent messages button hover background: Altere o fundo de hover do botão de mensagens recentes.
- recent messages button border: Altere a borda do botão de mensagens recentes.
- spinner loader border: Altere a borda do carregador spinner do modal. Ele aparece quando você envia a mensagem.
- spinner loader border right color: Altere a cor do lado direito do carregador spinner.
Existem também algumas traduções de temas…
Traduções do Tema
- aibot_modal_title: Este é o título do modal.
- aibot_message: Esta é a mensagem do AI Bot no modal.
- input_placeholder: Este é o placeholder na área de texto.
- input_submit: Este é o título do botão de envio.
- input_length: Esta mensagem aparece quando o texto é muito curto.
- disclaimer: Este texto aparece abaixo da área de texto no modal.
- new_question: Este é o texto do botão da barra lateral.
- recent_messages: Este é o texto do botão de mensagens recentes do modal.
Este componente de tema oculta o botão de compartilhamento das mensagens pessoais do AI Bot. O texto
discourse_ai.ai_bot.default_pm_prefixé o título padrão do pm de IA, ele mudará automaticamente dependendo do assunto da conversa. Você pode alterá-lo em/admin/customize/site_texts
Crédito: Discourse Ask Theme
Então decidi remover os botões rápidos roláveis. Em vez disso, adicionei 2 novas configurações para controlar o número máximo de links rápidos na visualização desktop/mobile e também fiz alguns ajustes no avatar de IA modal, seção de mensagens para se adequar melhor em telas menores.