chore: sql-task

static/index.css

@@ -61,6 +61,19 @@
      color: rgba(225, 225, 225, 0.6);
 }
 
+.usable-context {
+     font-family: Monocraft;
+     text-align: center;
+     color: rgba(225, 225, 225, 0.6);
+     text-align: right;
+     cursor: pointer;
+     transition: 0.3s;
+}
+
+.usable-context:hover {
+    text-decoration: underline;
+}
+
 .translate-header {
     width: 100%;
     height: 100%;
@@ -112,6 +125,7 @@
 .sql-guide {
     width: 65%;
     height: auto;
+    max-height: 37rem;
     background-color: rgb(0 0 0/ 90%);
     padding: 0.4rem 1rem;
     margin-left: 3.5rem;
@@ -120,8 +134,19 @@
     transform: translateX(-165%);
     transition: 0.5s;
     position: absolute;
+
 }
 
+/*.scroll {
+
+    max-height: 34rem;
+    width: 100%;
+    overflow-y: scroll;
+    scrollbar-color: green;
+    scrollbar-gutter: stable both-edges;
+
+}
+*/
 .sql-guide:hover {
     box-shadow: 1.2em 1.2em 0em 0px rgba(186, 65, 166, 0.9);
 }

templates/sql-injection.html

@@ -3,6 +3,7 @@
 {% block content %}
     <div class="container">
         <div id="popup" class="sql-guide divv">
+            <div class="scroll">
                 <p class="simpletext"style="text-align: left"><span class="hltext">SQL-инъекция</span> - уязвимость системы, позволяющая пользователю ввести вредоносный код в SQL-запрос.<br />
                 <p class="simpletext" style="text-align: left">Как именно это работает? Все дело в том, что данные, которые ввёл пользователь, вставляются в запрос напрямую <span class="context" style="font-size: 0.9rem">(пример кода с сервера ниже)</span></p>
                 <pre><code class="codefont python">#Как же это работает на сервере?(не стоит так делать, иначе ваш код будет иметь ту же уязвимость)
@@ -14,9 +15,9 @@ cursor.execute(f'SELECT * FROM Users WHERE login == "{login}" AND password == "{
                     Вводим в соответствующее поле предполагаемый логин админа - <span class="mono">admin</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>. <span class="context" style="text-align: right; cursor: pointer" onclick="hidePopup()">скрыть</span></p>
+                <p class="simpletext">Вы успешно вошли под логином <span class="mono">admin</span>. <span class="usable-context" onclick="hidePopup()">скрыть</span></p>
+            </div>
         </div>
-
         <div class="divv" id="sqlInpt">
             <form action="sql-injection" method="post" class="simpletext">
                 <p class="simpletext">Попробуй войти от имени админа,<br />