diff --git a/templates/index.html b/templates/index.html
index be66b13..c1d7622 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -181,12 +181,14 @@
             color: #fff;
             border: 1px solid #777;
         }
+        /* Стили для иконок */
         .custom-icon {
             height: 32px;
             width: 32px;
             background-size: contain;
             background-repeat: no-repeat;
             background-position: center;
+            background-color: transparent;
             border: none;
             padding: 0;
             cursor: pointer;
@@ -202,17 +204,56 @@
         /* Иконки для светлой темы */
         .edit-icon { background-image: url('/icons/edit.png'); }
         .copy-icon { background-image: url('/icons/copy.png'); }
-        .note-icon { background-image: url('/icons/note.png'); }
-        .delete-icon { background-image: url('/icons/delete.png'); }
-        .folder-edit-icon { background-image: url('/icons/edit.png'); }
-        .folder-delete-icon { background-image: url('/icons/delete.png'); }
         /* Иконки для темной темы */
         .edit-icon.dark-theme { background-image: url('/icons/edit-dark.png'); }
         .copy-icon.dark-theme { background-image: url('/icons/copy-dark.png'); }
-        .note-icon.dark-theme { background-image: url('/icons/note-dark.png'); }
-        .delete-icon.dark-theme { background-image: url('/icons/delete-dark.png'); }
+        /* Иконки для папок (меньший размер) */
+        .folder-edit-icon, .folder-delete-icon {
+            height: 16px;
+            width: 16px;
+            background-size: contain;
+            background-repeat: no-repeat;
+            background-position: center;
+            background-color: transparent;
+            border: none;
+            padding: 0;
+            cursor: pointer;
+            transition: background-color 0.2s, transform 0.2s;
+        }
+        .folder-edit-icon:hover, .folder-delete-icon:hover {
+            background-color: #e0e0e0;
+            transform: scale(1.1);
+        }
+        .folder-edit-icon.dark-theme:hover, .folder-delete-icon.dark-theme:hover {
+            background-color: #444;
+        }
+        .folder-edit-icon { background-image: url('/icons/edit.png'); }
+        .folder-delete-icon { background-image: url('/icons/delete.png'); }
         .folder-edit-icon.dark-theme { background-image: url('/icons/edit-dark.png'); }
         .folder-delete-icon.dark-theme { background-image: url('/icons/delete-dark.png'); }
+        /* Стили для кнопок удаления и заметок */
+        .action-button {
+            margin: 0 2px;
+            padding: 5px 8px;
+            font-size: 12px;
+            border: 1px solid #ccc;
+            border-radius: 4px;
+            background-color: #f9f9f9;
+            color: #333;
+            cursor: pointer;
+            transition: background-color 0.2s, color 0.2s, border-color 0.2s;
+        }
+        .action-button:hover {
+            background-color: #e0e0e0;
+        }
+        .action-button.dark-theme {
+            background-color: #555;
+            color: #fff;
+            border-color: #777;
+        }
+        .action-button.dark-theme:hover {
+            background-color: #666;
+        }
         #notes-content {
             padding: 10px;
             min-height: 200px;
@@ -422,6 +463,7 @@
                 document.querySelector('#add-record-button').classList.add('dark-theme');
                 document.querySelector('.header').classList.add('dark-theme');
                 document.querySelectorAll('.install-item').forEach(item => item.classList.add('dark-theme'));
+                document.querySelectorAll('.action-button').forEach(button => button.classList.add('dark-theme'));
                 $('#folder-tree').addClass('jstree-default-dark');
                 document.querySelector('.theme-toggle').textContent = 'Светлая тема';
             } else {
@@ -429,12 +471,6 @@
             }
             localStorage.setItem('theme', defaultTheme);
 
-            $('#installs-list').on('click', '.note-icon', function () {
-                const installId = $(this).closest('.install-item').data('id');
-                const install = allInstalls.find(i => i.id === installId);
-                openNoteModal(installId, install?.note || '');
-            });
-
             const splitter = document.getElementById('splitter');
             const treeContainer = document.getElementById('tree-container');
             let isResizing = false;
@@ -506,6 +542,7 @@
             const addRecordButton = document.getElementById('add-record-button');
             const header = document.querySelector('.header');
             const installItems = document.querySelectorAll('.install-item');
+            const actionButtons = document.querySelectorAll('.action-button');
             const folderTree = $('#folder-tree');
 
             if (body.classList.contains('dark-theme')) {
@@ -522,6 +559,7 @@
                 addRecordButton.classList.remove('dark-theme');
                 header.classList.remove('dark-theme');
                 installItems.forEach(item => item.classList.remove('dark-theme'));
+                actionButtons.forEach(button => button.classList.remove('dark-theme'));
                 folderTree.removeClass('jstree-default-dark');
                 themeToggle.textContent = 'Темная тема';
                 localStorage.setItem('theme', 'light');
@@ -539,6 +577,7 @@
                 addRecordButton.classList.add('dark-theme');
                 header.classList.add('dark-theme');
                 installItems.forEach(item => item.classList.add('dark-theme'));
+                actionButtons.forEach(button => button.classList.add('dark-theme'));
                 folderTree.addClass('jstree-default-dark');
                 themeToggle.textContent = 'Светлая тема';
                 localStorage.setItem('theme', 'dark');
@@ -560,8 +599,8 @@
                             ].concat(sortedFolders.map(folder => ({
                                 id: folder.id,
                                 text: `${folder.name} <span class="folder-actions">` +
-                                      `<button class="custom-icon folder-edit-icon" onclick="editFolder(${folder.id}, '${folder.name}')"></button>` +
-                                      `<button class="custom-icon folder-delete-icon" onclick="deleteFolder(${folder.id})"></button></span>`,
+                                      `<button class="folder-edit-icon" onclick="editFolder(${folder.id}, '${folder.name}')"></button>` +
+                                      `<button class="folder-delete-icon" onclick="deleteFolder(${folder.id})"></button></span>`,
                                 parent: folder.parent_id ? folder.parent_id : "root"
                             })));
                             cb(treeData);
@@ -642,6 +681,12 @@
                     moveInstallToFolder(installId, targetFolderId);
                 }
             });
+
+            $('#installs-list').on('click', '.note-button', function () {
+                const installId = $(this).closest('.install-item').data('id');
+                const install = allInstalls.find(i => i.id === installId);
+                openNoteModal(installId, install?.note || '');
+            });
         });
 
         function connectWebSocket() {
@@ -750,7 +795,7 @@
                             <div class="computer-name">${item.computer_name} <button class="custom-icon edit-icon" onclick="editField(${item.id}, 'computer_name', '${item.computer_name}')"></button></div>
                             <div class="connection-id"><span class="protocol-icon">${protocolIcons[item.protocol]}</span><a href="${protocolLinks[item.protocol]}${item.rust_id}" class="connection-link ${isDarkTheme ? 'dark-theme' : ''}" target="_blank">${item.rust_id}</a><span class="${statusClass}"></span> <button class="custom-icon copy-icon" onclick="copyToClipboard('${item.rust_id}')"></button> <button class="custom-icon edit-icon" onclick="editField(${item.id}, 'rust_id', '${item.rust_id}')"></button></div>
                             <div class="install-time">${item.install_time} <button class="custom-icon edit-icon" onclick="editField(${item.id}, 'install_time', '${item.install_time}')"></button></div>
-                            <div class="actions"><span class="action-buttons"><button class="custom-icon delete-icon" onclick="deleteInstall(${item.id})"></button> <button class="custom-icon note-icon"></button></span></div>
+                            <div class="actions"><span class="action-buttons"><button class="action-button delete-button ${isDarkTheme ? 'dark-theme' : ''}" onclick="deleteInstall(${item.id})">Удалить</button> <button class="action-button note-button ${isDarkTheme ? 'dark-theme' : ''}">Заметка</button></span></div>
                         </div>
                     `;
                 }).join(''));