login y restablecer pages

components/FormHeader.vue

@@ -1,7 +1,8 @@
 <template>
   <div class="header">
-    <h1 class="title">{{ title }}</h1>
-    <img src="@/assets/img/latienda-lineapuntos-2.svg" alt="" class="" />
+    <h2 class="title">{{ title }}</h2>
+    <p v-html="subtitle" class="subtitle"></p>
+    <div class="title-lines"></div>
   </div>
 </template>
 
@@ -9,6 +10,7 @@
 export default {
   props: {
     title: { type: String, default: '' },
+    subtitle: { type: String, default: '' },
   },
 }
 </script>
@@ -18,16 +20,27 @@ export default {
   display: flex;
   flex-direction: column;
   align-items: center;
-  margin-bottom: 40px;
+  gap: 1rem;
+  color: $color-primary;
 
   .title {
-    font-size: $xl;
-    color: $color-navy;
+    font-size: $h2;
+    color: $color-primary;
     margin-bottom: 10px;
   }
 
-  img {
-    width: 40px;
+  .subtitle {
+    font-size: $l;
+    color: $color-primary;
+    margin-bottom: 10px;
+    text-align: center;
+  }
+
+  .title-lines {
+    width: 34px;
+    height: 2px;
+    background: $color-consumo-base;
+    margin: 0 8px;
   }
 }
 </style>