index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Vue - Pluralsight</title>
    <style>
        /* Styles */
        #app {
            font: 14px 'Helvetica Neue', Helvetica, Arial, sans-serif;
            color: #4d4d4d;
            min-width: 550px;
            max-width: 850px;
            margin: 0 auto;
        }

        a.active {
            color: orange;
        }

        nav {
            padding-top: 20px;
        }

        .fade-enter-active, .fade-leave-active {
            transition: opacity .1s
        }

        .fade-enter, .fade-leave-active {
            opacity: 0
        }

        .margin-r-5 {
            margin-right: 5px;
        }
    </style>
</head>
<body>
<div id="app">
    <div class="container-fluid">
        <SiteHeader></SiteHeader>

        <!-- route outlet -->
        <!-- component matched by the route will render here -->
        <transition name="fade" mode="out-in">
            <router-view></router-view>
        </transition>
    </div>
</div>
</body>
</html>