From 6e0dec30c05cf399c3a0cb15a5d3864716232f3e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=A0=D0=BE=D0=BC=D0=B0=20=D0=9F=D0=B5=D1=80=D0=BC=D1=8F?=
 =?UTF-8?q?=D0=BA=D0=BE=D0=B2?= <rpermakov097@gmail.com>
Date: Mon, 31 Mar 2025 18:21:48 +0400
Subject: [PATCH] =?UTF-8?q?=D0=A3=D1=80=D0=B0=20=D1=81=D0=B0=D0=B9=D1=82?=
 =?UTF-8?q?=20=D0=B7=D0=B0=D1=80=D0=B0=D0=B1=D0=BE=D1=82=D0=B0=D0=BB=20?=
 =?UTF-8?q?=D0=BD=D0=BE=D1=80=D0=BC=D0=B0=D0=BB=D1=8C=D0=BD=D0=BE!?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 education.html | 10 +++++-----
 index.html     | 40 ++++++++++++++++++----------------------
 style.css      |  1 +
 3 files changed, 24 insertions(+), 27 deletions(-)

diff --git a/education.html b/education.html
index 3b8fd5e..af424b6 100644
--- a/education.html
+++ b/education.html
@@ -47,7 +47,7 @@
                 </nav>  
             </header>
             <h1>Доступные направления обучения: </h1>
-            <div class="educItem d-flex m-5 border border-dark rounded">
+            <div class="educItem d-flex m-3 border border-dark rounded">
                 <p>Экономика и управление:</p>
                 <ul>
                     <li>Управление предприятиями</li>
@@ -56,7 +56,7 @@
                     <li>Предпринемательская деятельность</li>
                 </ul>
             </div>
-            <div class="educItem d-flex m-5 border border-dark rounded">
+            <div class="educItem d-flex m-3 border border-dark rounded">
                 <p>Информационные технологии:</p>
                 <ul>
                     <li>Программная инженерия</li>
@@ -66,7 +66,7 @@
                     <li>Веб-дизайнер</li>
                 </ul>
             </div>
-            <div class="educItem d-flex m-5 border border-dark rounded">
+            <div class="educItem d-flex m-3 border border-dark rounded">
                 <p>Гуманитарные науки:</p>
                 <ul>
                     <li>Психология</li>
@@ -76,7 +76,7 @@
                     <li>Журналист</li>
                 </ul>
             </div>
-            <div class="educItem d-flex m-5 border border-dark rounded">
+            <div class="educItem d-flex m-3 border border-dark rounded">
                 <p>Международные отношения и право:</p>
                 <ul>
                     <li>Правоведение</li>
@@ -84,7 +84,7 @@
                     <li>Международный бизнес</li>
                 </ul>
             </div>
-            <div class="educItem d-flex m-5 border border-dark rounded">
+            <div class="educItem d-flex m-3 border border-dark rounded">
                 <p>Экология и устойчивое развитие:</p>
                 <ul>
                     <li>Специалист по охране окружающей среды</li>
diff --git a/index.html b/index.html
index 9c52855..f2ca7bd 100644
--- a/index.html
+++ b/index.html
@@ -47,25 +47,17 @@
                 </nav>  
             </header>
             <h1>Новости:</h1>
-            <form id="submit" action="http://127.0.0.1:3000" method="get">
+            <form id="newsForm" action="/" method="post">
                 <div>
-                    <label class="form-label" for="description">Описание</label>
-                    <input id="description" name="description" class="form-control" 
+                    <label class="form-label mx-3" for="description">Описание</label>
+                    <input id="description" name="description" class="form-control mx-3" 
                         type="text" required />
                 </div>
                 <button class="d-block mx-auto my-3 btn btn-primary w-25 btn-single" 
                     type="submit">Добавить</button>
             </form>
             <div id="news" class="d-flex justify-content-around flex-wrap">
-                <div class="newsItem">новость 1</div>
-                <div class="newsItem">новость 2</div>
-                <div class="newsItem">новость 3</div>
-                <div class="newsItem">новость 4</div>
-                <div class="newsItem">новость 5</div>
-                <div class="newsItem">новость 6</div>
-                <div class="newsItem">новость 7</div>
-                <div class="newsItem">новость 8</div>
-                <div class="newsItem">новость 9</div>
+                <div class="newsItem">Здесь будут ваши новости</div>
             </div>
             <footer class="footer d-flex flex-row justify-content-around rounded-bottem">
                 <div class="d-flex align-items-center my-4 mx-0">
@@ -79,19 +71,23 @@
                 </div>
             </footer>
             <script type="module">
-                const news = document.getElementById("news");
-                const but = document.getElementById("submit");
+                const news = document.getElementById("news")
+                const form1 = document.getElementById("newsForm")
+                const inputField = document.getElementById("description")
 
-                function getNewNews(str){
-                    let par = document.createElement("div");
-                    par.setAttribute("class", `newsItem`);
-                    par.textContent = str.target.value;
-                    return par;
+                function getNewNewsItem(elements){
+                    const { value } = Array.from(elements)[0]
+                    let par = document.createElement("div")
+                    par.setAttribute("class", `newsItem`)
+                    par.textContent = { value }.value
+
+                    return par
                 }
 
-                but.addEventListener("submit", (param) => {
-                    console.debug(param);
-                    news.appendChild(getNewNews(param));
+                form1.addEventListener("submit", (event) => {
+                    event.preventDefault()
+                    news.appendChild(getNewNewsItem(event.target.elements))
+                    inputField.value = ""
                 })
             </script>
         </div>
diff --git a/style.css b/style.css
index 6389555..e61a07c 100644
--- a/style.css
+++ b/style.css
@@ -47,6 +47,7 @@ body{
     align-items: center;
     justify-content: center;
     margin: 20px;
+    text-align: center;
 }
 
 .footer{