From 05cd1cbd72b9bdb08bbc75b853d7fcc74a190474 Mon Sep 17 00:00:00 2001
From: cheeest <e.a.sunduk@gmail.com>
Date: Mon, 7 Apr 2025 23:24:45 +0300
Subject: [PATCH] feat: main help

---
 static/index.css     | 35 +++++++++++++++++++++++++++++------
 templates/index.html | 23 ++++++-----------------
 2 files changed, 35 insertions(+), 23 deletions(-)

diff --git a/static/index.css b/static/index.css
index 91c6a9f..fcbe31a 100644
--- a/static/index.css
+++ b/static/index.css
@@ -162,7 +162,7 @@
 .container {
     display: flex;
     flex-wrap: wrap;
-    height: 100%;
+    height: 80%;
     min-width: 40rem;
     justify-content: center;
     align-content: flex-start;
@@ -187,13 +187,35 @@
 .sqlInpt {
     margin: 3.5rem;
     background-color: rgb(0 0 0 / 85%);
-    padding: 0.5rem 1.5rem;
+    padding: 0.1rem 1.5rem;
     text-align: left;
-    width: clamp(40rem, 35%, 60rem);
     height: 22rem;
     transition: 1s;
     display: flex;
 }
+
+.meme {
+    width: 50rem;
+    height: auto;
+    max-height: 3rem;
+    background-color: rgb(0 0 0/ 90%);
+    padding: 0.4rem 1rem;
+    margin-left: 6.5rem;
+    margin-top: 3.5rem;
+    box-shadow: 0.4em 0.4em 0em 0px rgba(186, 65, 166, 0.6);
+    transform: translateX(-165%);
+    transition: 0.5s;
+    display: block;
+    position: sticky;
+    bottom: 20px;
+    right: 20px;
+    border-radius: 0.5rem;
+}
+
+.meme:hover {
+    box-shadow: 0.8em 0.8em 0em 0px rgba(186, 65, 166, 0.9);
+}
+
 .slideinInpt {
     transition: 1s;
     transform: translateX(calc(65vw + .8em + 3.5rem));
@@ -423,9 +445,10 @@
     width: 3rem;
     height: auto;
     margin: 2rem;
-    bottom: 0.2vw;
-    left: 0.2vw;
-    position: absolute;
+    display: block;
+    position: sticky;
+    bottom: 20px;
+    right: 20px;
     box-shadow: 0.4em 0.4em 0em 0px rgba(0, 0, 0, 0.8);
     transition: 0.5s;
     border-radius: 0.5rem;
diff --git a/templates/index.html b/templates/index.html
index 7bcbe33..f95a4f8 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -36,21 +36,7 @@
                 </p>
             </nav>
         </div>
-        <div id="popup" class="sql-guide capsule-window">
-            <p class="simpletext"style="text-align: left"><a class="hltext" href="https://book.hacktricks.wiki/en/pentesting-web/sql-injection/index.html?highlight=sql%20inje#what-is-sql-injection">SQL-инъекция</a> - уязвимость системы, позволяющая пользователю ввести вредоносный код в SQL-запрос.<br />
-            <p class="simpletext" style="text-align: left">Как именно это работает? Все дело в том, что данные, которые ввёл пользователь, вставляются в запрос напрямую <span class="context" style="font-size: 0.9rem">(пример кода с сервера ниже)</span></p>
-            <pre><code class="codefont python">#Как же это работает на сервере?(не стоит так делать, иначе ваш код будет иметь ту же уязвимость)
-login = request.form['login']  # Получаем данные из окна с логином, которые пользователь ввёл в форму
-password = request.form['pass']  # Так же получаем данные из окна с паролем
-cursor = get_db().cursor()  # Получение доступа к базе данных
-cursor.execute(f'SELECT * FROM Users WHERE login == "{login}" AND password == "{password}"')  # Вставляем в запрос данные от пользователя</code></pre>
-            <p class="simpletext" style="text-align: left">Так в место того, чтобы вводить свои данные, можно ввести определённые команды <span class="context" style="font-size: 0.9rem">(как правило - вредоносные)</span>
-                Вводим в соответствующее поле предполагаемый логин админа - <span class="mono">admin</span>, а часть кода с проверкой пароля, которая идёт после проверки логина, просто закомментируем знаками <span class="mono">";--</span> или <span class="mono">"#</span>.
-                Если мы введём <span class="mono">admin";--</span> в поле логин, то наш запрос на сервер отправится вот так:</p>
-            <pre><code class="codefont python">cursor.execute(f'SELECT * FROM Users WHERE login == "admin";--" AND password == "{password}"')</code></pre>
-            <p class="simpletext">Соответственно вся часть после знака комментария просто не учитывается. Вы успешно вошли под логином <span class="mono">admin</span>.</p>
-            <span class="close-btn usable-context" onclick="hidePopup()">скрыть</span>
-        </div>
+
         <div class="info1 capsule-window simpletext">
             <p>
                 Это ресурс для обучения, где можно попробовать свои силы в самых
@@ -69,7 +55,10 @@ cursor.execute(f'SELECT * FROM Users WHERE login == "{login}" AND password == "{
             <p> Good luck, have fun =) </p>
         </div>
     </div>
-
-    <img id="help" title="" onclick="showPopup()" src="{{ url_for('static', filename='imgs/icon.png') }}">
+        <div id="popup" class="meme capsule-window">
+            <p class="simpletext" style="text-align:left; margin:0">Ха! Самое начало, а уже подсказки ищешь?) Глупыха!!!!</p>
+            <span class="close-btn usable-context" onclick="hidePopup()">скрыть</span>
+        </div>
+    <img id="help" title="Да, именно тут будет подсказка" onclick="showPopup()" src="{{ url_for('static', filename='imgs/icon.png') }}">
 </body>
 </html>