tildes/tildes/tildes/templates/settings.jinja2

{# Copyright (c) 2018 Tildes contributors <code@tildes.net> #}
{# SPDX-License-Identifier: AGPL-3.0-or-later #}

{% extends 'base_user_menu.jinja2' %}

{% block title %}User settings{% endblock %}

{% block main_heading %}User settings{% endblock %}

{% block content %}
<section class="settings-section">
  <h2 id="display-settings">Display settings</h2>

  <ul class="settings-list">
    <li>
      <label for="theme">Choose a display theme:</label>

      <form
        class="form-inline"
        name="account-default-theme"
        data-ic-patch-to="{{ request.route_url(
          'ic_user',
          username=request.user.username
        ) }}"
      >
        <select class="form-select col-8 col-sm-12" name="theme" id="theme" data-js-theme-selector>
          {% for theme, description in theme_options.items() %}
            <option
              value="{{ theme }}"
              {{ 'selected' if theme == request.current_theme else '' }}
            >
              {{ description }}
            </option>
          {% endfor %}
        </select>

        <button id="button-set-default-theme" class="btn btn-link d-none">
          Set as account default
        </button>
      </form>

      <a href="{{ request.route_url("settings_theme_previews") }}">View theme previews</a>
    </li>

    <li>
      <form
        name="show-tags-in-listings"
        autocomplete="off"
        data-ic-patch-to="{{ request.route_url('ic_user', username=request.user.username) }}"
      >
        <div class="form-group">
          <label class="form-checkbox">
            <input
              type="checkbox"
              id="show_tags_in_listings"
              name="show_tags_in_listings"
              data-js-autosubmit-on-change
              {% if request.user.show_tags_in_listings %}checked{% endif %}
            >
            <i class="form-icon"></i> Show topic tags in listing pages (home page, groups, etc.)
          </label>
        </div>
      </form>
    </li>
    <li>
      <a href="/settings/filters">Define topic tag filters</a>
      <div class="text-small text-secondary">Define a list of topic tags to filter out of listings by default</div>
    </li>
  </ul>
</section>

<section class="settings-section">
  <h2 id="site-behavior-settings">Site behavior settings</h2>

  <ul class="settings-list">
    <li>
      <form
        name="account-default-comment-sort-order"
        data-ic-patch-to="{{ request.route_url(
          'ic_user',
          username=request.user.username
        ) }}"
      >
        <label class="form-label" for="comment-sort-order">Choose a default comment sort order:</label>
        <select
          class="form-select"
          name="comment-sort-order"
          id="comment-sort-order"
          data-js-autosubmit-on-change
        >
          {% for sort_option in comment_sort_order_options %}
            <option
              value="{{ sort_option.name }}"
              {{ 'selected' if current_comment_sort_order == sort_option else '' }}
            >{{ sort_option.description|capitalize }}</option>
          {% endfor %}
        </select>
      </form>
    </li>

    <li>
      <form
        name="collapse-old-comments"
        autocomplete="off"
        data-ic-patch-to="{{ request.route_url('ic_user', username=request.user.username) }}"
      >
        <div class="form-group">
          <label class="form-checkbox">
            <input
              type="checkbox"
              id="collapse_old_comments"
              name="collapse_old_comments"
              data-js-autosubmit-on-change
              {% if request.user.collapse_old_comments %}checked{% endif %}
            >
            <i class="form-icon"></i> Collapse old comments when I return to a topic
          </label>
        </div>
      </form>
    </li>

    <li>
      <h4>Open links in new tabs</h4>
      <form
        name="open-links-new-tab"
        autocomplete="off"
        data-ic-patch-to="{{ request.route_url('ic_user', username=request.user.username) }}"
      >
        <ul class="settings-list">
          <li>
            <div class="form-group">
              <label class="form-checkbox">
                <input
                  type="checkbox"
                  id="open_new_tab_external"
                  name="open_new_tab_external"
                  data-js-autosubmit-on-change
                  {% if request.user.open_new_tab_external %}checked{% endif %}
                >
                <i class="form-icon"></i> Topic links to other websites
              </label>
            </div>
          </li>
          <li>
            <div class="form-group">
              <label class="form-checkbox">
                <input
                  type="checkbox"
                  id="open_new_tab_internal"
                  name="open_new_tab_internal"
                  data-js-autosubmit-on-change
                  {% if request.user.open_new_tab_internal %}checked{% endif %}
                >
                <i class="form-icon"></i> Links to text topics and comments
              </label>
            </div>
          </li>
          <li>
            <div class="form-group">
              <label class="form-checkbox">
                <input
                  type="checkbox"
                  id="open_new_tab_text"
                  name="open_new_tab_text"
                  data-js-autosubmit-on-change
                  {% if request.user.open_new_tab_text %}checked{% endif %}
                >
                <i class="form-icon"></i> External links in topic, comment, and message text
              </label>
            </div>
          </li>
          <li>
            <div class="form-group">
              <label class="form-checkbox">
                <input
                  type="checkbox"
                  id="open_new_tab_group"
                  name="open_new_tab_group"
                  data-js-autosubmit-on-change
                  {% if request.user.open_new_tab_group %}checked{% endif %}
                >
                <i class="form-icon"></i> Links to groups on Tildes
              </label>
            </div>
          </li>
          <li>
            <div class="form-group">
              <label class="form-checkbox">
                <input
                  type="checkbox"
                  id="open_new_tab_user"
                  name="open_new_tab_user"
                  data-js-autosubmit-on-change
                  {% if request.user.open_new_tab_user %}checked{% endif %}
                >
                <i class="form-icon"></i> Links to users on Tildes
              </label>
            </div>
          </li>
        </ul>
      </form>
    </li>
  </ul>
</section>

<section class="settings-section">
  <h2 id="notification-settings">Notification settings</h2>

  <ul class="settings-list">
    <li>
      <form
        name="interact-mark-notifications-read"
        autocomplete="off"
        data-ic-patch-to="{{ request.route_url('ic_user', username=request.user.username) }}"
      >
        <div class="form-group">
          <label class="form-checkbox">
            <input
              type="checkbox"
              id="interact_mark_notifications_read"
              name="interact_mark_notifications_read"
              data-js-autosubmit-on-change
              {% if request.user.interact_mark_notifications_read %}checked{% endif %}
            >
            <i class="form-icon"></i> Automatically mark notifications read when you interact with the source comment (by voting, labeling, replying, etc.)
          </label>
        </div>
      </form>
    </li>

    <li>
      <form
        name="auto-mark-notifications-read"
        autocomplete="off"
        data-ic-patch-to="{{ request.route_url('ic_user', username=request.user.username) }}"
      >
        <div class="form-group">
          <label class="form-checkbox">
            <input
              type="checkbox"
              id="auto_mark_notifications_read"
              name="auto_mark_notifications_read"
              data-js-autosubmit-on-change
              {% if request.user.auto_mark_notifications_read %}checked{% endif %}
            >
            <i class="form-icon"></i> Automatically mark all notifications read when you view the Unread Notifications page
          </label>
        </div>
      </form>
    </li>

  </ul>
</section>

<section class="settings-section">
  <h2 id="account-settings">Account settings</h2>

  <ul class="settings-list">
    <li>
      <a href="/settings/bio">Edit your user bio</a>
      <div class="text-small text-secondary">Tell others about yourself with a short bio on your user page</div>
    </li>
    <li>
      <a href="/settings/account_recovery">Set up account recovery</a>
      <div class="text-small text-secondary">To be able to regain access in case of lost password, compromise, etc.</div>
    </li>
    <li><a href="/settings/password_change">Change your password</a></li>
    <li>
      {% if not request.user.two_factor_enabled %}
        <a href="/settings/two_factor">Enable two-factor authentication</a>
        <div class="text-small text-secondary">For extra security, you can enable two-factor authentication.</div>
      {% else %}
        <a href="/settings/two_factor">Two-factor authentication</a>
        <div class="text-small text-secondary">View your backup codes or disable two-factor authentication.</div>
      {% endif %}
    </li>
  </ul>
</section>

{% endblock %}