diff --git a/templates/index.html b/templates/index.html
index dd4c22c..f82e715 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -15,6 +15,7 @@
             display: flex;
             height: 100vh;
             background-color: #f4f4f4;
+            transition: background-color 0.3s;
         }
         body.dark-theme {
             background-color: #222;
@@ -29,6 +30,7 @@
             border-right: 1px solid #ccc;
             padding: 10px;
             background-color: #fff;
+            transition: width 0.3s;
         }
         #tree-container.dark-theme {
             border-right-color: #444;
@@ -160,6 +162,7 @@
             color: #007bff;
             text-decoration: none;
             flex-grow: 1;
+            margin-right: 8px; /* Отступ перед иконками */
         }
         .connection-link.dark-theme {
             color: #66b0ff;
@@ -167,12 +170,26 @@
         .action-buttons button {
             margin: 0 2px;
             padding: 2px 5px;
+            display: flex;
+            align-items: center;
         }
         .action-buttons.dark-theme button {
             background-color: #555;
             color: #fff;
             border: 1px solid #777;
         }
+        .edit-button, .copy-button, .note-button {
+            margin-left: 8px; /* Отступ слева от текста */
+            background: none;
+            border: none;
+            cursor: pointer;
+            font-size: 14px;
+            color: #000;
+            padding: 0;
+        }
+        .edit-button.dark-theme, .copy-button.dark-theme, .note-button.dark-theme {
+            color: #fff; /* Темные иконки становятся белыми на темной теме */
+        }
         #notes-content {
             padding: 10px;
             min-height: 200px;
@@ -360,8 +377,16 @@
         };
 
         document.addEventListener('DOMContentLoaded', () => {
+            // Восстановление ширины окна с папками из localStorage
+            const savedWidth = localStorage.getItem('treeContainerWidth');
+            if (savedWidth) {
+                document.getElementById('tree-container').style.width = savedWidth + 'px';
+            }
+
             const savedTheme = localStorage.getItem('theme');
-            if (savedTheme === 'dark') {
+            const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+            const defaultTheme = savedTheme || (prefersDark ? 'dark' : 'light');
+            if (defaultTheme === 'dark') {
                 document.body.classList.add('dark-theme');
                 document.getElementById('installs-container').classList.add('dark-theme');
                 document.getElementById('tree-container').classList.add('dark-theme');
@@ -373,10 +398,14 @@
                 document.getElementById('splitter').classList.add('dark-theme');
                 document.querySelector('.theme-toggle').classList.add('dark-theme');
                 document.querySelector('#add-record-button').classList.add('dark-theme');
-                document.querySelectorAll('.install-item').forEach(item => item.classList.add('dark-theme'));
                 document.querySelector('.header').classList.add('dark-theme');
+                document.querySelectorAll('.install-item').forEach(item => item.classList.add('dark-theme'));
                 $('#folder-tree').addClass('jstree-default-dark');
+                document.querySelector('.theme-toggle').textContent = 'Светлая тема';
+            } else {
+                document.querySelector('.theme-toggle').textContent = 'Темная тема';
             }
+            localStorage.setItem('theme', defaultTheme);
 
             $('#installs-list').on('click', '.action-buttons button:nth-child(2)', function () {
                 const installId = $(this).closest('.install-item').data('id');
@@ -411,6 +440,9 @@
             document.addEventListener('mouseup', () => {
                 isResizing = false;
                 document.body.style.cursor = 'default';
+                // Сохраняем ширину в localStorage
+                const width = treeContainer.offsetWidth;
+                localStorage.setItem('treeContainerWidth', width);
             });
 
             document.addEventListener('keydown', (e) => {
@@ -707,7 +739,7 @@
                             <div class="computer-name">${item.computer_name} <button class="edit-button ${isDarkTheme ? 'dark-theme' : ''}" 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="copy-button ${isDarkTheme ? 'dark-theme' : ''}" onclick="copyToClipboard('${item.rust_id}')">📋</button> <button class="edit-button ${isDarkTheme ? 'dark-theme' : ''}" onclick="editField(${item.id}, 'rust_id', '${item.rust_id}')">✏️</button></div>
                             <div class="install-time">${item.install_time} <button class="edit-button ${isDarkTheme ? 'dark-theme' : ''}" onclick="editField(${item.id}, 'install_time', '${item.install_time}')">✏️</button></div>
-                            <div class="actions"><span class="action-buttons"><button onclick="deleteInstall(${item.id})">Удалить</button> <button class="note-button">Заметка</button></span></div>
+                            <div class="actions"><span class="action-buttons"><button onclick="deleteInstall(${item.id})">Удалить</button> <button class="note-button ${isDarkTheme ? 'dark-theme' : ''}">Заметка</button></span></div>
                         </div>
                     `;
                 }).join(''));