changed icons in Home.tsx

src/components/HomePage/Home.tsx

 import { useNavigate } from 'react-router';
 import '../../styles/Home/home.css';
-import add from "/section_add.png";
-import { Pagination } from 'antd';
+import { Button, Pagination } from 'antd';
+import { MaterialSymbol } from 'react-material-symbols';
 
 const Home = () => {
     const navigate = useNavigate();
@@ -9,8 +9,7 @@ const Home = () => {
     return (
         <section className='section'>
             <div className="add">
-                <img src={add} alt="add_png" onClick={() => navigate("/add")} className='add_button' />
-                <span className='add_title'>Добавить</span>
+                <Button href='/' icon={<MaterialSymbol icon='add_circle' size={20} color='#0E2B52' />} className='add_title'>Добавить</Button>
             </div>
             <div className="data">
                 <table className="data-table">
@@ -34,8 +33,16 @@ const Home = () => {
                             <td>ТОО “Рога и Копыта”</td>
                             <td>esutd-dev.arta.kz </td>
                             <td>активен</td>
-                            <td><button className="view-btn" onClick={() => navigate("/edit")}>👁️</button></td>
-                            <td><button className="delete-btn">🗑️</button></td>
+                            <td>
+                                <button className="view-btn" onClick={() => navigate("/edit")}>
+                                    <MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
+                                </button>
+                            </td>
+                            <td>
+                                <button className="delete-btn">
+                                    <MaterialSymbol icon='delete' size={22} color='#0E2B52' />
+                                </button>
+                            </td>
                         </tr>
                         <tr>
                             <td>2</td>
@@ -44,8 +51,16 @@ const Home = () => {
                             <td>ТОО “Рога и Копыта”</td>
                             <td>techreg.gov.kz</td>
                             <td>заблокирован</td>
-                            <td><button className="view-btn" onClick={() => navigate("/edit")}>👁️</button></td>
-                            <td><button className="delete-btn">🗑️</button></td>
+                            <td>
+                                <button className="view-btn" onClick={() => navigate("/edit")}>
+                                    <MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
+                                </button>
+                            </td>
+                            <td>
+                                <button className="delete-btn">
+                                    <MaterialSymbol icon='delete' size={22} color='#0E2B52' />
+                                </button>
+                            </td>
                         </tr>
                         <tr>
                             <td>3</td>
@@ -54,8 +69,16 @@ const Home = () => {
                             <td>ТОО “Рога и Копыта”</td>
                             <td>kaspi.kz</td>
                             <td>удален</td>
-                            <td><button className="view-btn" onClick={() => navigate("/edit")}>👁️</button></td>
-                            <td><button className="delete-btn">🗑️</button></td>
+                            <td>
+                                <button className="view-btn" onClick={() => navigate("/edit")}>
+                                    <MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
+                                </button>
+                            </td>
+                            <td>
+                                <button className="delete-btn">
+                                    <MaterialSymbol icon='delete' size={22} color='#0E2B52' />
+                                </button>
+                            </td>
                         </tr>
                     </tbody>
                 </table>

src/partials/Header/Header.tsx

@@ -4,7 +4,7 @@ import { Menu, Button, Drawer } from 'antd';
 import type { MenuProps } from 'antd';
 import { MaterialSymbol } from 'react-material-symbols';
 import styles from './Header.module.css';
-import './drawer.css';
+import './custom-drawer.css';
 
 type MenuItem = Required<MenuProps>['items'][number];
 

src/styles/Home/home.css

@@ -13,6 +13,7 @@
     margin-bottom: 10px;
     display: flex;
     align-items: center;
+    gap: 4px;
 }
 
 .add_button,
@@ -31,7 +32,9 @@
 .add_title {
     font-size: 12px;
     line-height: 18px;
-    margin-left: 2px;
+    text-decoration: none;
+    font-weight: 700;
+    margin-left: -10px;
 }
 
 .data {