From 0380c54d605dee8ed98ce98755fb690ab2f9ac17 Mon Sep 17 00:00:00 2001
From: Ruslan Bakiev <572431+veikab@users.noreply.github.com>
Date: Mon, 6 Apr 2026 16:01:01 +0700
Subject: [PATCH] Simplify message template page layout

---
 app/pages/messages.vue | 40 ++++++++++++++++++++--------------------
 1 file changed, 20 insertions(+), 20 deletions(-)

diff --git a/app/pages/messages.vue b/app/pages/messages.vue
index ccbbe35..360b452 100644
--- a/app/pages/messages.vue
+++ b/app/pages/messages.vue
@@ -29,13 +29,7 @@ function channelLabel(channel: TemplateChannel['channel']) {
 
 <template>
   <section class="space-y-6">
-    <div class="manager-hero">
-      <p class="manager-eyebrow">Настройки</p>
-      <h1 class="manager-title">Сообщения</h1>
-      <p class="manager-copy">
-        Здесь менеджер видит реальные шаблоны из backend-кода и может быстро проверить, что именно получает клиент в каждом канале.
-      </p>
-    </div>
+    <h1 class="text-3xl font-extrabold text-[#0f2f20]">Сообщения</h1>
 
     <div v-if="templatesQuery.loading.value" class="manager-empty-state">
       Загружаем шаблоны...
@@ -45,13 +39,12 @@ function channelLabel(channel: TemplateChannel['channel']) {
       Шаблонов пока нет.
     </div>
 
-    <div v-else class="space-y-4">
-      <article
+    <div v-else class="space-y-6">
+      <section
         v-for="template in templates"
         :key="template.id"
-        class="surface-card rounded-3xl p-5"
       >
-        <h2 class="text-2xl font-black tracking-[-0.03em] text-[#123824]">
+        <h2 class="text-xl font-bold text-[#123824]">
           {{ template.title }}
         </h2>
 
@@ -59,13 +52,13 @@ function channelLabel(channel: TemplateChannel['channel']) {
           <section
             v-for="channel in template.channels"
             :key="`${template.id}-${channel.channel}`"
-            class="rounded-[24px] border border-[#deebe4] bg-[#fbfdfb] p-4"
+            class="surface-card rounded-[24px] bg-white p-4"
           >
             <h3 class="text-sm font-extrabold uppercase tracking-[0.14em] text-[#355947]">
               {{ channelLabel(channel.channel) }}
             </h3>
 
-            <div class="mt-3 rounded-[20px] bg-white p-4">
+            <div class="mt-3 rounded-[20px] bg-[#f8fbf9] p-4">
               <p
                 v-if="channel.subject"
                 class="text-xs font-semibold uppercase tracking-[0.12em] text-[#5c7b69]"
@@ -83,18 +76,25 @@ function channelLabel(channel: TemplateChannel['channel']) {
                 </p>
               </div>
 
-              <div v-if="channel.buttonText" class="mt-4 space-y-1 text-sm leading-6 text-[#355947]">
-                <p class="font-semibold text-[#123824]">
+              <div v-if="channel.buttonText" class="mt-4">
+                <a
+                  v-if="channel.buttonUrl"
+                  :href="channel.buttonUrl"
+                  class="btn h-11 rounded-full border-0 bg-[#123824] px-5 text-white hover:bg-[#0f2f20]"
+                >
                   {{ channel.buttonText }}
-                </p>
-                <p v-if="channel.buttonUrl" class="break-all text-xs text-[#5c7b69]">
-                  {{ channel.buttonUrl }}
-                </p>
+                </a>
+                <span
+                  v-else
+                  class="inline-flex h-11 items-center rounded-full bg-[#123824] px-5 text-sm font-semibold text-white"
+                >
+                  {{ channel.buttonText }}
+                </span>
               </div>
             </div>
           </section>
         </div>
-      </article>
+      </section>
     </div>
   </section>
 </template>