{% extends "app" %}
{% block title %}Settings{% endblock %}
{% block content %}
    <div class="flex flex-col py-8">
        <div class="-my-2 py-2 overflow-x-auto sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8">
            <form action="" method="POST">
                <div>
                    <div>
                        <div class="">
                            <div class="">
                                <div role="group" aria-labelledby="label-email">
                                    <div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-baseline">
                                        <div>
                                            <div class="text-base leading-6 font-medium text-gray-900 sm:text-sm sm:leading-5 sm:text-gray-700" id="label-email">
                                                Authentication
                                            </div>
                                        </div>
                                        <div class="mt-4 sm:mt-0 sm:col-span-2">
                                            <div class="max-w-lg">
                                                <div class="relative flex items-start">
                                                    <div class="absolute flex items-center h-5">
                                                        <input id="authentication"
                                                               type="checkbox"
                                                               name="validate_auth_tokens"
                                                               value="1"
                                                               {% if configuration.validate_auth_tokens %} checked="checked" {% endif %}
                                                               class="form-checkbox h-4 w-4 text-indigo-600 transition duration-150 ease-in-out" />
                                                    </div>
                                                    <div class="pl-7 text-sm leading-5">
                                                        <label for="authentication" class="font-medium text-gray-700">Require authentication tokens</label>
                                                        <p class="text-gray-500">Only allow connection from clients with valid authentication tokens</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="mt-8 border-t border-gray-200 pt-5">
                    <div class="flex justify-end">
      <span class="inline-flex rounded-md shadow-sm">
        <button type="button"
                class="py-2 px-4 border border-gray-300 rounded-md text-sm leading-5 font-medium text-gray-700 hover:text-gray-500 focus:outline-none focus:border-blue-300 focus:shadow-outline-blue active:bg-gray-50 active:text-gray-800 transition duration-150 ease-in-out">
          Cancel
        </button>
      </span>
                        <span class="ml-3 inline-flex rounded-md shadow-sm">
        <button type="submit"
                class="inline-flex justify-center py-2 px-4 border border-transparent text-sm leading-5 font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 focus:shadow-outline-indigo active:bg-indigo-700 transition duration-150 ease-in-out">
          Save
        </button>
      </span>
                    </div>
                </div>
            </form>
        </div>
    </div>
{% endblock %}