O botão Responder no rodapé do tópico pode quebrar a thread

Contribuir Experiência do Usuário
11

Obrigado por isso, Don. Eu queria fazer isso por anos! Levei sua ideia um passo adiante para minhas necessidades. Como meu site é um pouco diferente e cada categoria é diferente e não apenas discussões diretas, escolhi mudar completamente o texto do botão de resposta. Portanto, para minha categoria de crítica de imagens, mudei para “Dar Crítica ou Responder”, adicionando o “ou Responder”, acredito que contorne a preocupação de Jakke. Obrigado por levantar isso, Jakke, inicialmente eu o configurei apenas para “Dar Crítica”, mas você está certo de que isso não funciona para todas as situações.

Eu não gosto do truque font-size: 0;, mas por algum motivo não consegui fazer o truque visibility: hidden; funcionar com isso. Além disso, tentei definir o font-size para 1em em vez de px, mas isso também não pareceu funcionar. Acabei optando por uma fonte um pouco maior para fazer esse botão se destacar, mas preferiria usar em para que a fonte escale.

// Crítica de Imagem
body.category-image-critiques-abstract-critiques,
body.category-image-critiques-avian-critiques,
body.category-image-critiques-flora-critiques,
body.category-image-critiques-human-fauna-critiques,
body.category-image-critiques-landscape-critiques,
body.category-image-critiques-macro-critiques,
body.category-image-critiques-night-critiques,
body.category-image-critiques-non-nature-critiques,
body.category-image-critiques-wildlife-critiques,
body.category-image-critiques-weekly-challenge {
  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label {
          // ocultar texto de resposta
          font-size: 0;
        }
      }
    }
  }

  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label:after {
          // Novo texto
          font-size: 18px;
          content: "Critique Image or Reply";
        }
      }
    }
  }
}

Isso é especialmente ótimo para minha categoria AMA, onde mudei o botão de resposta para “Fazer Pergunta”, perfeito! Também ajuda a pessoa que está fazendo o AMA a entender que ela precisa usar o pequeno botão de resposta.

// AMA
body.category-learning-ama {
  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label {
          // ocultar texto de resposta
          font-size: 0;
        }
      }
    }
  }

  #topic-footer-buttons {
    .topic-footer-main-buttons {
      button.btn-primary.create {
        span.d-button-label:after {
          // Novo texto
          font-size: 18px;
          content: "Ask a question";
        }
      }
    }
  }
}

Também defini uma cor de fundo para o botão de resposta para que ele se destaque um pouco mais. Ainda não descobri como fazer a transição corretamente para o hover, alguma ideia sobre isso seria útil…

.discourse-no-touch .topic-body .actions .fade-out {
    background: var(--primary-low);
}

image
image1880×1430 116 KB

Enfim, espero que minhas divagações ajudem outros!

2 curtidas