fixes

src/components/IntroBlock.vue

@@ -60,10 +60,12 @@ const removeAudio = () => {
   </div>
 
   <!-- Просмотр вступления в редакторе: клик — в режим редактирования -->
-  <div v-if="mode == 'show-editor'" class="place-block-hover show-editor-block" @click="updateMode('edit')">
-    <div class="message-header">
-      Вступление
-    </div>
+  <div
+    v-if="mode == 'show-editor'"
+    class="place-block-hover show-editor-block"
+    @click="updateMode('edit')"
+  >
+    <div class="message-header">Вступление</div>
     <hr class="hr" />
     <div class="message-content">
       <div v-if="hasAudio" class="intro-audio-block">
@@ -78,14 +80,23 @@ const removeAudio = () => {
   <div v-if="mode == 'edit'" class="place-block">
     <n-space vertical>
       <p class="settings-header">Текст вступления</p>
-      <n-input v-model:value="props.introduction!.text" type="textarea"
+      <n-input
+        v-model:value="props.introduction!.text"
+        type="textarea"
         :autosize="{ minRows: 4, maxRows: 12 }"
-        placeholder="Дорогие сыщики! В этом деле вам предстоит..." />
+        placeholder="Дорогие сыщики! В этом деле вам предстоит..."
+      />
 
       <p class="settings-header">Аудио вступления</p>
       <div class="intro-edit-audio">
         <n-space vertical>
-          <audio v-if="hasAudio" :src="audioUrl" controls preload="none" class="intro-audio"></audio>
+          <audio
+            v-if="hasAudio"
+            :src="audioUrl"
+            controls
+            preload="none"
+            class="intro-audio"
+          ></audio>
           <n-text v-else depth="3">Аудио не задано</n-text>
           <n-button @click="removeAudio()" :disabled="!hasAudio">Убрать аудио</n-button>
         </n-space>
@@ -126,17 +137,17 @@ const removeAudio = () => {
 /* Панели в стиле блоков точек (см. PlaceBlock.vue) */
 .place-block-hover,
 .place-block {
+  background-color: #222;
+  border: 1px solid #222;
+  border-radius: 10px;
   margin: 10px 0;
   padding: 20px;
-  border-radius: 10px;
-  border: 1px solid #222;
-  background-color: #222;
 }
 
 .place-block-hover:hover {
+  border: 1px solid #63e2b7;
   color: #63e2b7;
   cursor: pointer;
-  border: 1px solid #63e2b7;
 }
 
 .show-editor-block {
@@ -144,9 +155,9 @@ const removeAudio = () => {
 }
 
 .hr {
-  margin: 10px 0;
   border: dashed 1px;
   border-color: #eee;
+  margin: 10px 0;
 }
 
 .message-header {
@@ -172,16 +183,16 @@ const removeAudio = () => {
 }
 
 .intro-audio {
-  width: 100%;
-  max-width: 460px;
   border-radius: 5px;
+  max-width: 460px;
+  width: 100%;
 }
 
 .intro-edit-audio {
+  align-items: flex-start;
   display: flex;
   flex-flow: row wrap;
   gap: 20px;
-  align-items: flex-start;
 }
 
 .slot-block {