Update pages.html

pages.html

@@ -485,13 +485,45 @@ editor.Components.addType('custom-button', {
       // HTML-код кнопки с добавленными стилями
       content: `
 <div class="container">
-  <button type="submit" class="btn-primary">ПЕРЕЙТИ К ОПЛАТЕ</button>
+  <button type="submit" class="atuin-btn">ПЕРЕЙТИ К ОПЛАТЕ</button>
 </div>
+      `,
+      // CSS-стили для кнопки
+      style: `
+.atuin-btn {
+    display: inline-flex;
+    margin: 10px;
+    text-decoration: none;
+    position: relative;
+    font-size: 20px;
+    line-height: 20px;
+    padding: 12px 30px;
+    color: #FFF;
+    font-weight: bold;
+    text-transform: uppercase; 
+    font-family: 'Roboto', Тahoma, sans-serif;
+    background: #337AB7;
+    cursor: pointer;
+    border: 2px solid #BFE2FF;
+    outline: 1px solid;
+    outline-color: #337AB7;
+    outline-offset: 0px;
+    text-shadow: none;
+    transition: all 1.5s cubic-bezier(0.19, 1, 0.22, 1);  
+}
+.atuin-btn:hover,
+.atuin-btn:active,
+.atuin-btn:focus {
+    box-shadow: inset 0 0 20px #BFE2FF;
+    outline-color: rgba(255, 255, 255, 0);
+    outline-offset: 15px;
+    color: #FFF;
+}
       `,
       // Скрипт для обработки нажатия кнопки и загрузки зависимостей
       script: function(props) {
         const initButton = () => {
-          const button = this.querySelector('.btn-primary');
+          const button = this.querySelector('.atuin-btn');
           
           button.addEventListener('click', () => {
             console.log('Button clicked with props:', props);
@@ -563,47 +595,9 @@ editor.Components.addType('custom-button', {
           name: 'new_w',
           label: 'Открвывать в новом окне браузера 0-НЕТ,1-ДА',
           changeProp: true
-        },
-        // Добавляем настройки для стилей кнопки
-        {
-          type: 'color',
-          name: 'bgColor',
-          label: 'Цвет фона кнопки',
-          changeProp: true
-        },
-        {
-          type: 'color',
-          name: 'textColor',
-          label: 'Цвет текста кнопки',
-          changeProp: true
-        },
-        {
-          type: 'number',
-          name: 'fontSize',
-          label: 'Размер шрифта кнопки',
-          changeProp: true
         }
       ]
     }
-  },
-  // Добавляем обработчик для применения стилей
-  view: {
-    onRender({ el, model }) {
-      const bgColor = model.get('bgColor');
-      const textColor = model.get('textColor');
-      const fontSize = model.get('fontSize');
-
-      const button = el.querySelector('.btn-primary');
-      if (bgColor) {
-        button.style.backgroundColor = bgColor;
-      }
-      if (textColor) {
-        button.style.color = textColor;
-      }
-      if (fontSize) {
-        button.style.fontSize = `${fontSize}px`;
-      }
-    }
   }
 });
 // Создаем блок для компонента кнопки