updates design

src/components/SchedulePage.vue

@@ -15,11 +15,11 @@ onMounted(async () => {
 
 <template>
   <div>
-    Обновлено: {{ timeAgo(schedule.updateTime) }}
     <div v-for="day in schedule.days" :key="day.date" class="day-block">
       {{ capitalizeFirstLetter(formatRussianDate(day.date)) }}
       <span v-if="getRelativeDayName(day.date) !== ''">({{ getRelativeDayName(day.date) }})</span>
-      <div v-for="performance in day.performances" :key="performance.name" class="performance-block">
+      <div v-for="(performance, index) in day.performances" :key="performance.name" class="performance-block">
+        <hr v-if="index > 0" class="hr">
         <div v-if="performance.timeCollection !== '' && performance.timeCollection !== '-'">
           Сбор: {{ performance.timeCollection }}
         </div>
@@ -32,10 +32,10 @@ onMounted(async () => {
         <div>
           {{ capitalizeFirstLetter(performance.name) }}
         </div>
-        <div>
+        <div v-if="performance.numbers.length !== 0">
           Номера:
-          <div v-for="number in performance.numbers" :key="number.name">
-            - {{ number.name }}
+          <div v-for="number in performance.numbers" :key="number.name" class="number-block">
+            - {{ capitalizeFirstLetter(number.name) }}
           </div>
         </div>
         <div v-if="performance.costumes !== '' && performance.costumes !== '-'">
@@ -43,6 +43,9 @@ onMounted(async () => {
         </div>
       </div>
     </div>
+    <div class="footer">
+      Обновлено: {{ timeAgo(schedule.updateTime) }}
+    </div>
   </div>
 </template>
 
@@ -52,7 +55,20 @@ onMounted(async () => {
   margin: 10px 0;
   padding: 15px;
   border-radius: 10px;
+  font-weight: 700;
 }
 
 .performance-block {}
+
+.number-block {
+  margin-left: 10px;
+}
+
+.footer {
+  margin: 10px 0;
+}
+
+.hr {
+  margin: 5px;
+}
 </style>