Revert App.vue, add Funnel1.vue.

This commit is contained in:
bmauger 2021-10-06 09:32:58 -04:00
parent ebc75c4214
commit 53530ca91e
4 changed files with 63 additions and 37 deletions

View file

@ -14,7 +14,7 @@
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<div id="Funnel1"></div>
<!-- built files will be auto injected -->
</body>
</html>

View file

@ -1,45 +1,26 @@
<template>
<div class="container-fluid">
<div class="row">
<div class="col my-3 d-flex justify-content-center">
<vehicleImage/>
</div>
</div>
<HeaderNav/>
<div class="container">
<div class="row">
<div class="col">
<p class="text-center text-secondary fs-5 mb-4">Select a year to get started</p>
<p class="text-center fs-6 fw-bold">What year is your vehichle?</p>
</div>
</div>
<div class="row">
<div class="col">
<buttonFunnel/>
</div>
</div>
<div class="row mt-5">
<div class="col">
<buttonPrimary/>
<buttonSecondary/>
<textInput/>
<HelloWorld msg="VueJS with Bootstrap"/>
</div>
</div>
</div>
<Colors/>
</template>
<script>
import buttonPrimary from './components/buttons/buttonPrimary';
import buttonSecondary from './components/buttons/buttonSecondary';
import buttonFunnel from './components/buttons/buttonFunnel';
import textInput from './components/forms/textInput';
import vehicleImage from './components/vehicleImage';
export default {
name: 'App',
components: {
buttonPrimary,
buttonSecondary,
buttonFunnel,
textInput,
vehicleImage
}
import HelloWorld from './components/HelloWorld.vue';
import HeaderNav from './components/HeaderNav';
import Colors from './components/Colors';
export default {
name: 'App',
components: {
HelloWorld,
HeaderNav,
Colors
}
}
</script>

45
src/Funnel1.vue Normal file
View file

@ -0,0 +1,45 @@
<template>
<div class="container-fluid">
<div class="row">
<div class="col my-3 d-flex justify-content-center">
<vehicleImage/>
</div>
</div>
<div class="row">
<div class="col">
<p class="text-center text-secondary fs-5 mb-4">Select a year to get started</p>
<p class="text-center fs-6 fw-bold">What year is your vehichle?</p>
</div>
</div>
<div class="row">
<div class="col">
<buttonFunnel/>
</div>
</div>
<div class="row mt-5">
<div class="col">
<buttonPrimary/>
<buttonSecondary/>
<textInput/>
</div>
</div>
</div>
</template>
<script>
import buttonPrimary from './components/buttons/buttonPrimary';
import buttonSecondary from './components/buttons/buttonSecondary';
import buttonFunnel from './components/buttons/buttonFunnel';
import textInput from './components/forms/textInput';
import vehicleImage from './components/vehicleImage';
export default {
name: 'App',
components: {
buttonPrimary,
buttonSecondary,
buttonFunnel,
textInput,
vehicleImage
}
}
</script>

View file

@ -1,5 +1,5 @@
import { createApp } from "vue";
import App from "./App.vue";
import Funnel1 from "./Funnel1.vue";
//Bootstrap JavaScript
import "../node_modules/bootstrap/dist/js/bootstrap.js";
@ -7,4 +7,4 @@ import "../node_modules/bootstrap/dist/js/bootstrap.js";
//Get Bootstrap and Custom Styles
import "./assets/scss/custom.scss";
createApp(App).mount("#app")
createApp(Funnel1).mount("#Funnel1");