| Resumo | Um componente de tema do Discourse para criar belos layouts de linha do tempo | |
| Pré-visualização | https://meta.appinn.net/t/topic/76953 | |
| Repositório | GitHub - scavin/discourse-qingwa-timelines | |
| Guia de Instalação | Como instalar um tema ou componente de tema | |
| Novo em Temas do Discourse? | Guia para iniciantes sobre o uso de Temas do Discourse |
Instalar este componente de tema
Estou animado para compartilhar um novo componente de tema que adiciona layouts de linha do tempo elegantes à sua comunidade Discourse!
Este é o meu primeiro componente de tema, construído com a assistência de LLM.
O que é?
Discourse Timelines é um componente de tema que implementa BBCode personalizado [timelines]...[/timelines] para criar layouts de linha do tempo bonitos e minimalistas. Perfeito para roteiros de projetos, guias passo a passo, históricos de empresas, divisões de capítulos e muito mais.
Efeito de Linha do Tempo Publicado
Botão da Barra de Ferramentas do Compositor
Visualização do Editor Markdown
Principais Recursos
BBCode Personalizado - Sintaxe simples [timelines]
Botão da Barra de Ferramentas do Compositor - Não há necessidade de digitar tags manualmente (resolve o problema de escape de colchetes do novo editor!)
Design Bonito - Linha de gradiente vertical com estética limpa e minimalista
Suporte a Markdown - Preserva toda a formatação dentro das linhas do tempo
Multilíngue - Traduções integradas para 9 idiomas (EN, ZH_CN, ZH_TW, DE, ES, FR, JA, KO, RU)
Compatível com Temas - Funciona com modos claro e escuro
Personalizável - Altere facilmente as cores através das configurações de administrador
Responsivo - Layout amigável para dispositivos móveis
Seguro - Proteção XSS integrada
Sem Dependências - Usa apenas APIs nativas do Discourse
Uso
Usando o Botão da Barra de Ferramentas (Mais Fácil!)
- Abra o compositor
- Clique no botão de menu “+” (opções)
- Selecione “Inserir Linha do Tempo”
- Edite seu conteúdo
- Publique!
O botão da barra de ferramentas resolve o problema em que o novo editor do Discourse escapa automaticamente os colchetes digitados manualmente.
Exemplo de Sintaxe
[timelines]
## Janeiro de 2024 - Lançamento do Projeto
O projeto foi oficialmente iniciado e a equipe foi formada.
## Março de 2024 - Primeira Versão
O desenvolvimento da funcionalidade principal foi concluído e os testes beta começaram.
## Junho de 2024 - Versão 2.0
Atualização importante com novos recursos:
- Recurso A
- Recurso B
- Recurso C
[/timelines]
Personalização
Todas as cores podem ser personalizadas através das configurações do tema:
- timeline_gradient_start - Cor do gradiente superior (padrão:
#ff7a18) - timeline_gradient_end - Cor do gradiente inferior (padrão:
#ffb800) - timeline_heading_color - Cor do texto do título (padrão:
#d96d14) - timeline_dot_color - Cor do ponto da linha do tempo (padrão:
#ff7a18) - timeline_heading_color_dark - Cor do título no modo escuro (padrão:
#ff9854) - timeline_dot_border_color_dark - Borda do ponto no modo escuro (opcional)
Espero que você ache este componente útil! Por favor, me avise se você tiver alguma dúvida, feedback ou sugestão. ![]()




