{% extends '__layout__.html' %}
{% block title %}SSO Login{% endblock %}
{% block head %}
<link href="/static/css/settings.css" rel="stylesheet"/> <!-- Its just easier to resuse this-->
<style>
    .text-secondary {
        color: rgb(200,200,200) !important;
    }
</style>
{% endblock %}
{% block content %}
<div id="main">
    <div class="settings-container p-3 d-flex" style="background-color: rgb(26, 26, 26);box-shadow: 0px 0px 10px 0px rgb(0,0,0,0.5);max-width: 600px;">
        <div>
            <img src="/Thumbs/Head.ashx?x=100&y=100&userId={{currentuser.id}}" style="aspect-ratio: 1/1;" class="rounded border" width="100px">
            <p class="m-0 text-secondary text-center" style="font-size: 12px;">Logged in as <b class="text-white">{{currentuser.username}}</b></p>
        </div>
        <div class="ms-3">
            <h1 class="m-0 mb-1">Authorise SYNTAX Forums</h1>
            <p class="text-secondary m-0">
                SYNTAX Forums is a official website hosted by syntax.eco, authorising will allow SYNTAX Forums to access the following information:
            </p>
            <ul class="text-secondary m-0">
                <li>Username</li>
                <li>User ID</li>
            </ul>
            <form method="post">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
                <button type="submit" class="btn btn-primary w-100 text-center btn-sm mt-2">Authorise Login</button>
            </form>
            <p class="text-secondary m-0 mt-2" style="font-size: 12px;">You will be redirected to <span class="text-white" style="background-color: rgb(44, 44, 44);padding: 2px;">{{baseurl}}/session/sso_login</span></p>
        </div>
    </div>
</div>
{% endblock %}