{% extends 'user.base' %}

{% block title %}{{ trans('general.dashboard') }}{% endblock %}

{% block content %}
  <div class="row">
    <div class="col-md-7">
      <div class="card" id="usage-box">
        <div class="card-header"></div>
        <div class="card-body"></div>
        <div class="card-footer"></div>
      </div>
    </div>

    <div class="col-md-5">
      <div class="card card-primary card-outline">
        <div class="card-header">
          <h3 class="card-title">{{ trans('user.announcement') }}</h3>
          {% if auth_user().admin %}
            &nbsp;
            <a href="{{ url('/admin/options') }}">
              <i class="fas fa-edit"></i>
            </a>
          {% endif %}
        </div>
        <div class="card-body">
          {{ announcement|raw }}
        </div>
      </div>
    </div>
  </div>
{% endblock %}

{% block before_foot %}
  <div id="modal-score-instruction" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">{{ trans('user.score-intro.title') }}</h4>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          {{ score_intro|nl2br }}
          <hr />
          <div class="row">
            {% for key, value in rates %}
              <div class="col-md-4">
                <p class="text-center">
                  {{ trans("user.score-intro.rates.#{key}", {score: value}) }}
                </p>
              </div>
            {% endfor %}
          </div>
        </div>
        <div class="modal-footer">
          <button class="btn btn-default" data-dismiss="modal">{{ trans('general.close') }}</button>
        </div>
      </div>
    </div>
  </div>

  <script>
    Object.defineProperty(blessing, 'extra', {
      get: () => Object.freeze({{ extra|json_encode|raw }})
    })
  </script>
{% endblock %}