||||\n-|-|-|\n:discourse2: | Resumo | Mint - Um tema moderno com um toque de hortelã.
\n|
| Pré-visualização | Pré-visualização no Discourse Theme Creator\n:hammer_and_wrench: | Link do Repositório | \u003chttps://github.com/discourse/discourse-mint-theme\u003e\n:open_book: |Novo nos Temas do Discourse? | Guia para iniciantes sobre como usar temas do Discourse\n\n[wrap=theme-install-button repoUrl="https://github.com/discourse/discourse-mint-theme\" repoName="Mint Theme"]\nInstalar este tema\n[/wrap]\n\n[quote]\n\n:discourse2: Como este é um tema #oficial mantido pela equipe do Discourse, problemas de #suporte, relatórios de #bugs, sugestões de UX e solicitações de conselhos de Dev podem ser feitos nas respectivas categorias aqui no Meta, e marcados com a tag de tema apropriada. Clique em um link abaixo para iniciar um.
\n\n\u003ckbd\u003e [
\u0026nbsp;Suporte](https://meta.discourse.org/new-topic?category_id=6\u0026tags=mint-theme "Perguntar sobre suporte na configuração e uso do Tema Mint") \u003c/kbd\u003e \u003ckbd\u003e [
\u0026nbsp;Bug](https://meta.discourse.org/new-topic?category_id=1\u0026tags=mint-theme "Um relatório de bug significa que algo está quebrado, impedindo o uso normal/típico do tema") \u003c/kbd\u003e \u003ckbd\u003e [
\u0026nbsp;UX](https://meta.discourse.org/new-topic?category_id=9\u0026tags=mint-theme "Discussão sobre a interface do usuário do Tema Mint, e como os recursos são apresentados (incluindo idioma e elementos da interface)") \u003c/kbd\u003e \u003ckbd\u003e [
\u0026nbsp;Dev](https://meta.discourse.org/new-topic?category_id=7\u0026tags=mint-theme "Conselhos sobre como personalizar este tema para o seu site")\u003c/kbd\u003e\n\n[/quote]\n\n### Recursos\n\nUm tema moderno com um toque de hortelã.
\n\n:herb:
\n\nPágina Inicial (categorias)\n\n
\n\n
\n\nMais Recentes\n\n
\n\nTópico\n\n
\n\n\nBusca Avançada\n\n
\n\nEste tema inclui o seguinte componente:\n\n- Categorias em Destaque do Discourse\n\n### Dicas\n\n### Configurações do Discourse\n\nAs seguintes alterações de configuração são necessárias para que este tema seja renderizado corretamente:\n\n- menu superior precisa ser definido como category, latest, new, unread, top\n- estilo da página de categoria da área de trabalho precisa ser definido como Caixas com Subcategorias\n\n### Banner de Boas-vindas\n\nVá para a página Admin \u003e Banner de boas-vindas (/admin/config/welcome-banner).\n\n- no menu suspenso Habilitado em temas… selecione Mint Theme\n- no menu suspenso Visibilidade da página selecione Somente página inicial\n- no menu suspenso Localização selecione Abaixo do cabeçalho do site\n- Imagem de fundo pode ser definida conforme sua necessidade\n\n[^update]: A partir de 4 de outubro de 2022 e este commit, o tema em si irá automaticamente definir e ordenar os componentes do tema nas saídas corretas.\n\n### Categorias em Destaque do Discourse\n\nNas opções para o componente de tema Categorias em Destaque, as seguintes alterações são necessárias para que este tema seja renderizado corretamente:\n\n- selecione feed one category e feed two category conforme sua necessidade\n- preencha feed one title e feed two title conforme sua necessidade\n- o valor recomendado para max list length é 3.\n\n\u003cbr\u003e\n\n\u003e:discourse2: Hospedado por nós? Temas estão disponíveis para uso em nossos planos Standard, Business e Enterprise.
tema muito legal ![]()
Até posso testá-lo com azul royal (minha cor favorita) no meu site de testes.
Obrigado ![]()
@meghna criando temas incríveis. Ficou ótimo. Vou implantar e testar.
Tema lindo! Obrigado por criar isso ![]()
Estava me perguntando se há uma maneira de eu remover o quadrado e o círculo no fundo. Agradeço qualquer coisa que possa me apontar na direção certa ![]()
Remova
#main-outlet:after {
content: "";
display: block;
position: fixed;
z-index: -1;
width: 500px;
height: 500px;
border-radius: 2000px;
background: $color-blue;
right: 1px;
top: -57px;
}
#main-outlet:before {
content: "";
display: block;
position: fixed;
z-index: -1;
width: 300px;
height: 300px;
border-radius: 30px;
background: -webkit-linear-gradient(146deg, rgba(74,247,255,.08) 55%, rgba(143,236,202,.52) 100%);
// background: linear-gradient(146deg, rgba(74,247,255,.08) 55%, rgba(143,236,202,.52) 100%);
background: linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
left: 70px;
top: 350px;
transform: rotate(74deg);
transform-origin: 0 100%;
}
do desktop.scss e você estará pronto para seguir ![]()
Muito obrigado, Tomasz, aprecio isso ![]()
Este tema é incrível. Obrigado por criá-lo! Sou novo no cenário do Discourse. Sei como fazer o upload deste tema, mas não tenho certeza de como alterar certas coisas. O que quero mudar são as cores dos blocos no fundo (o círculo e o quadrado). Além disso, gostaria de mudar a cor de fundo. Devo baixar o arquivo do tema, editá-lo e, em seguida, criar o meu próprio tema? Ou existe uma maneira mais fácil?
Obrigado! ![]()
Sim. Para alterar as cores, você precisa fazer um fork do tema e atualizar o código da cor conforme sua necessidade. Veja como fazer:
Em variables.scss, altere o código da cor conforme sua preferência:
$color-blue: #e5f8ff;
$color-square-gradient: linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
$color-square-webkit-gradient: -webkit-linear-gradient(4deg, rgba(143,236,202,.29) 55%, rgba(74, 247, 255, 0.08) 100%);
Para alterar a cor de fundo, atualize a cor secondary em about.json (observe que isso também alterará a cor do texto de alguns botões):
"secondary": "F6FBFC"
Adoro este tema — ele se encaixa perfeitamente na identidade visual do nosso projeto! No entanto, se eu ativar o modo escuro, o tema fica desconfigurado. Isso é esperado? Existe alguma maneira de impedir que os usuários ativem o modo escuro?
Existem duas pequenas questões com o editor.
O botão de engrenagem tem um fundo sempre ativo e a forma do primeiro botão ao passar o mouse não corresponde à curvatura da moldura:
Corrigidos ambos os problemas via:
Eu realmente gosto do seu tema e o instalei.
O fundo do meu banner de pesquisa não tem cantos arredondados e não ocupa toda a largura.
Como posso mudar isso para o seu layout?
Pode haver a possibilidade de outro tema ou componente estar interferindo na estilização do tema mint. Você pode tentar desativar outros temas/componentes que você possa ter instalado?
é uma instalação limpa com o tema padrão inativo e apenas estes componentes:
- discourse-search-banner
- Showcased Categories
Isso é estranho. Você pode me enviar o URL da sua instância do Discourse por mensagem privada e eu posso dar uma olhada?
O problema do banner foi corrigido via:
Também houve um problema no plugin de categorias em destaque que Patrick chamou minha atenção. Corrigi isso também.
Olá, eu brinquei com o modo escuro em um dispositivo com um tema Mint agradável. Fiz algumas alterações para suportar o modo escuro. Apenas para testes.
discourse-mint.zip (5,1 KB) Pode conter erros, é claro
Por esse motivo, não criarei um PR de github.
Fiz algumas modificações para blocos de código, formatação no estilo gitlab, página ampla, etc… Não testei em dispositivos móveis.
Obrigado pelos esforços, Ivan! Revisei seu trabalho e há algumas alterações personalizadas que não precisam estar no núcleo. Vou analisar as alterações específicas do modo escuro e as farei no núcleo após mais testes.
De nada, Meghna! Acho que seria suficiente aplicar o valor revert a alguns elementos com branco.


