- provide(:title, question_title(@question))
.card.question--sticky
  .container
    .card-body
      = render QuestionComponent.new(question: @question)
.container.question-page
  #answers{ data: { controller: "navigation" } }
    %button.d-none{ data: { hotkey: "j", action: "navigation#down" } }
    %button.d-none{ data: { hotkey: "k", action: "navigation#up" } }
    - if @answers.empty?
      = render "shared/empty", icon: "fa-regular fa-comments", translation_key: ".question"

    - @answers.each do |a|
      = render "answerbox", a:, show_question: false

  - if @more_data_available
    .d-flex.justify-content-center.justify-content-sm-start#paginator
      = button_to t("voc.load"), question_path(@question.user.screen_name, @question.id),
        class: "btn btn-light",
        method: :get,
        params: { last_id: @answers_last_id },
        data: { controller: :hotkey, hotkey: "." },
        form: { data: { turbo_stream: true } }

  - if user_signed_in? && !current_user.answered?(@question) && current_user != @question.user && @question.user&.privacy_allow_stranger_answers
    .card#q-answer-box
      .card-header= t(".questionbox.title")
      .card-body
        %textarea.form-control#q-answer-text{ placeholder: t("inbox.entry.placeholder"), data: { id: @question.id } }
        %br/
        %button.btn.btn-success#q-answer-btn{ data: { q_id: @question.id } }
          = t("voc.answer")