Improving layout

Author: David-Desmaisons

example/App.vue

@@ -1,8 +1,14 @@
 <template>
   <div id="app">
-    <img alt="Vue logo" src="./assets/logo.png" />
+    <img
+      alt="Vue logo"
+      src="./assets/logo.png"
+    />
     <div class="container ">
-      <ul class="nav nav-tabs" role="tablist">
+      <ul
+        class="nav nav-tabs"
+        role="tablist"
+      >
         <li class="nav-item">
           <a
             class="nav-link active"
@@ -11,8 +17,7 @@
             role="tab"
             aria-controls="profile"
             aria-selected="true"
-            >Simple</a
-          >
+          >Simple</a>
         </li>
 
         <li class="nav-item">
@@ -23,8 +28,7 @@
             role="tab"
             aria-controls="profile"
             aria-selected="false"
-            >Two Lists</a
-          >
+          >Two Lists</a>
         </li>
 
         <li class="nav-item">
@@ -35,8 +39,7 @@
             role="tab"
             aria-controls="profile"
             aria-selected="false"
-            >Clone</a
-          >
+          >Clone</a>
         </li>
 
         <li class="nav-item">
@@ -47,8 +50,7 @@
             role="tab"
             aria-controls="profile"
             aria-selected="false"
-            >Handler</a
-          >
+          >Handler</a>
         </li>
 
         <li class="nav-item">
@@ -59,8 +61,7 @@
             role="tab"
             aria-controls="profile"
             aria-selected="false"
-            >Transition</a
-          >
+          >Transition</a>
         </li>
 
         <li class="nav-item">
@@ -71,8 +72,7 @@
             role="tab"
             aria-controls="profile"
             aria-selected="false"
-            >Transitions</a
-          >
+          >Transitions</a>
         </li>
 
         <li class="nav-item">
@@ -83,8 +83,7 @@
             role="tab"
             aria-controls="profile"
             aria-selected="false"
-            >Footer slot</a
-          >
+          >Footer slot</a>
         </li>
 
         <li class="nav-item">
@@ -95,12 +94,14 @@
             role="tab"
             aria-controls="profile"
             aria-selected="false"
-            >Header slot</a
-          >
+          >Header slot</a>
         </li>
       </ul>
 
-      <div class="tab-content" id="tab-content">
+      <div
+        class="tab-content"
+        id="tab-content"
+      >
         <div
           class="tab-pane show active"
           id="simple"
@@ -202,17 +203,12 @@ export default {
 };
 </script>
 
-<style>
+<style scoped="true">
 .main-application {
   width: 400px;
 }
 
 #app {
-  font-family: "Avenir", Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
   text-align: center;
-  color: #2c3e50;
-  margin-top: 60px;
 }
 </style>