Обновлены компоненты NoteEditor и NoteItem для улучшения отображения текста кнопок с добавлением обертки в span. Изменены стили кнопок для улучшения их внешнего вида и адаптивности, включая изменения отступов и размеров. Эти изменения способствуют более удобному взаимодействию пользователя с интерфейсом.

src/components/notes/NoteEditor.tsx

@@ -1078,7 +1078,9 @@ export const NoteEditor: React.FC<NoteEditorProps> = ({ onSave }) => {
                 title="Улучшить или создать текст через ИИ"
               >
                 <Icon icon="mdi:robot" />
-                {isAiLoading ? "Обработка..." : "Помощь ИИ"}
+                <span className="btnAI-text">
+                  {isAiLoading ? "Обработка..." : "Помощь ИИ"}
+                </span>
               </button>
               <button
                 className="btnSave btnAI"
@@ -1087,7 +1089,9 @@ export const NoteEditor: React.FC<NoteEditorProps> = ({ onSave }) => {
                 title="Сгенерировать теги через ИИ"
               >
                 <Icon icon="mdi:tag-multiple" />
-                {isGeneratingTags ? "Генерация..." : "Теги ИИ"}
+                <span className="btnAI-text">
+                  {isGeneratingTags ? "Генерация..." : "Теги ИИ"}
+                </span>
               </button>
             </>
           )}

src/components/notes/NoteItem.tsx

@@ -1490,7 +1490,9 @@ export const NoteItem: React.FC<NoteItemProps> = ({
                       title="Улучшить или создать текст через ИИ"
                     >
                       <Icon icon="mdi:robot" />
-                      {isAiLoading ? "Обработка..." : "Помощь ИИ"}
+                      <span className="btnAI-text">
+                        {isAiLoading ? "Обработка..." : "Помощь ИИ"}
+                      </span>
                     </button>
                     <button
                       className="btnSave btnAI"
@@ -1499,7 +1501,9 @@ export const NoteItem: React.FC<NoteItemProps> = ({
                       title="Сгенерировать теги через ИИ"
                     >
                       <Icon icon="mdi:tag-multiple" />
-                      {isGeneratingTags ? "Генерация..." : "Теги ИИ"}
+                      <span className="btnAI-text">
+                        {isGeneratingTags ? "Генерация..." : "Теги ИИ"}
+                      </span>
                     </button>
                   </>
                 )}

src/styles/style.css

@@ -1072,7 +1072,9 @@ textarea:focus {
 .action-buttons {
   display: flex;
   align-items: center;
-  gap: 10px;
+  gap: 8px;
+  padding-right: 0;
+  flex-wrap: wrap;
 }
 
 .btnAI {
@@ -1080,7 +1082,13 @@ textarea:focus {
   color: white;
   display: flex;
   align-items: center;
-  gap: 6px;
+  justify-content: center;
+  gap: 4px;
+  padding: 8px 12px;
+  min-height: 44px;
+  white-space: nowrap;
+  flex-shrink: 0;
+  font-size: 13px;
 }
 
 .btnAI:hover {
@@ -1103,7 +1111,7 @@ textarea:focus {
 }
 
 .btnSave {
-  padding: 10px 20px;
+  padding: 8px 16px;
   cursor: pointer;
   border-width: 1px;
   background: var(--bg-secondary);
@@ -1112,7 +1120,13 @@ textarea:focus {
   border-radius: 5px;
   font-family: "Open Sans", sans-serif;
   transition: all 0.3s ease;
-  font-size: 16px;
+  font-size: 14px;
+  min-height: 44px;
+  white-space: nowrap;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
 }
 
 .btnSave:hover {
@@ -1567,6 +1581,8 @@ textarea:focus {
   user-select: none;
   -webkit-user-select: none;
   min-height: 44px;
+  min-width: 44px;
+  flex-shrink: 0;
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -1580,6 +1596,8 @@ textarea:focus {
 @media (max-width: 768px) {
   .markdown-buttons.markdown-buttons--edit .btnMarkdown {
     min-height: 48px;
+    min-width: 48px;
+    flex-shrink: 0;
     padding: 8px 12px;
     margin: 0;
   }
@@ -1600,6 +1618,8 @@ textarea:focus {
   user-select: none;
   -webkit-user-select: none;
   min-height: 44px; /* Минимальная высота для touch */
+  min-width: 44px;
+  flex-shrink: 0;
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -1720,8 +1740,9 @@ textarea:focus {
   align-items: center;
   justify-content: center;
   transition: all 0.2s ease;
-  min-width: 32px;
+  min-width: 36px;
-  min-height: 32px;
+  min-height: 36px;
+  flex-shrink: 0;
 }
 
 .floating-toolbar-btn:hover {
@@ -3018,8 +3039,8 @@ textarea:focus {
   }
 
   .markdown-buttons .btnMarkdown {
-    flex: 0 1 auto;
+    flex: 0 0 auto;
-    min-width: auto;
+    min-width: 44px;
     margin-right: 0;
     padding: 8px 12px;
     font-size: 14px;
@@ -3924,6 +3945,8 @@ textarea:focus {
   /* Улучшения для мобильных устройств */
   .markdown-buttons .btnMarkdown {
     min-height: 48px; /* Увеличиваем высоту для touch */
+    min-width: 48px;
+    flex-shrink: 0;
     padding: 8px 12px;
     margin: 2px;
   }
@@ -4241,11 +4264,17 @@ textarea:focus {
   background-color: var(--bg-tertiary);
   color: var(--text-primary);
   border: 1px solid var(--border-secondary);
-  padding: 10px 20px;
+  padding: 8px 16px;
   border-radius: 5px;
   cursor: pointer;
   font-size: 14px;
   transition: all 0.3s ease;
+  min-height: 44px;
+  white-space: nowrap;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
 }
 
 .btn-secondary:hover {
@@ -5045,6 +5074,8 @@ textarea:focus {
   /* Markdown кнопки */
   .markdown-buttons .btnMarkdown {
     min-height: 44px;
+    min-width: 44px;
+    flex-shrink: 0;
     padding: 8px 10px;
     margin: 2px;
     font-size: 13px;
@@ -5094,6 +5125,8 @@ textarea:focus {
   }
 
   .markdown-buttons .btnMarkdown {
+    min-width: 40px;
+    flex-shrink: 0;
     padding: 6px 8px;
     font-size: 12px;
   }