diff --git a/authentication_discord.html b/authentication_discord.html
index 89a083c..72fa1ad 100644
--- a/authentication_discord.html
+++ b/authentication_discord.html
@@ -1,4 +1,185 @@
-<html>
-<head><title>Discord Prouf</title></head>
-<body>POSOSI</body>
-</html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
+    <title>Discord Prouf</title>
+</head>
+<body>
+    <div class="container">
+        <div class="flex row justify-content-center">
+            <div class="col-sm-6">
+                <h1 style="text-align: center;" class="pt-3">Выполняй действия по порядку...</h1>
+                <h5 style="text-align: center;">steam(1) -> discord(2) -> role(3)</h1>
+                <div class="row justify-content-center">
+                    <div class="col pt-4" id="steam_card" hidden>
+                        <div class="card">
+                          <div class="card-body">
+                            <h5 class="card-title">Авторизация в Steam</h5>
+                            <p class="card-text" id="steam_text">Ты сейчас не авторизован</p>
+                            <a href="/api/auth/login?authentication_discord=true" class="btn btn-primary">Войти через стим</a>
+                          </div>
+                        </div>
+                      </div>
+                </div>
+                <div class="row justify-content-center">
+                    <div class="col pt-4" id="discord_card" hidden>
+                        <div class="card">
+                            <div class="card-body">
+                            <h5 class="card-title">Авторизация в Discord</h5>
+                            <p class="card-text" id="discord_text">Ты сейчас не авторизован</p>
+                            <a href="/api/auth/discord/login" class="btn btn-primary">Войти через дискорд</a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="row justify-content-center">
+                    <div class="col pt-4" id="role_card" hidden>
+                        <div class="card">
+                          <div class="card-body">
+                            <h5 class="card-title">Получить роль</h5>
+                            <p class="card-text" id="role_text">После нажатия, бот тебя к нам пропустит, сиди жди</p>
+                            <a href="#" class="btn btn-success" onclick="reg_discord()">ЖМИ СКОРЕЕ БРАТ</a>
+                          </div>
+                        </div>
+                      </div>
+                </div>
+                <div class="row justify-content-center">
+                    <div class="col pt-4" id="unreg_card" hidden>
+                        <div class="card">
+                            <div class="card-body">
+                            <h5 class="card-title">Отвязать дискорд от стима</h5>
+                            <p class="card-text" id="unreg_text">К твоему аккаунту ничего не привязано</p>
+                            <a href="#" class="btn btn-danger" onclick="unreg_discord()">Отвязать</a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <script async>
+        let already_attached_steam = false;
+
+        async function get_steam_data(){
+            var next = false;
+            document.getElementById("steam_card").removeAttribute("hidden");
+            await fetch("https://tf2.pblr-nyk.pro/api/auth/steam", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' } })
+            .then(response => response.json())
+            .catch(err => {})
+            .then(response => {
+                document.getElementById("steam_card").getElementsByClassName("card-title")[0].innerHTML = `Привет, ${response['nickname']}`;
+                document.getElementById("steam_card").getElementsByClassName("card-text")[0].innerHTML = "Теперь идем к следующему шагу...";
+                //document.getElementById("steam_card").getElementsByClassName("btn")[0].setAttribute("hidden", true);
+                document.getElementById("steam_card").getElementsByClassName("btn")[0].setAttribute("href", `/api/auth/logout?rnd=${(Math.random() + 1).toString(36)}`);
+                document.getElementById("steam_card").getElementsByClassName("btn")[0].innerHTML = "НЕ ХОЧУ";
+                document.getElementById("steam_card").getElementsByClassName("btn")[0].classList.remove("btn-primary");
+                document.getElementById("steam_card").getElementsByClassName("btn")[0].classList.add("btn-danger");
+                console.log(response);
+                next = true;
+            });
+            return next;
+        }
+
+        async function get_discord_data(){
+            var next = false;
+            await fetch("https://tf2.pblr-nyk.pro/api/auth/steam/discord", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' } })
+            .catch(err => {
+                alert("сервис недоступен в данный момент");
+            })
+            .then(response => response.text().then(data => ({"status":response.status, "body":data})))
+            .then(response => {
+                if (response.status === 200) {
+                    document.getElementById("unreg_card").removeAttribute("hidden");
+                    document.getElementById("unreg_card").getElementsByClassName("card-text")[0].innerHTML = `К твоему аккаунту привязан дискорд с ИД: ${response.body}<br>Следовательно ты уже можешь зайти на сервер без проблем!`;
+                    already_attached_steam = true;
+                    next = false;
+                } else {
+                    document.getElementById("discord_card").removeAttribute("hidden");
+                    next = true;
+                }
+            });
+            return next;
+        }
+
+        async function unreg_discord(){
+            await fetch("https://tf2.pblr-nyk.pro/api/auth/steam/discord", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' }, method:"DELETE" })
+            .catch(err => {
+                alert("у тебя не был привязан аккаунт малой");
+            })
+            .then(response => {
+                if(response.status == 200) {
+                    alert("аккаунт был отвязан!");
+                    window.location.reload()
+                } else {
+                    alert("у тебя не был привязан аккаунт малой");
+                }
+            })
+        }
+
+        async function get_discord_about(){
+            await fetch("https://tf2.pblr-nyk.pro/api/auth/discord", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' }})
+            .then(response => response.json().then(data => ({"status":response.status, "body":data})))
+            .then(response => {
+                if (response.status == 200) {
+                    document.getElementById("discord_card").getElementsByClassName("card-title")[0].innerHTML = `Давай, давай, ${response.body.username}`;
+                    document.getElementById("discord_card").getElementsByClassName("card-text")[0].innerHTML = "Почти все готово, нажми теперь на ПОСЛЕДНИЮ КНОПКУ!!!";
+                    //document.getElementById("discord_card").getElementsByClassName("btn")[0].setAttribute("hidden", true);
+                    document.getElementById("discord_card").getElementsByClassName("btn")[0].setAttribute("href", `/api/auth/discord/logout?rnd=${(Math.random() + 1).toString(36)}`);
+                    document.getElementById("discord_card").getElementsByClassName("btn")[0].innerHTML = "Я ПЕРЕДУМАЛ";
+                    document.getElementById("discord_card").getElementsByClassName("btn")[0].classList.remove("btn-primary");
+                    document.getElementById("discord_card").getElementsByClassName("btn")[0].classList.add("btn-danger");
+                    //
+                    document.getElementById("role_card").removeAttribute("hidden");
+                } else {
+                    alert("discord сказал что ты пидор");
+                    window.location.reload();
+                }
+            })
+        }
+
+        async function reg_discord(){
+            await fetch("https://tf2.pblr-nyk.pro/api/auth/discord", { credentials: "same-origin", headers: { 'Cache-Control': 'no-cache' }, method:"POST"})
+            .then(response => response.text().then(data => ({"status":response.status, "body":data})))
+            .then(response => {
+                switch (response.status){
+                    case 201: {
+                        alert("аккаунт привязан");
+                        window.location.replace("https://tf2.pblr-nyk.pro/discord")
+                        break;
+                    }
+                    case 409: {
+                        alert("увы к твоему стиму уже как-то подвязался другой дискорд аккаунт");
+                        break;
+                    }
+                    case 413: {
+                        alert("увы к твоему дискорду уже как-то подвязался другой стим аккаунт");
+                        break;
+                    }
+                    default: {
+                        alert("привязка закончилась с неизвестной ошибкой, иди нахуй...");
+                        window.location.reload();
+                        break;
+                    }
+                }
+            });
+        }
+
+        async function get_all(){
+            await get_steam_data().then(value => {
+                if(value == true) {
+                    get_discord_data().then(value => {
+                        if(value==true){
+                            get_discord_about();
+                        }
+                    });
+                } else {
+                }
+            });
+        }
+
+        //do
+        get_all();
+    </script>
+</body>
+</html>
