From 3c10c311d17795cfb43b18555c0905ad913c0f01 Mon Sep 17 00:00:00 2001
From: Fedorov Vladimir <vladimir.fodorow@gmail.com>
Date: Sun, 22 Mar 2026 02:06:35 +0700
Subject: [PATCH] Add hr

---
 src/components/GameWindow.vue   | 13 ++++---------
 src/components/HRLine.vue       | 13 +++++++++++++
 src/components/MessageCloud.vue |  4 +++-
 3 files changed, 20 insertions(+), 10 deletions(-)
 create mode 100644 src/components/HRLine.vue

diff --git a/src/components/GameWindow.vue b/src/components/GameWindow.vue
index dd8806b..13b68ae 100644
--- a/src/components/GameWindow.vue
+++ b/src/components/GameWindow.vue
@@ -10,6 +10,7 @@ import { UnauthorizedError } from './UnauthorizedError';
 import WelcomeGameBlock from './WelcomeGameBlock.vue';
 import HeaderText from './HeaderText.vue';
 import MessageCloud from './MessageCloud.vue';
+import HRLine from './HRLine.vue';
 
 const router = useRouter();
 const route = useRoute();
@@ -173,24 +174,22 @@ onMounted(() => {
         <div v-else>
           <div v-for="action in team.actions" :key="action.id">
             <MessageCloud :action="action">
-              <div v-show="action.isOpen">
-                <hr class="hr" />
+                <HRLine></HRLine>
                 <div class="message-content">
                   <div v-if="action.image.length">
                     <img v-bind:src="action.image" class="message-image" />
                   </div>{{ action.text }}
                 </div>
-                <hr class="hr" v-if="action.buttons?.length" />
+                <HRLine v-if="action.buttons?.length"></HRLine>
                 <button v-for="door in action.buttons" :key="door.code" class="button-dialog"
                   v-on:click="letsgo(door.code)" :disabled="gameState !== 'RUN' || !door.show">
                   {{ door.name }}
                 </button>
 
-                <hr class="hr" v-if="action.applications.length" />
+                <HRLine v-if="action.applications.length"></HRLine>
                 <div class="message-footer" v-for="application in action.applications" :key="application.name">
                   {{ application.number }} Приложение: {{ application.name }}
                 </div>
-              </div>
             </MessageCloud>
           </div>
         </div>
@@ -202,10 +201,6 @@ onMounted(() => {
 </template>
 
 <style scoped>
-.hr {
-  margin: 7px 0;
-}
-
 .body-custom {
   font-size: medium;
   height: calc(100vh - 100px);
diff --git a/src/components/HRLine.vue b/src/components/HRLine.vue
new file mode 100644
index 0000000..f89d482
--- /dev/null
+++ b/src/components/HRLine.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+/* код */
+</script>
+
+<template>
+  <hr class="hr" />
+</template>
+
+<style scoped>
+.hr {
+  margin: 7px 0;
+}
+</style>
diff --git a/src/components/MessageCloud.vue b/src/components/MessageCloud.vue
index 049e389..5d73a8b 100644
--- a/src/components/MessageCloud.vue
+++ b/src/components/MessageCloud.vue
@@ -11,7 +11,9 @@ const props = withDefaults(defineProps<Props>(), {})
 <template>
   <div class="message-cloud">
     <MessageCloudHeader :action="props.action"></MessageCloudHeader>
-    <slot></slot>
+    <div v-show="props.action.isOpen">
+      <slot></slot>
+    </div>
   </div>
 </template>