estatus de la compra

src/view/PersonalData.vue

@@ -14,8 +14,9 @@
 
 </section>
 
-<aside id="CompraStatus" class="col-10 col-sm-2 col-md-2 col-lg-2 col-xl-2 offset-1 bg-primary">
-  <h3 class="text-center">status</h3>
+<aside id="CompraStatus" class="col-10 col-sm-2 col-md-2 col-lg-2 col-xl-2 offset-1 ">
+  <!-- <h3 class="text-center">status</h3> -->
+   <ShoppingStatus></ShoppingStatus> 
 </aside>
 
 
@@ -32,21 +33,28 @@ import Header from '../components/Header'
 import Footer from '../components/Footer'
 import ShoppingNav from '../components/ShoppingNav'
 import DataSection from '../components/dataSection'
+import ShoppingStatus from '../components/ShoppingStatus'
 
 export default {
 components: {
         Header,
         Footer,
         ShoppingNav,
+        ShoppingStatus,
         DataSection
     }
 }
 </script>
 
 <style scoped>
+#CompraStatus{
+ padding: 0;
+}
+
 @media screen and (max-width:760px )  {
  #CompraStatus{
    margin-top: 2rem;
+  
  }
 }