merging from develop
This commit is contained in:
Leah Schumann
commit
38134be19d
144 changed files with 6843 additions and 1825 deletions
|
|
@ -6,11 +6,8 @@ This Repository is for Fix My Glass front end Vue and documentation associated w
|
||||||
#### Routing
|
#### Routing
|
||||||
We are using [Vue Router](https://next.router.vuejs.org/) 4.x for our front end routing. We are using a runtime dynamic routing solution. Some more information about dynamic routing can be found on the [official Vue Router documentation](https://next.router.vuejs.org/guide/advanced/dynamic-routing.html).
|
We are using [Vue Router](https://next.router.vuejs.org/) 4.x for our front end routing. We are using a runtime dynamic routing solution. Some more information about dynamic routing can be found on the [official Vue Router documentation](https://next.router.vuejs.org/guide/advanced/dynamic-routing.html).
|
||||||
|
|
||||||
Here is a high level overview of how our routing works:
|
|
||||||
|
|
||||||
|
|
||||||
`RetainStructureAndGoTo404(to, next)` - Since our 404 path on our router is `path: '/:pathMatch(.*)*'` (meaning that we don't have a dedicated 404 route) we retain the information entered by the user in the url bar and just serve back our `NotFound` component on Vue. For example if a user was to type in `.../fmg/fmgPage=junkPage` Vue will retain this url in the browser and return our `NotFound` component. This could be especially useful for analytics and reporting.
|
|
||||||
|
|
||||||
`Next()` - Is a function that is native to Vue Router in which we call in order to send the user where want them to go based on some logic we have[. You can read more about Navigation Guards and the `Next()` function on the Vue Router documentation. ](https://next.router.vuejs.org/guide/advanced/navigation-guards.html)
|
`Next()` - Is a function that is native to Vue Router in which we call in order to send the user where want them to go based on some logic we have[. You can read more about Navigation Guards and the `Next()` function on the Vue Router documentation. ](https://next.router.vuejs.org/guide/advanced/navigation-guards.html)
|
||||||
|
|
||||||
`GetRouteInfoFromPageName(PageName)` - This method typically takes the query string value of `fmgPage` and passes it into a call to our Content Service. The service will pull information on the page; matching page name passed to page name in our Cms. If we have a match, we will compile the route information and send it to our router to process. If we do not have a that page in our Cms, the user will be served back a 404 page while retaining the structure.
|
`GetRouteInfoFromPageName(PageName)` - This method typically takes the query string value of `fmgPage` and passes it into a call to our Content Service. The service will pull information on the page; matching page name passed to page name in our Cms. If we have a match, we will compile the route information and send it to our router to process. If we do not have a that page in our Cms, the user will be served back a 404 page while retaining the structure.
|
||||||
|
|
||||||
|
`GoToFunnelStartOn404(next)` - When a user tries to go to a page that doesn't exist in the CMS, they will be put back to the 'Start' of the funnel which is whatever page is marked as the homepage on Sitefinity.
|
||||||
|
|
@ -12,12 +12,13 @@ module.exports = {
|
||||||
"!src/router/**/*.js",
|
"!src/router/**/*.js",
|
||||||
"!src/helpers/unit-test-helper.js",
|
"!src/helpers/unit-test-helper.js",
|
||||||
"!src/layouts/component-test/component-test.vue",
|
"!src/layouts/component-test/component-test.vue",
|
||||||
"!src/layouts/address-poc/address-poc.vue"
|
"!src/layouts/form-test/form-test.vue",
|
||||||
|
"!src/layouts/address-poc/address-poc.vue",
|
||||||
], //! means exclude from coverage.
|
], //! means exclude from coverage.
|
||||||
testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"],
|
testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"],
|
||||||
coverageThreshold: {
|
coverageThreshold: {
|
||||||
global: {
|
global: {
|
||||||
statements: 85,
|
statements: 89,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
|
||||||
120
package-lock.json
generated
120
package-lock.json
generated
|
|
@ -15,11 +15,13 @@
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.6.5",
|
||||||
"http-status-codes": "^2.1.4",
|
"http-status-codes": "^2.1.4",
|
||||||
"jest-junit": "^13.0.0",
|
"jest-junit": "^13.0.0",
|
||||||
|
"vee-validate": "^4.5.7",
|
||||||
"vue": "^3.0.0",
|
"vue": "^3.0.0",
|
||||||
"vue-plugin-load-script": "^2.1.0",
|
"vue-plugin-load-script": "^2.1.0",
|
||||||
"vue-router": "^4.0.11",
|
"vue-router": "^4.0.11",
|
||||||
"vuex": "^4.0.2",
|
"vuex": "^4.0.2",
|
||||||
"vuex-persistedstate": "^4.1.0"
|
"vuex-persistedstate": "^4.1.0",
|
||||||
|
"yup": "^0.32.11"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@vue/cli-plugin-babel": "~4.5.0",
|
"@vue/cli-plugin-babel": "~4.5.0",
|
||||||
|
|
@ -1632,7 +1634,6 @@
|
||||||
"version": "7.16.7",
|
"version": "7.16.7",
|
||||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
|
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
|
||||||
"integrity": "sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==",
|
"integrity": "sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==",
|
||||||
"dev": true,
|
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"regenerator-runtime": "^0.13.4"
|
"regenerator-runtime": "^0.13.4"
|
||||||
},
|
},
|
||||||
|
|
@ -4166,6 +4167,11 @@
|
||||||
"integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==",
|
"integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"node_modules/@types/lodash": {
|
||||||
|
"version": "4.14.178",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.178.tgz",
|
||||||
|
"integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw=="
|
||||||
|
},
|
||||||
"node_modules/@types/mime": {
|
"node_modules/@types/mime": {
|
||||||
"version": "1.3.2",
|
"version": "1.3.2",
|
||||||
"resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz",
|
"resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz",
|
||||||
|
|
@ -16453,8 +16459,12 @@
|
||||||
"node_modules/lodash": {
|
"node_modules/lodash": {
|
||||||
"version": "4.17.21",
|
"version": "4.17.21",
|
||||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
|
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
|
||||||
"dev": true
|
},
|
||||||
|
"node_modules/lodash-es": {
|
||||||
|
"version": "4.17.21",
|
||||||
|
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
|
||||||
|
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
|
||||||
},
|
},
|
||||||
"node_modules/lodash.debounce": {
|
"node_modules/lodash.debounce": {
|
||||||
"version": "4.0.8",
|
"version": "4.0.8",
|
||||||
|
|
@ -16974,6 +16984,11 @@
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"optional": true
|
"optional": true
|
||||||
},
|
},
|
||||||
|
"node_modules/nanoclone": {
|
||||||
|
"version": "0.2.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/nanoclone/-/nanoclone-0.2.1.tgz",
|
||||||
|
"integrity": "sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA=="
|
||||||
|
},
|
||||||
"node_modules/nanoid": {
|
"node_modules/nanoid": {
|
||||||
"version": "3.1.30",
|
"version": "3.1.30",
|
||||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
|
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
|
||||||
|
|
@ -18974,6 +18989,11 @@
|
||||||
"node": ">= 6"
|
"node": ">= 6"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/property-expr": {
|
||||||
|
"version": "2.0.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/property-expr/-/property-expr-2.0.5.tgz",
|
||||||
|
"integrity": "sha512-IJUkICM5dP5znhCckHSv30Q4b5/JA5enCtkRHYaOVOAocnH/1BQEYTC5NMfT3AVl/iXKdr3aqQbQn9DxyWknwA=="
|
||||||
|
},
|
||||||
"node_modules/proto-list": {
|
"node_modules/proto-list": {
|
||||||
"version": "1.2.4",
|
"version": "1.2.4",
|
||||||
"resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
|
"resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
|
||||||
|
|
@ -19352,8 +19372,7 @@
|
||||||
"node_modules/regenerator-runtime": {
|
"node_modules/regenerator-runtime": {
|
||||||
"version": "0.13.9",
|
"version": "0.13.9",
|
||||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
||||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==",
|
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"node_modules/regenerator-transform": {
|
"node_modules/regenerator-transform": {
|
||||||
"version": "0.14.5",
|
"version": "0.14.5",
|
||||||
|
|
@ -22340,6 +22359,17 @@
|
||||||
"node": ">= 0.8"
|
"node": ">= 0.8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/vee-validate": {
|
||||||
|
"version": "4.5.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-4.5.7.tgz",
|
||||||
|
"integrity": "sha512-EcpvOikBP5LlRIKwULfwRDeyIaERuOJztZUPWRmSIeWpeQWD6hs9qQ8A3CmVVteqEohbUM07gV/ea8lPXCfCJQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"@vue/devtools-api": "^6.0.0-beta.15"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"vue": "^3.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/vendors": {
|
"node_modules/vendors": {
|
||||||
"version": "1.0.4",
|
"version": "1.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.4.tgz",
|
||||||
|
|
@ -24319,6 +24349,28 @@
|
||||||
"resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
|
||||||
"integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
|
"integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
|
||||||
"dev": true
|
"dev": true
|
||||||
|
},
|
||||||
|
"node_modules/yup": {
|
||||||
|
"version": "0.32.11",
|
||||||
|
"resolved": "https://registry.npmjs.org/yup/-/yup-0.32.11.tgz",
|
||||||
|
"integrity": "sha512-Z2Fe1bn+eLstG8DRR6FTavGD+MeAwyfmouhHsIUgaADz8jvFKbO/fXc2trJKZg+5EBjh4gGm3iU/t3onKlXHIg==",
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/runtime": "^7.15.4",
|
||||||
|
"@types/lodash": "^4.14.175",
|
||||||
|
"lodash": "^4.17.21",
|
||||||
|
"lodash-es": "^4.17.21",
|
||||||
|
"nanoclone": "^0.2.1",
|
||||||
|
"property-expr": "^2.0.4",
|
||||||
|
"toposort": "^2.0.2"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=10"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/yup/node_modules/toposort": {
|
||||||
|
"version": "2.0.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/toposort/-/toposort-2.0.2.tgz",
|
||||||
|
"integrity": "sha1-riF2gXXRVZ1IvvNUILL0li8JwzA="
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
|
@ -25421,7 +25473,6 @@
|
||||||
"version": "7.16.7",
|
"version": "7.16.7",
|
||||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
|
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
|
||||||
"integrity": "sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==",
|
"integrity": "sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==",
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
"requires": {
|
||||||
"regenerator-runtime": "^0.13.4"
|
"regenerator-runtime": "^0.13.4"
|
||||||
}
|
}
|
||||||
|
|
@ -27496,6 +27547,11 @@
|
||||||
"integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==",
|
"integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"@types/lodash": {
|
||||||
|
"version": "4.14.178",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.178.tgz",
|
||||||
|
"integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw=="
|
||||||
|
},
|
||||||
"@types/mime": {
|
"@types/mime": {
|
||||||
"version": "1.3.2",
|
"version": "1.3.2",
|
||||||
"resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz",
|
"resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz",
|
||||||
|
|
@ -37445,8 +37501,12 @@
|
||||||
"lodash": {
|
"lodash": {
|
||||||
"version": "4.17.21",
|
"version": "4.17.21",
|
||||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
|
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
|
||||||
"dev": true
|
},
|
||||||
|
"lodash-es": {
|
||||||
|
"version": "4.17.21",
|
||||||
|
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
|
||||||
|
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
|
||||||
},
|
},
|
||||||
"lodash.debounce": {
|
"lodash.debounce": {
|
||||||
"version": "4.0.8",
|
"version": "4.0.8",
|
||||||
|
|
@ -37888,6 +37948,11 @@
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"optional": true
|
"optional": true
|
||||||
},
|
},
|
||||||
|
"nanoclone": {
|
||||||
|
"version": "0.2.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/nanoclone/-/nanoclone-0.2.1.tgz",
|
||||||
|
"integrity": "sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA=="
|
||||||
|
},
|
||||||
"nanoid": {
|
"nanoid": {
|
||||||
"version": "3.1.30",
|
"version": "3.1.30",
|
||||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
|
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz",
|
||||||
|
|
@ -39538,6 +39603,11 @@
|
||||||
"sisteransi": "^1.0.5"
|
"sisteransi": "^1.0.5"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"property-expr": {
|
||||||
|
"version": "2.0.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/property-expr/-/property-expr-2.0.5.tgz",
|
||||||
|
"integrity": "sha512-IJUkICM5dP5znhCckHSv30Q4b5/JA5enCtkRHYaOVOAocnH/1BQEYTC5NMfT3AVl/iXKdr3aqQbQn9DxyWknwA=="
|
||||||
|
},
|
||||||
"proto-list": {
|
"proto-list": {
|
||||||
"version": "1.2.4",
|
"version": "1.2.4",
|
||||||
"resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
|
"resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
|
||||||
|
|
@ -39856,8 +39926,7 @@
|
||||||
"regenerator-runtime": {
|
"regenerator-runtime": {
|
||||||
"version": "0.13.9",
|
"version": "0.13.9",
|
||||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
|
||||||
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==",
|
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"regenerator-transform": {
|
"regenerator-transform": {
|
||||||
"version": "0.14.5",
|
"version": "0.14.5",
|
||||||
|
|
@ -42300,6 +42369,14 @@
|
||||||
"integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
|
"integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"vee-validate": {
|
||||||
|
"version": "4.5.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-4.5.7.tgz",
|
||||||
|
"integrity": "sha512-EcpvOikBP5LlRIKwULfwRDeyIaERuOJztZUPWRmSIeWpeQWD6hs9qQ8A3CmVVteqEohbUM07gV/ea8lPXCfCJQ==",
|
||||||
|
"requires": {
|
||||||
|
"@vue/devtools-api": "^6.0.0-beta.15"
|
||||||
|
}
|
||||||
|
},
|
||||||
"vendors": {
|
"vendors": {
|
||||||
"version": "1.0.4",
|
"version": "1.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.4.tgz",
|
"resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.4.tgz",
|
||||||
|
|
@ -43914,6 +43991,27 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
"yup": {
|
||||||
|
"version": "0.32.11",
|
||||||
|
"resolved": "https://registry.npmjs.org/yup/-/yup-0.32.11.tgz",
|
||||||
|
"integrity": "sha512-Z2Fe1bn+eLstG8DRR6FTavGD+MeAwyfmouhHsIUgaADz8jvFKbO/fXc2trJKZg+5EBjh4gGm3iU/t3onKlXHIg==",
|
||||||
|
"requires": {
|
||||||
|
"@babel/runtime": "^7.15.4",
|
||||||
|
"@types/lodash": "^4.14.175",
|
||||||
|
"lodash": "^4.17.21",
|
||||||
|
"lodash-es": "^4.17.21",
|
||||||
|
"nanoclone": "^0.2.1",
|
||||||
|
"property-expr": "^2.0.4",
|
||||||
|
"toposort": "^2.0.2"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"toposort": {
|
||||||
|
"version": "2.0.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/toposort/-/toposort-2.0.2.tgz",
|
||||||
|
"integrity": "sha1-riF2gXXRVZ1IvvNUILL0li8JwzA="
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -16,11 +16,13 @@
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.6.5",
|
||||||
"http-status-codes": "^2.1.4",
|
"http-status-codes": "^2.1.4",
|
||||||
"jest-junit": "^13.0.0",
|
"jest-junit": "^13.0.0",
|
||||||
|
"vee-validate": "^4.5.7",
|
||||||
"vue": "^3.0.0",
|
"vue": "^3.0.0",
|
||||||
"vue-plugin-load-script": "^2.1.0",
|
"vue-plugin-load-script": "^2.1.0",
|
||||||
"vue-router": "^4.0.11",
|
"vue-router": "^4.0.11",
|
||||||
"vuex": "^4.0.2",
|
"vuex": "^4.0.2",
|
||||||
"vuex-persistedstate": "^4.1.0"
|
"vuex-persistedstate": "^4.1.0",
|
||||||
|
"yup": "^0.32.11"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@vue/cli-plugin-babel": "~4.5.0",
|
"@vue/cli-plugin-babel": "~4.5.0",
|
||||||
|
|
@ -47,8 +49,7 @@
|
||||||
},
|
},
|
||||||
"extends": [
|
"extends": [
|
||||||
"plugin:vue/vue3-essential",
|
"plugin:vue/vue3-essential",
|
||||||
"eslint:recommended",
|
"eslint:recommended"
|
||||||
"@vue/prettier"
|
|
||||||
],
|
],
|
||||||
"parserOptions": {
|
"parserOptions": {
|
||||||
"parser": "babel-eslint"
|
"parser": "babel-eslint"
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="">
|
<html lang="en-US">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet">
|
||||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<router-view></router-view>
|
<router-view></router-view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
@import "./node_modules/bootstrap/scss/bootstrap";
|
||||||
|
@import "@/styles/common-styles.scss";
|
||||||
|
@import "@/styles/common-typography-styles.scss";
|
||||||
|
@import "@/styles/common-error-styles.scss";
|
||||||
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,10 @@
|
||||||
<svg version="1.1" id="back-glass-damage" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 72.8 33.1" xml:space="preserve">
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
<style>
|
<style>
|
||||||
.st0,.st2{fill:#fff;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st2{fill:none}
|
.st8{stroke:#010101;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;fill:#fff}
|
||||||
</style>
|
</style>
|
||||||
<path class="st0" d="M5.3.4h17.5l3.8 1.1h27.5L62.2.4c7.6 0 10.1 6.2 10.1 13.8v4.7c0 7.7-2.5 13.8-10.1 13.8l-8.1-1.1H26.6l-3.8 1.1H5.3c-.8 0-1.5-.2-2.1-.7-.6-.5-1.1-1.1-1.3-1.9C1.2 27.7.4 23.5.4 17.4s.8-12 1.5-14.5c.2-.7.7-1.4 1.3-1.9C3.7.6 4.5.4 5.3.4z"/>
|
<path class="st8" d="M20.27.49H35.8l4.3 1.24h26.84L78.24.49c8.63 0 11.41 7 11.41 15.63v3.18c0 8.63-2.78 15.63-11.41 15.63l-11.3-1.24H40.1l-4.3 1.24H20.27c-.87 0-1.71-.29-2.4-.81a3.94 3.94 0 0 1-1.42-2.09c-.76-2.76-1.7-7.5-1.7-14.32s.92-11.56 1.7-14.32c.23-.83.74-1.57 1.42-2.09.69-.52 1.53-.8 2.4-.81z"/>
|
||||||
<path class="st0" d="m55.9 3.4-5.7 2.5c-.8.3-1.3 1.6-1.1 2.8.6 5.3.6 10.6 0 15.8-.1 1.2.4 2.4 1.1 2.8l5.7 2.5c1 .4 1.9-.1 2.3-1.3 2.2-7.2 2.2-16.7 0-23.8-.3-1.2-1.3-1.8-2.3-1.3z"/>
|
<path class="st8" d="M69.25 4.07 61.73 6.9c-1.02.38-1.7 1.82-1.49 3.13.79 5.22.79 10.53 0 15.74-.19 1.31.48 2.75 1.49 3.13l7.52 2.84c.3.12.61.18.93.18.32-.01.64-.08.92-.22.29-.14.55-.33.76-.58.21-.24.36-.53.46-.83a36.949 36.949 0 0 0 0-24.77c-.09-.31-.25-.59-.46-.83-.21-.24-.47-.44-.76-.58-.29-.14-.6-.21-.92-.22-.32-.01-.64.05-.93.18z"/>
|
||||||
<path d="m6.8 5.4 4.4 2c.2.1.3.2.4.3.1.2.1.3.1.5-.4 2.8-.6 5.6-.6 8.4 0 2.8.2 5.6.6 8.4 0 .2 0 .3-.1.5-.1.1-.2.3-.3.3l-4.4 2.3c-.1.1-.2.1-.3.1-.1 0-.2 0-.3-.1-.1 0-.2-.1-.3-.2-.1-.1-.1-.2-.2-.3-.5-1.3-1.3-4.5-1.3-11.1S5.3 7 5.8 5.8c0-.1.1-.2.2-.3 0-.1.1-.1.2-.2.1 0 .2-.1.3-.1.1.1.2.1.3.2z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
<path d="m20.29 5.57 2.92 2.06c.42.29.69 1.61.61 2.85-.33 4.94-.33 9.89 0 14.83.08 1.24-.2 2.55-.61 2.85l-2.92 2.06c-.48.34-.94-.27-1.12-1.49-1-7.19-1-14.48 0-21.66.18-1.23.65-1.84 1.12-1.5z" fill="#d92e27" stroke="#010101" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
<path class="st0" d="M10.8 3.2h7.5c.1 0 .1.1.1.1v.2c0 .1 0 .1-.1.2l-1.4 2c-.1.1-.2.2-.3.2 0 .1-.1.1-.2.1h-1.3c-.4 0-.8-.1-1.1-.2l-3.5-2.4c0-.1.1-.1.1-.2h.2zM50 3.9c.1 0 .1-.1.1-.2v-.2c0-.1-.1-.1-.1-.2-.1 0-.1-.1-.2-.1H36c-.1 0-.2 0-.3.1-.1.1-.2.1-.3.2-.4.5-1.1 1.5-1.5 2.1v.2c0 .1.1.2.1.2h11.5c.2 0 .3 0 .4-.1l4.1-2zM31.7 6c.1 0 .2 0 .3-.1.1-.1.2-.1.3-.2.4-.5 1.1-1.5 1.5-2.1v-.2l-.1-.1h-13c-.1 0-.2 0-.3.1-.1.1-.2.1-.3.2-.3.4-1.1 1.5-1.5 2.1v.2l.1.1h13zM10.8 29.9H19.1c.1 0 .1-.1.1-.1v-.2c0-.1 0-.1-.1-.2l-1.4-2c-.1-.1-.2-.2-.3-.2-.1-.1-.2-.1-.3-.1h-2c-.4 0-.8.1-1.1.2l-3.5 2.4c0 .1.1.1.1.2h.2zM50 29.2c.1 0 .1.1.1.2v.2c0 .1-.1.1-.1.2-.1.1-.1.1-.2.1H36c-.1 0-.2 0-.3-.1-.1-.1-.2-.1-.3-.2-.4-.5-1.1-1.5-1.5-2.1v-.2l.1-.1h11.5c.2 0 .3 0 .4.1l4.1 1.9zM31.7 27.1c.1 0 .2 0 .3.1.1.1.2.1.3.2.4.5 1.1 1.5 1.5 2.1v.2l-.1.1H21.5c-.1 0-.2 0-.3-.1-.1-.1-.2-.1-.3-.2-.4-.5-1.1-1.5-1.5-2.1v-.2l.1-.1h12.2z"/>
|
<path class="st8" d="M62.37 31.91H44.78c-.06 0-.12-.01-.17-.04a.396.396 0 0 1-.15-.1l-2.26-2.26a.478.478 0 0 1-.13-.23.387.387 0 0 1 .03-.26.41.41 0 0 1 .17-.2c.08-.05.16-.08.25-.08h14.15c.06 0 .12.01.17.03l5.69 2.26c.1.04.18.11.24.2s.07.2.05.31a.47.47 0 0 1-.16.27c-.08.06-.19.1-.29.1zm-37.98 0h16.62c.09 0 .18-.03.25-.08a.47.47 0 0 0 .17-.2c.03-.08.04-.18.03-.26a.41.41 0 0 0-.13-.23l-2.26-2.26a.482.482 0 0 0-.32-.13H27.71c-.09 0-.18.03-.26.08l-3.3 2.26c-.08.05-.14.13-.17.22a.448.448 0 0 0 .15.51c.07.05.16.08.26.09zM62.37 3.89H44.78c-.12 0-.24.05-.32.13L42.2 6.28c-.06.06-.11.14-.13.23-.01.09 0 .19.03.27.03.08.09.15.17.2.08.05.16.08.25.08h14.15c.06 0 .12-.01.17-.03l5.69-2.26c.1-.04.18-.11.24-.2s.07-.2.05-.31c-.02-.11-.08-.2-.16-.27s-.19-.1-.29-.1zm-37.98 0h16.62c.09 0 .18.03.25.08.08.05.13.12.17.2.03.08.04.18.03.26a.41.41 0 0 1-.13.23l-2.26 2.26c-.09.08-.2.13-.32.13H27.71c-.09 0-.18-.03-.26-.08l-3.3-2.26a.341.341 0 0 1-.18-.21.448.448 0 0 1 .15-.51c.08-.06.17-.1.27-.1z"/>
|
||||||
<path class="st2" d="M3.1 28.6h1c.1 0 .2.1.3.1.1.1.2.2.2.3l1.1 3.4M69.6 7.9c-1.9-1.1-3.5-2.7-4.6-4.7-.2-.4.6-2.2.6-2.2V.9M3.1 4.3h1c.1 0 .2-.1.3-.1.2-.2.3-.3.3-.4L5.8.4M69.6 25.1c-1.9 1.1-3.5 2.7-4.6 4.7-.2.4.6 2.2.6 2.2v.1"/>
|
<path d="M86.1 7.06c-1.39-.93-2.55-2.16-3.4-3.6-.2-.37.54-1.84.54-1.84.01-.03.02-.05.03-.07M18.28 32.02c.06 0 .62.06.96.09.09.01.17.04.25.08.08.04.14.1.2.18l1.25 2.37c.04.06.06.12.06.19M18.28 3.5c.06 0 .62-.06.96-.09.09-.01.17-.04.25-.08.08-.04.14-.1.2-.18L20.94.78c.04-.06.06-.13.06-.19m65.1 27.72c-1.39.93-2.55 2.16-3.4 3.6-.2.37.54 1.84.54 1.84.01.03.02.05.03.07" fill="none" stroke="#010101" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
</svg>
|
</svg>
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.6 KiB |
9
src/assets/img/icons/damage-power-window.svg
Normal file
9
src/assets/img/icons/damage-power-window.svg
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 34.26 33.96" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st15{fill:#fff;stroke:#000;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
|
||||||
|
</style>
|
||||||
|
<path d="M17.27 3.4C14.09 1.27 10.7.75 7.96.75H1.83c-.14 0-.28.03-.41.08-.14.06-.26.14-.36.24-.1.1-.18.22-.23.35-.06.14-.08.28-.08.42v31.37h28.61c.26-3.01.76-5.99 1.5-8.92.68-2.5 1.52-4.95 2.5-7.35a2.016 2.016 0 0 0-.69-2.39L17.27 3.4z" fill="#d92d27" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st15" d="M30.14 15.49H3.09V3.09h4.4c3.4 0 6.72 1.06 9.49 3.03l13.16 9.37z"/>
|
||||||
|
<path d="M3.09 12.12h22.05M6.93 6.35v3.77M5.69 7.59l1.24-1.24 1.24 1.24m3.49 2.53V6.35m1.24 2.52-1.24 1.24-1.24-1.24" fill="none" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st15" d="M5.51 18.69h3.63c.22 0 .44.05.64.14.2.09.38.22.52.39.15.16.26.36.32.57.07.21.09.43.06.65H3.96c-.03-.22 0-.44.06-.65.07-.21.18-.4.32-.57.15-.16.33-.3.53-.39.21-.09.42-.14.64-.14z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
11
src/assets/img/icons/damage-side-window.svg
Normal file
11
src/assets/img/icons/damage-side-window.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 34.26 33.96" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st16{stroke:#000;stroke-linecap:round;stroke-linejoin:round;fill:none;stroke-width:1.25}
|
||||||
|
</style>
|
||||||
|
<path d="M17.27 3.51C14.11 1.4 10.75.88 8.03.88H1.95c-.14 0-.28.03-.41.08-.13.06-.25.14-.35.24-.1.1-.18.22-.23.35-.06.13-.08.27-.08.41v31.12h28.38c.25-2.98.75-5.94 1.49-8.84a64.49 64.49 0 0 1 2.48-7.29 1.998 1.998 0 0 0-.68-2.37L17.27 3.51z" fill="#d92d27" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M30.04 15.5H3.21V3.21h4.36c3.37 0 6.66 1.05 9.41 3.01l13.06 9.28zM5.61 18.67h3.6c.22 0 .43.05.63.14.2.09.38.22.52.38s.25.36.32.56c.07.21.09.43.06.64H4.07c-.03-.22 0-.44.06-.65.07-.21.17-.4.32-.56.15-.16.32-.29.52-.38.2-.08.42-.12.64-.13z" fill="#fff" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st16" d="m15.17 12-1.53-.78-1.42.54-.25-1.93 2.1-.7 1.86 1.04-.76 1.83z"/>
|
||||||
|
<path class="st16" d="m16.65 8.35-.33.83-2.46 1.16-.78-1.88-.91-.31"/>
|
||||||
|
<path class="st16" d="m14.07 10.21-1.72 1.56-1.22.89M4.58 8.6l2.7-.14 2.4 1.64 3.12.17"/>
|
||||||
|
<path class="st16" d="m12.8 10.28 5.92 1.29 2.18 2.03 2.98-.25"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.2 KiB |
11
src/assets/img/icons/side-glass-left-front.svg
Normal file
11
src/assets/img/icons/side-glass-left-front.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M92.99 28.34c4.72-1.13 7.53-2.77 9.11-4.03.49-.39.89-.89 1.17-1.45a4.2 4.2 0 0 0 .44-1.81c.22-9.53-4.11-9.95-4.11-9.95l-.16-1.65c-5.22 0-10.33-1.45-14.78-4.19-2.59-1.49-5.86-3.1-7.35-3.83-.53-.26-1.09-.41-1.67-.47-12.97-1.14-26.5.08-26.5.08-3.88.37-23.61 10.49-23.61 10.49-29.99.43-24.44 12.56-24.44 12.56 2.18 1.02.77 3.24.77 3.24l7.68 1.01" fill="#fff"/>
|
||||||
|
<path class="st10" d="M92.99 28.34c4.72-1.13 7.53-2.77 9.11-4.03.49-.39.89-.89 1.17-1.45a4.2 4.2 0 0 0 .44-1.81c.22-9.53-4.11-9.95-4.11-9.95l-.16-1.65c-5.22 0-10.33-1.45-14.78-4.19-2.59-1.49-5.86-3.1-7.35-3.83-.53-.26-1.09-.41-1.67-.47-12.97-1.14-26.5.08-26.5.08-3.88.37-23.61 10.49-23.61 10.49-29.99.43-24.44 12.56-24.44 12.56 2.18 1.02.77 3.24.77 3.24l7.68 1.01"/>
|
||||||
|
<path class="st11" d="M92.99 26.61c0-4.6-3.73-8.34-8.34-8.34s-8.34 3.73-8.34 8.34c0 4.61 3.73 8.34 8.34 8.34s8.34-3.74 8.34-8.34zm-67.6-3.19c-.42-1.01-1.03-1.93-1.81-2.71s-1.69-1.39-2.71-1.81c-1.01-.42-2.1-.63-3.19-.63a8.3 8.3 0 0 0-4.63 1.41 8.37 8.37 0 0 0-3.07 3.74c-.63 1.52-.79 3.2-.47 4.82.32 1.62 1.12 3.1 2.28 4.27a8.301 8.301 0 0 0 4.27 2.28c1.62.32 3.29.16 4.82-.48a8.318 8.318 0 0 0 5.14-7.7c.01-1.1-.21-2.18-.63-3.19z"/>
|
||||||
|
<path class="st10" d="M10.01 17.74c-1.53.53-3.12.91-4.73 1.12 1.41-1.5 3.15-2.31 4.9-2.91.15-.05.31-.07.47-.05 1.26.15 1.6.43 1.67.5m43.72-1.33c-.92 0-1.77-.14-1.82-.79-.05-.65.72-.85 1.01-.93.5-.12 1.01-.2 1.52-.24.3-.03.59-.04.87-.04.91 0 1.77.1 1.82.79.01.17.04.49-.52.76m16.78-1.08c-.92 0-1.77-.1-1.82-.79-.03-.29-.08-.96 2.54-1.17.3-.04.59-.04.86-.04.92 0 1.77.1 1.82.79.02.18.05.55-.74.84m.76 13.44c0-1.21.4-2.39 1.13-3.36.74-.96 1.77-1.66 2.94-1.98a5.58 5.58 0 0 1 3.54.2 5.519 5.519 0 0 1 3.43 5.76 5.565 5.565 0 0 1-1.51 3.21c-.84.87-1.94 1.45-3.14 1.64-1.2.19-2.43-.03-3.49-.6m-58.79-4.87a5.54 5.54 0 0 1-4.08 5.34c-1.17.32-2.41.25-3.54-.21a5.52 5.52 0 0 1-2.69-2.31 5.534 5.534 0 0 1-.74-3.47c.14-1.21.67-2.33 1.52-3.2.84-.87 1.95-1.45 3.15-1.63 1.2-.18 2.43.03 3.49.61m55.96 6.47H25.95m73.69-12.63c-15.73-5.2-.04-4.47-.04-4.47"/>
|
||||||
|
<path d="M43.15 6.31c4.16-1.5 9.41-3.13 15.59-3.26l.21 7.41-15.9.89.1-5.04z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M33.82 10.54c1.54-1.01 3.93-2.02 7.11-3.35l-.04 4.28-9.01.51c.49-.33 1.11-.83 1.94-1.44zM71.99 4l.21 5.7-11 .63-.2-7.32c3.69-.08 7.38.26 10.99.99zm2.32 5.62-.1-4.97c2.87.93 5.31 2.38 6.32 4.64l-6.22.33z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
12
src/assets/img/icons/side-glass-left-rear.svg
Normal file
12
src/assets/img/icons/side-glass-left-rear.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M93.1 28.37c4.73-1.14 7.55-2.78 9.13-4.04.49-.39.89-.89 1.17-1.45.28-.56.43-1.18.45-1.81.22-9.55-4.12-9.97-4.12-9.97l-.16-1.66a28.433 28.433 0 0 1-14.83-4.21c-2.59-1.49-5.87-3.11-7.37-3.84-.53-.26-1.09-.41-1.68-.47C62.7-.22 49.13 1 49.13 1c-3.89.37-23.67 10.52-23.67 10.52C-4.6 11.94.96 24.11.96 24.11c2.19 1.02.77 3.25.77 3.25l7.7 1.01" fill="#fff"/>
|
||||||
|
<path class="st10" d="M93.1 28.37c4.73-1.14 7.55-2.78 9.13-4.04.49-.39.89-.89 1.17-1.45.28-.56.43-1.18.45-1.81.22-9.55-4.12-9.97-4.12-9.97l-.16-1.66a28.433 28.433 0 0 1-14.83-4.21c-2.59-1.49-5.87-3.11-7.37-3.84-.53-.26-1.09-.41-1.68-.47C62.7-.22 49.13 1 49.13 1c-3.89.37-23.67 10.52-23.67 10.52C-4.6 11.94.96 24.11.96 24.11c2.19 1.02.77 3.25.77 3.25l7.7 1.01"/>
|
||||||
|
<path class="st11" d="M93.09 26.63c0-4.62-3.74-8.36-8.36-8.36s-8.36 3.74-8.36 8.36c0 4.62 3.74 8.36 8.36 8.36s8.36-3.74 8.36-8.36zm-67.76-3.2a8.422 8.422 0 0 0-1.81-2.71 8.368 8.368 0 0 0-5.91-2.45 8.365 8.365 0 0 0-7.72 5.16c-.63 1.53-.8 3.21-.47 4.83a8.347 8.347 0 0 0 2.29 4.28 8.42 8.42 0 0 0 4.28 2.29c1.62.32 3.3.16 4.83-.48 1.53-.63 2.83-1.7 3.75-3.08a8.332 8.332 0 0 0 1.41-4.64 8.79 8.79 0 0 0-.65-3.2z"/>
|
||||||
|
<path class="st10" d="M9.9 17.74c-1.54.53-3.13.91-4.74 1.12 1.41-1.51 3.16-2.31 4.91-2.92.15-.05.31-.07.47-.05 1.26.16 1.61.43 1.68.5m43.82-1.33c-.92 0-1.77-.14-1.83-.79-.05-.65.72-.86 1.02-.94.5-.12 1.01-.2 1.52-.24.3-.03.59-.04.87-.04.91 0 1.77.1 1.83.79.01.17.04.49-.52.76m16.83-1.07c-.92 0-1.77-.1-1.83-.79-.03-.29-.08-.96 2.54-1.17.3-.04.59-.04.86-.04.92 0 1.77.1 1.83.79.02.18.05.55-.75.84m.78 13.47c0-1.22.4-2.4 1.14-3.37.74-.97 1.77-1.67 2.94-1.99 1.17-.32 2.42-.25 3.55.2s2.08 1.27 2.7 2.31c.62 1.04.88 2.27.75 3.47a5.548 5.548 0 0 1-4.66 4.85c-1.2.19-2.43-.03-3.5-.61m-58.95-4.86c0 1.22-.4 2.4-1.14 3.37-.74.97-1.77 1.67-2.95 1.99s-2.42.25-3.55-.21a5.563 5.563 0 0 1-3.44-5.8 5.49 5.49 0 0 1 1.52-3.21c.84-.88 1.95-1.45 3.16-1.63 1.2-.18 2.43.03 3.5.61m56.1 6.48H25.88m73.88-12.65c-15.77-5.21-.04-4.48-.04-4.48"/>
|
||||||
|
<path class="st11" d="M43.13 6.28c4.17-1.5 9.43-3.14 15.63-3.27l.21 7.43-15.94.89.1-5.05zm-9.36 4.24c1.54-1.02 3.94-2.02 7.13-3.36l-.04 4.29-9.03.51c.49-.32 1.11-.83 1.94-1.44z"/>
|
||||||
|
<path d="m72.04 3.97.21 5.71-11.03.63-.2-7.34c3.7-.08 7.4.26 11.02 1z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="m74.36 9.6-.1-4.99c2.88.93 5.33 2.39 6.33 4.65l-6.23.34z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
11
src/assets/img/icons/side-glass-right-front.svg
Normal file
11
src/assets/img/icons/side-glass-right-front.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m94.87 28.34 7.68-1.01s-1.41-2.22.77-3.24c0 0 5.54-12.13-24.44-12.55 0 0-19.73-10.12-23.61-10.49 0 0-13.53-1.22-26.5-.08-.58.05-1.15.21-1.67.47-1.49.72-4.76 2.34-7.35 3.83A28.393 28.393 0 0 1 4.96 9.46l-.16 1.65s-4.33.42-4.11 9.95c.01.63.17 1.24.44 1.81.28.56.68 1.06 1.17 1.45 1.58 1.26 4.39 2.9 9.11 4.03" fill="#fff"/>
|
||||||
|
<path class="st10" d="m94.87 28.34 7.68-1.01s-1.41-2.22.77-3.24c0 0 5.54-12.13-24.44-12.55 0 0-19.73-10.12-23.61-10.49 0 0-13.53-1.22-26.5-.08-.58.05-1.15.21-1.67.47-1.49.72-4.76 2.34-7.35 3.83A28.393 28.393 0 0 1 4.96 9.46l-.16 1.65s-4.33.42-4.11 9.95c.01.63.17 1.24.44 1.81.28.56.68 1.06 1.17 1.45 1.58 1.26 4.39 2.9 9.11 4.03"/>
|
||||||
|
<path class="st11" d="M19.75 34.95c4.61 0 8.34-3.73 8.34-8.34 0-4.6-3.73-8.34-8.34-8.34s-8.34 3.73-8.34 8.34c0 4.6 3.74 8.34 8.34 8.34zm58.62-8.34c0 1.65.49 3.26 1.4 4.63a8.37 8.37 0 0 0 3.74 3.07c1.52.63 3.2.8 4.82.48 1.62-.32 3.1-1.12 4.27-2.28a8.301 8.301 0 0 0 2.28-4.27 8.318 8.318 0 0 0-3.54-8.56 8.3 8.3 0 0 0-4.63-1.41c-1.1 0-2.18.21-3.19.63-1.01.42-1.93 1.03-2.71 1.81S79.42 22.4 79 23.42a8.477 8.477 0 0 0-.63 3.19z"/>
|
||||||
|
<path class="st10" d="M92.08 16.4c.07-.07.42-.34 1.67-.5.16-.02.32-.01.47.05 1.74.6 3.49 1.41 4.9 2.91-1.61-.21-3.19-.58-4.73-1.12m-48.9-3.12c-.56-.27-.53-.59-.52-.76.05-.69.91-.79 1.82-.79.28 0 .57.01.87.04.51.04 1.02.12 1.52.24.29.08 1.07.28 1.01.93-.05.65-.91.79-1.82.79m-22.32-1.9c-.79-.28-.76-.65-.74-.84.05-.69.91-.79 1.82-.79.28 0 .56 0 .86.04 2.61.21 2.56.88 2.54 1.17-.05.69-.91.79-1.82.79m-6.32 17.94a5.5 5.5 0 0 1-3.49.6 5.52 5.52 0 0 1-3.14-1.64c-.84-.87-1.37-2-1.51-3.21-.14-1.21.12-2.42.74-3.46a5.544 5.544 0 0 1 2.69-2.3 5.58 5.58 0 0 1 3.54-.2c1.17.32 2.2 1.02 2.94 1.98.74.96 1.13 2.14 1.13 3.36m58.77-4.87c1.07-.58 2.29-.8 3.49-.61 1.2.18 2.31.76 3.15 1.63.84.87 1.37 2 1.52 3.2a5.548 5.548 0 0 1-3.43 5.78c-1.13.45-2.37.53-3.54.21a5.576 5.576 0 0 1-2.94-1.98 5.498 5.498 0 0 1-1.14-3.36m-2.71 1.6H28.11M4.8 11.11s15.69-.72-.04 4.47"/>
|
||||||
|
<path d="m61.35 11.35-15.9-.89.21-7.41c6.18.13 11.43 1.76 15.59 3.26l.1 5.04z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="m72.52 11.97-9.01-.51-.04-4.28c3.18 1.33 5.57 2.33 7.11 3.35.83.62 1.46 1.12 1.94 1.44zM43.4 3.01l-.2 7.32-11-.63.21-5.7c3.62-.73 7.3-1.07 10.99-.99zM23.88 9.28c1-2.26 3.45-3.71 6.32-4.64l-.1 4.97-6.22-.33z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
12
src/assets/img/icons/side-glass-right-rear.svg
Normal file
12
src/assets/img/icons/side-glass-right-rear.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m94.98 28.37 7.7-1.01s-1.42-2.23.77-3.25c0 0 5.56-12.16-24.5-12.58 0 0-19.78-10.15-23.67-10.52 0 0-13.57-1.22-26.57-.08-.58.06-1.15.21-1.68.47-1.49.73-4.77 2.34-7.37 3.84-4.46 2.74-9.59 4.2-14.82 4.21l-.16 1.66s-4.34.42-4.12 9.97c.01.63.17 1.25.45 1.81s.68 1.06 1.17 1.45c1.59 1.26 4.4 2.9 9.13 4.04" fill="#fff"/>
|
||||||
|
<path class="st10" d="m94.98 28.37 7.7-1.01s-1.42-2.23.77-3.25c0 0 5.56-12.16-24.5-12.58 0 0-19.78-10.15-23.67-10.52 0 0-13.57-1.22-26.57-.08-.58.06-1.15.21-1.68.47-1.49.73-4.77 2.34-7.37 3.84-4.46 2.74-9.59 4.2-14.82 4.21l-.16 1.66s-4.34.42-4.12 9.97c.01.63.17 1.25.45 1.81s.68 1.06 1.17 1.45c1.59 1.26 4.4 2.9 9.13 4.04"/>
|
||||||
|
<path class="st11" d="M19.67 34.99c4.62 0 8.36-3.74 8.36-8.36 0-4.62-3.74-8.36-8.36-8.36s-8.36 3.74-8.36 8.36c0 4.62 3.74 8.36 8.36 8.36zm58.77-8.36a8.365 8.365 0 0 0 9.99 8.2 8.347 8.347 0 0 0 4.28-2.29A8.347 8.347 0 0 0 95 28.26c.32-1.62.16-3.3-.47-4.83a8.301 8.301 0 0 0-3.08-3.75 8.332 8.332 0 0 0-7.84-.77 8.422 8.422 0 0 0-2.71 1.81c-.78.78-1.39 1.7-1.81 2.71a8.21 8.21 0 0 0-.65 3.2z"/>
|
||||||
|
<path class="st10" d="M92.19 16.39c.07-.07.42-.34 1.68-.5.16-.02.32-.01.47.05 1.74.6 3.5 1.41 4.91 2.92-1.61-.21-3.2-.59-4.74-1.12m-49.04-3.13c-.56-.27-.53-.59-.52-.76.05-.7.91-.79 1.83-.79.28 0 .57.01.87.04.51.04 1.02.12 1.52.24.29.08 1.07.29 1.02.94-.05.65-.91.79-1.83.79m-22.37-1.92c-.79-.29-.76-.65-.75-.84.05-.7.91-.79 1.83-.79.28 0 .57 0 .86.04 2.62.21 2.57.89 2.54 1.17-.05.7-.91.79-1.83.79m-6.33 17.99c-1.07.58-2.3.79-3.5.61a5.548 5.548 0 0 1-4.66-4.85c-.14-1.21.12-2.43.75-3.47.62-1.04 1.57-1.86 2.7-2.31s2.37-.53 3.55-.2 2.21 1.02 2.94 1.99c.74.97 1.14 2.15 1.14 3.37m58.91-4.9c1.07-.58 2.3-.8 3.5-.61 1.2.18 2.31.76 3.16 1.63.84.88 1.38 2 1.52 3.21a5.563 5.563 0 0 1-6.99 6.01 5.562 5.562 0 0 1-4.09-5.36m-2.72 1.6H28.04M4.68 11.09s15.73-.73-.04 4.48"/>
|
||||||
|
<path class="st11" d="m61.37 11.33-15.94-.89.21-7.43c6.2.13 11.45 1.77 15.63 3.27l.1 5.05zm11.2.63-9.03-.51-.04-4.28c3.19 1.33 5.59 2.34 7.13 3.36.83.6 1.46 1.11 1.94 1.43z"/>
|
||||||
|
<path d="m43.38 2.97-.2 7.34-11.03-.63.21-5.71c3.63-.74 7.32-1.08 11.02-1z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M23.81 9.26c1.01-2.26 3.46-3.72 6.33-4.65l-.1 4.99-6.23-.34z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
10
src/assets/img/icons/side-window-damage-left-all.svg
Normal file
10
src/assets/img/icons/side-window-damage-left-all.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;fill:none;stroke:#000}
|
||||||
|
</style>
|
||||||
|
<path d="m9.36 28.39-7.71-1.01s1.42-2.23-.77-3.26c0 0-5.57-12.18 24.55-12.6 0 0 19.81-10.17 23.71-10.54 0 0 13.59-1.23 26.61-.08.58.06 1.15.21 1.68.47 1.5.73 4.78 2.35 7.38 3.84 4.46 2.75 9.6 4.21 14.84 4.21l.16 1.66s4.35.42 4.13 9.99a4.21 4.21 0 0 1-.45 1.81 4.47 4.47 0 0 1-1.17 1.46c-1.59 1.26-4.41 2.91-9.15 4.05" fill="#fff"/>
|
||||||
|
<path class="st9" d="m9.36 28.39-7.71-1.01s1.42-2.23-.77-3.26c0 0-5.57-12.18 24.55-12.6 0 0 19.81-10.17 23.71-10.54 0 0 13.59-1.23 26.61-.08.58.06 1.15.21 1.68.47 1.5.73 4.78 2.35 7.38 3.84 4.46 2.75 9.6 4.21 14.84 4.21l.16 1.66s4.35.42 4.13 9.99a4.21 4.21 0 0 1-.45 1.81 4.47 4.47 0 0 1-1.17 1.46c-1.59 1.26-4.41 2.91-9.15 4.05"/>
|
||||||
|
<path d="M84.79 35.02c-4.62 0-8.37-3.75-8.37-8.37 0-4.62 3.75-8.37 8.37-8.37s8.37 3.75 8.37 8.37c0 4.62-3.75 8.37-8.37 8.37zm-58.87-8.37c0 1.66-.49 3.27-1.41 4.65a8.327 8.327 0 0 1-3.76 3.08c-1.53.63-3.21.8-4.84.48a8.376 8.376 0 0 1-4.29-2.29 8.337 8.337 0 0 1-2.29-4.29c-.32-1.62-.16-3.31.47-4.84a8.391 8.391 0 0 1 3.08-3.76 8.364 8.364 0 0 1 7.86-.77c1.02.42 1.94 1.04 2.72 1.81.78.78 1.4 1.7 1.82 2.72.42 1.02.64 2.11.64 3.21z" fill="#fff" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="M12.15 16.39c-.07-.07-.42-.34-1.68-.5a.939.939 0 0 0-.47.05c-1.75.61-3.5 1.41-4.92 2.92 1.62-.21 3.21-.59 4.75-1.12m49.11-3.13c.56-.27.53-.59.52-.76-.05-.7-.92-.79-1.83-.79-.28 0-.57.01-.87.04-.51.04-1.02.12-1.53.24-.29.08-1.07.29-1.02.94.05.65.91.79 1.83.79m22.42-1.92c.79-.29.76-.66.75-.84-.05-.7-.91-.79-1.83-.79-.28 0-.57 0-.87.04-2.62.21-2.57.89-2.55 1.18.05.7.91.79 1.83.79m6.35 18.01c1.07.58 2.3.79 3.51.61 1.2-.19 2.31-.76 3.16-1.64.84-.88 1.38-2.01 1.51-3.22.14-1.21-.12-2.43-.75-3.48a5.492 5.492 0 0 0-2.7-2.31 5.542 5.542 0 0 0-3.55-.2 5.562 5.562 0 0 0-4.09 5.36m-59.02-4.9c-1.07-.58-2.3-.8-3.51-.62-1.2.18-2.32.76-3.16 1.64-.85.88-1.38 2.01-1.52 3.22a5.563 5.563 0 0 0 6.99 6.01 5.525 5.525 0 0 0 2.95-1.99c.74-.97 1.14-2.15 1.14-3.37m2.73 1.6H76.4m23.41-17.17s-15.76-.73.04 4.49"/>
|
||||||
|
<path d="m43.01 11.32 15.97-.89-.21-7.44c-6.21.13-11.47 1.77-15.65 3.27l-.11 5.06zm-11.21.63 9.05-.51.04-4.29c-3.19 1.34-5.6 2.34-7.14 3.36-.84.61-1.47 1.12-1.95 1.44zm29.24-9 .2 7.35 11.05-.63-.21-5.72c-3.63-.74-7.34-1.08-11.04-1zm19.6 6.3c-1.01-2.26-3.46-3.72-6.34-4.66l.11 5 6.23-.34z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
10
src/assets/img/icons/side-window-damage-right-all.svg
Normal file
10
src/assets/img/icons/side-window-damage-right-all.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st6{fill:none;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#010101}
|
||||||
|
</style>
|
||||||
|
<path d="m95.12 28.4 7.73-1.01s-1.42-2.23.77-3.26c0 0 5.58-12.21-24.59-12.63 0 0-19.85-10.18-23.75-10.56 0 0-13.62-1.23-26.66-.08-.58.06-1.16.21-1.68.47-1.5.73-4.79 2.35-7.39 3.85A28.407 28.407 0 0 1 4.68 9.41l-.16 1.66S.16 11.49.39 21.08a4.37 4.37 0 0 0 1.62 3.28c1.59 1.26 4.41 2.91 9.16 4.05" fill="#fff"/>
|
||||||
|
<path class="st6" d="m95.12 28.4 7.73-1.01s-1.42-2.23.77-3.26c0 0 5.58-12.21-24.59-12.63 0 0-19.85-10.18-23.75-10.56 0 0-13.62-1.23-26.66-.08-.58.06-1.16.21-1.68.47-1.5.73-4.79 2.35-7.39 3.85A28.407 28.407 0 0 1 4.68 9.41l-.16 1.66S.16 11.49.39 21.08a4.37 4.37 0 0 0 1.62 3.28c1.59 1.26 4.41 2.91 9.16 4.05"/>
|
||||||
|
<path d="M19.56 35.05c4.63 0 8.39-3.76 8.39-8.39 0-4.63-3.76-8.39-8.39-8.39s-8.39 3.76-8.39 8.39c0 4.63 3.76 8.39 8.39 8.39zm58.97-8.39c0 1.66.49 3.28 1.41 4.66a8.413 8.413 0 0 0 3.76 3.09c1.53.63 3.22.8 4.85.48a8.337 8.337 0 0 0 4.29-2.29 8.467 8.467 0 0 0 2.3-4.29c.32-1.63.16-3.31-.48-4.85a8.427 8.427 0 0 0-3.09-3.77c-1.38-.92-3-1.41-4.66-1.42-1.1 0-2.19.22-3.21.64s-1.94 1.04-2.72 1.82-1.4 1.7-1.82 2.72a8.617 8.617 0 0 0-.63 3.21z" fill="#fff" stroke="#010101" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st6" d="M92.32 16.39c.07-.07.42-.35 1.68-.5a.99.99 0 0 1 .48.05c1.75.61 3.51 1.41 4.92 2.93-1.62-.21-3.21-.59-4.76-1.12M45.45 14.6c-.56-.27-.53-.59-.52-.76.05-.7.92-.8 1.83-.8.28 0 .57.01.87.04.52.04 1.03.12 1.53.24.29.08 1.07.29 1.02.94-.05.65-.91.79-1.83.79M25.9 13.14c-.8-.29-.77-.66-.75-.84.05-.7.91-.8 1.84-.8.28 0 .57 0 .87.04 2.63.21 2.58.89 2.55 1.18-.05.7-.91.8-1.83.8m-6.37 18.04c-1.07.58-2.31.79-3.51.61a5.558 5.558 0 0 1-3.16-1.65 5.544 5.544 0 0 1-1.52-3.23c-.14-1.21.12-2.44.75-3.49a5.586 5.586 0 0 1 2.71-2.32c1.13-.46 2.38-.53 3.56-.2 1.18.32 2.21 1.02 2.95 2 .74.97 1.14 2.16 1.14 3.38m59.12-4.89c1.07-.58 2.31-.8 3.51-.62 1.21.18 2.32.76 3.17 1.64.85.88 1.38 2.01 1.52 3.22.14 1.21-.12 2.44-.74 3.49A5.492 5.492 0 0 1 89 31.82a5.57 5.57 0 0 1-3.56.21 5.55 5.55 0 0 1-4.1-5.37m-2.73 1.61H27.96M4.52 11.07s15.79-.73-.04 4.5"/>
|
||||||
|
<path d="m61.4 11.31-15.99-.9.21-7.45c6.22.13 11.49 1.77 15.68 3.28l.1 5.07zm11.24.63-9.07-.51-.04-4.3c3.2 1.34 5.61 2.35 7.15 3.37.85.61 1.47 1.12 1.96 1.44zM43.35 2.92l-.2 7.37-11.07-.64.21-5.73c3.64-.74 7.35-1.08 11.06-1zM23.72 9.23c1.01-2.27 3.47-3.73 6.36-4.66l-.11 5-6.25-.34z" fill="#d92e27" stroke="#010101" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
|
|
@ -1,10 +0,0 @@
|
||||||
<svg version="1.1" id="side-window-damage" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 72.8 24.8" xml:space="preserve">
|
|
||||||
<style>
|
|
||||||
.st1,.st2,.st3{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st2,.st3{fill:#fff}.st3{fill:#d92d27}
|
|
||||||
</style>
|
|
||||||
<path d="m66.2 19.8 5.4-.7s-1-1.6.5-2.3c0 0 3.9-8.5-17.1-8.8C55 8 41.2.9 38.5.7c0 0-9.5-.9-18.5-.1-.4 0-.8.1-1.2.3-1 .5-3.3 1.6-5.1 2.7-3.1 2-6.7 3-10.3 3l-.1 1.2s-3 .3-2.9 7c0 .4.1.9.3 1.3.2.4.5.7.8 1 1.1.9 3.1 2 6.4 2.8" fill="#fff"/>
|
|
||||||
<path class="st1" d="m66.2 19.8 5.4-.7s-1-1.6.5-2.3c0 0 3.9-8.5-17.1-8.8C55 8 41.2.9 38.5.7c0 0-9.5-.9-18.5-.1-.4 0-.8.1-1.2.3-1 .5-3.3 1.6-5.1 2.7-3.1 2-6.7 3-10.3 3l-.1 1.2s-3 .3-2.9 7c0 .4.1.9.3 1.3.2.4.5.7.8 1 1.1.9 3.1 2 6.4 2.8"/>
|
|
||||||
<path class="st2" d="M13.7 24.5c3.2 0 5.8-2.6 5.8-5.8 0-3.2-2.6-5.8-5.8-5.8s-5.8 2.6-5.8 5.8c0 3.2 2.6 5.8 5.8 5.8zM54.7 18.6c0 1.2.3 2.3 1 3.2.6 1 1.5 1.7 2.6 2.1 1.1.4 2.2.6 3.4.3 1.1-.2 2.2-.8 3-1.6.8-.8 1.4-1.9 1.6-3 .2-1.1.1-2.3-.3-3.4s-1.2-2-2.1-2.6c-1-.6-2.1-1-3.2-1-.8 0-1.5.2-2.2.4-.7.3-1.3.7-1.9 1.3-.5.5-1 1.2-1.3 1.9-.5.9-.6 1.7-.6 2.4z"/>
|
|
||||||
<path class="st1" d="M64.2 11.5s.3-.2 1.2-.3h.3c1.2.4 2.4 1 3.4 2-1.1-.1-2.2-.4-3.3-.8M31.7 10.3c-.4-.2-.4-.4-.4-.5 0-.5.6-.6 1.3-.6h.6c.4 0 .7.1 1.1.2.2 0 .7.2.7.6 0 .5-.6.5-1.3.5M18.1 9.2c-.6-.2-.5-.5-.5-.6 0-.5.6-.6 1.3-.6h.6c1.8.1 1.8.6 1.8.8 0 .5-.6.6-1.3.6M15.5 22c-.7.4-1.6.6-2.4.4-.8-.1-1.6-.5-2.2-1.1-.6-.6-1-1.4-1.1-2.2-.1-.8.1-1.7.5-2.4s1.1-1.3 1.9-1.6c.8-.3 1.7-.4 2.5-.1.8.2 1.5.7 2.1 1.4.5.7.8 1.5.8 2.3M58.6 15.2c.7-.4 1.6-.6 2.4-.4.8.1 1.6.5 2.2 1.1.6.6 1 1.4 1.1 2.2.1.8-.1 1.7-.5 2.4s-1.1 1.3-1.9 1.6c-.8.3-1.7.4-2.5.1-.8-.2-1.5-.7-2.1-1.4-.5-.7-.8-1.5-.8-2.3M54.7 19.8H19.5M3.3 7.8s11-.5 0 3.1"/>
|
|
||||||
<path class="st3" d="m42.8 8-11.1-.7.1-5.2c4.3.1 8 1.2 10.9 2.3l.1 3.6zM50.6 8.4 44.3 8V5c2.2.9 3.9 1.6 5 2.3.5.5.9.9 1.3 1.1zM30.2 2.1l-.1 5.1-7.7-.4.1-4c2.6-.5 5.1-.7 7.7-.7zM16.6 6.5C17.3 5 19 3.9 21 3.3l-.1 3.5-4.3-.3z"/>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.9 KiB |
14
src/assets/img/icons/suv-side-glass-left-front.svg
Normal file
14
src/assets/img/icons/suv-side-glass-left-front.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M31.44 27.67h41.61l14.45-1.02 4.07-.72c.26-.05.5-.18.68-.36.19-.19.31-.42.37-.68 1.72-8.2-4.32-19.56-5.8-21.41h1.61l-.87-1.49C67.99-.63 43.86 1 43.86 1c-3.35.32-13.14 8.33-13.14 8.33-3.5 0-9.51.31-11.84 1.05-6.8 2.17-7.4 12.07-7.4 15.27 0 .28.1.55.28.76.18.21.43.35.71.4l4.31.93" fill="#fff"/>
|
||||||
|
<path class="st10" d="M31.44 27.67h41.61l14.45-1.02 4.07-.72c.26-.05.5-.18.68-.36.19-.19.31-.42.37-.68 1.72-8.2-4.32-19.56-5.8-21.41h1.61l-.87-1.49C67.99-.63 43.86 1 43.86 1c-3.35.32-13.14 8.33-13.14 8.33-3.5 0-9.51.31-11.84 1.05-6.8 2.17-7.4 12.07-7.4 15.27 0 .28.1.55.28.76.18.21.43.35.71.4l4.31.93"/>
|
||||||
|
<path class="st11" d="M31.15 27.74a7.191 7.191 0 0 0-14.38 0 7.191 7.191 0 0 0 14.38 0z"/>
|
||||||
|
<path class="st10" d="M28.74 27.74c0 1.05-.34 2.06-.98 2.9-.63.83-1.53 1.43-2.53 1.71-1.01.28-2.08.21-3.05-.18a4.75 4.75 0 0 1-2.32-1.99c-.53-.9-.76-1.95-.64-2.99.12-1.04.58-2.01 1.31-2.76.73-.75 1.68-1.25 2.72-1.4a4.78 4.78 0 0 1 3.01.53m62.87-8.06c-7.68-3.84 1.85-2.93 1.85-2.93m-38.92 1.48c-.79-.03-1.53-.16-1.56-.72-.03-.56.63-.72.89-.78.43-.1.87-.16 1.32-.18h.74c.79.03 1.53.12 1.56.72.01.15.03.42-.46.64m15.72.33c-.79 0-1.53-.17-1.56-.73-.03-.56.64-.72.89-.78.43-.1.87-.16 1.31-.18h.75c.79.03 1.52.12 1.56.72.01.15.03.42-.46.64"/>
|
||||||
|
<path class="st11" d="M56.69 10.38h16.64V2.51s-7.76-.53-16.64-.3v8.17zm18.35 0h8.41l-4.1-7.45-4.31-.21v7.66z"/>
|
||||||
|
<path class="st10" d="M15.3 17.2c7.92-4.83-.13-4.22-.13-4.22m68.49-9.51c2.7-.06 4.77 0 4.77 0"/>
|
||||||
|
<path d="M38.31 5.94c1.74-1.21 3.57-2.29 5.48-3.21.15-.07.31-.12.48-.13 3.75-.24 7.37-.3 10.73-.33v8.11H38.31V5.94z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M36.62 7.19c-1.21.91-2.43 1.83-3.25 2.45-.07.05-.12.13-.14.21-.02.08-.02.17 0 .25s.08.15.15.2c.07.05.15.08.24.08h3.08l-.08-3.19zm50.83 20.55a7.191 7.191 0 0 0-14.38 0 7.191 7.191 0 0 0 14.38 0z"/>
|
||||||
|
<path class="st10" d="M75.47 27.74c0-1.05.34-2.06.97-2.9s1.52-1.44 2.52-1.72c1.01-.28 2.08-.22 3.05.16.97.39 1.79 1.08 2.33 1.98.54.9.77 1.94.65 2.98a4.763 4.763 0 0 1-1.29 2.77 4.72 4.72 0 0 1-2.7 1.42c-1.03.17-2.09-.01-3.01-.5"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
14
src/assets/img/icons/suv-side-glass-left-rear.svg
Normal file
14
src/assets/img/icons/suv-side-glass-left-rear.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M31.4 27.69h41.69l14.48-1.02 4.08-.72c.26-.05.5-.18.68-.36.19-.19.32-.42.37-.68 1.72-8.21-4.33-19.6-5.81-21.46h1.61l-.87-1.49c-19.61-2.62-43.78-1-43.78-1-3.35.32-13.17 8.35-13.17 8.35-3.5 0-9.53.31-11.86 1.06-6.82 2.17-7.42 12.09-7.42 15.3 0 .28.1.55.28.76.18.21.43.35.71.4l4.32.93" fill="#fff"/>
|
||||||
|
<path class="st10" d="M31.4 27.69h41.69l14.48-1.02 4.08-.72c.26-.05.5-.18.68-.36.19-.19.32-.42.37-.68 1.72-8.21-4.33-19.6-5.81-21.46h1.61l-.87-1.49c-19.61-2.62-43.78-1-43.78-1-3.35.32-13.17 8.35-13.17 8.35-3.5 0-9.53.31-11.86 1.06-6.82 2.17-7.42 12.09-7.42 15.3 0 .28.1.55.28.76.18.21.43.35.71.4l4.32.93"/>
|
||||||
|
<path class="st11" d="M31.11 27.76c0-3.98-3.23-7.2-7.2-7.2-3.98 0-7.2 3.23-7.2 7.2 0 3.98 3.23 7.2 7.2 7.2s7.2-3.22 7.2-7.2z"/>
|
||||||
|
<path class="st10" d="M28.69 27.76a4.782 4.782 0 0 1-6.58 4.43 4.72 4.72 0 0 1-2.32-2c-.53-.9-.76-1.95-.64-3a4.789 4.789 0 0 1 7.05-3.65m63-8.04c-7.7-3.85 1.85-2.94 1.85-2.94m-38.99 1.48c-.79-.03-1.53-.16-1.56-.72-.03-.56.64-.72.89-.78.43-.1.88-.16 1.32-.18h.74c.79.03 1.53.12 1.57.72.01.15.03.42-.46.64m15.75.33c-.79 0-1.53-.17-1.56-.73-.03-.56.64-.72.89-.78.43-.1.87-.16 1.32-.18h.75c.79.03 1.53.12 1.56.72.01.15.03.42-.46.64"/>
|
||||||
|
<path d="M56.7 10.36h16.67V2.49s-7.77-.53-16.67-.3v8.17z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M75.09 10.37h8.43L79.41 2.9l-4.32-.2v7.67z"/>
|
||||||
|
<path class="st10" d="M15.23 17.2c7.94-4.84-.13-4.23-.13-4.23m68.62-9.53c2.71-.06 4.77 0 4.77 0"/>
|
||||||
|
<path class="st11" d="M38.29 5.92c1.74-1.22 3.58-2.29 5.49-3.21.15-.07.31-.12.48-.13 3.75-.25 7.38-.31 10.74-.34v8.13H38.29V5.92zm-1.7 1.25c-1.21.91-2.44 1.83-3.26 2.45-.07.05-.12.13-.14.21-.03.08-.02.17 0 .25a.426.426 0 0 0 .39.28h3.09l-.08-3.19zm50.93 20.59c0-3.98-3.23-7.2-7.2-7.2-3.98 0-7.2 3.23-7.2 7.2 0 3.98 3.23 7.2 7.2 7.2s7.2-3.22 7.2-7.2z"/>
|
||||||
|
<path class="st10" d="M75.52 27.76c0-1.05.34-2.07.97-2.9s1.52-1.44 2.53-1.72c1.01-.28 2.08-.22 3.06.16a4.797 4.797 0 0 1 2.99 4.97 4.79 4.79 0 0 1-4 4.21c-1.04.17-2.09-.01-3.02-.5"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
14
src/assets/img/icons/suv-side-glass-right-front.svg
Normal file
14
src/assets/img/icons/suv-side-glass-right-front.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m87.63 27.74 4.31-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.2-.6-13.11-7.4-15.27-2.33-.74-8.34-1.05-11.84-1.05 0 0-9.79-8.01-13.14-8.33 0 0-24.13-1.62-43.7.98l-.87 1.49h1.61c-1.48 1.85-7.52 13.22-5.8 21.41.05.26.18.49.37.68.19.19.42.31.68.36l4.07.72 14.45 1.02h41.61" fill="#fff"/>
|
||||||
|
<path class="st10" d="m87.63 27.74 4.31-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.2-.6-13.11-7.4-15.27-2.33-.74-8.34-1.05-11.84-1.05 0 0-9.79-8.01-13.14-8.33 0 0-24.13-1.62-43.7.98l-.87 1.49h1.61c-1.48 1.85-7.52 13.22-5.8 21.41.05.26.18.49.37.68.19.19.42.31.68.36l4.07.72 14.45 1.02h41.61"/>
|
||||||
|
<path class="st11" d="M80.45 34.93a7.191 7.191 0 0 0 0-14.38 7.191 7.191 0 0 0 0 14.38z"/>
|
||||||
|
<path class="st10" d="M78.15 23.55c.92-.5 1.98-.69 3.01-.53 1.03.16 1.99.65 2.72 1.4.73.75 1.19 1.72 1.31 2.76.12 1.04-.1 2.09-.64 2.99-.53.9-1.35 1.6-2.32 1.99-.97.39-2.04.45-3.05.18-1.01-.28-1.9-.88-2.53-1.71-.63-.83-.98-1.85-.98-2.9M13.42 12.57s9.53-.91 1.85 2.93m34.59-1.77c-.49-.22-.47-.49-.46-.64.04-.6.77-.7 1.56-.72h.74c.44.02.88.08 1.32.18.25.06.92.22.89.78-.03.56-.77.7-1.56.72m-20.71-.32c-.49-.22-.47-.49-.46-.64.04-.6.77-.7 1.56-.72h.75c.44.02.88.08 1.31.18.25.06.92.22.89.78-.03.56-.77.73-1.56.73"/>
|
||||||
|
<path class="st11" d="M47.71 2.22c-8.88-.24-16.64.3-16.64.3v7.86h16.64V2.22zm-18.35.51-4.31.21-4.1 7.45h8.41V2.73z"/>
|
||||||
|
<path class="st10" d="M89.24 12.98s-8.06-.61-.13 4.22M15.97 3.47s2.06-.06 4.77 0"/>
|
||||||
|
<path d="M66.09 10.38H49.41V2.27c3.36.03 6.98.09 10.73.34.17.01.33.05.48.13 1.91.92 3.74 1.99 5.48 3.21v4.43z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M67.7 10.38h3.08a.426.426 0 0 0 .39-.28c.03-.08.03-.17 0-.25a.435.435 0 0 0-.14-.21c-.82-.62-2.04-1.54-3.25-2.45l-.08 3.19zM24.15 34.93a7.191 7.191 0 0 0 0-14.38 7.191 7.191 0 0 0 0 14.38z"/>
|
||||||
|
<path class="st10" d="M26.41 31.94c-.92.49-1.98.67-3.01.5a4.84 4.84 0 0 1-2.7-1.42 4.825 4.825 0 0 1-1.29-2.77c-.11-1.04.12-2.09.65-2.98.54-.9 1.36-1.59 2.33-1.98.97-.39 2.04-.44 3.05-.16 1.01.28 1.89.88 2.52 1.72.63.83.97 1.85.97 2.9"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
14
src/assets/img/icons/suv-side-glass-right-rear.svg
Normal file
14
src/assets/img/icons/suv-side-glass-right-rear.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m87.7 27.76 4.32-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.21-.6-13.13-7.42-15.3-2.34-.74-8.36-1.06-11.86-1.06 0 0-9.81-8.02-13.17-8.35 0 0-24.17-1.63-43.79.99l-.87 1.49h1.61C16.03 5.29 9.98 16.68 11.7 24.9c.05.26.18.5.37.68.19.19.42.31.68.36l4.08.72 14.48 1.02H73" fill="#fff"/>
|
||||||
|
<path class="st10" d="m87.7 27.76 4.32-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.21-.6-13.13-7.42-15.3-2.33-.74-8.36-1.06-11.86-1.06 0 0-9.81-8.02-13.17-8.35 0 0-24.17-1.63-43.79.99l-.87 1.49h1.61C16.03 5.29 9.98 16.68 11.7 24.9c.05.26.18.5.37.68.19.19.42.31.68.36l4.08.72 14.48 1.02H73"/>
|
||||||
|
<path class="st11" d="M80.5 34.96c3.98 0 7.2-3.23 7.2-7.2 0-3.98-3.23-7.2-7.2-7.2-3.98 0-7.2 3.23-7.2 7.2 0 3.98 3.22 7.2 7.2 7.2z"/>
|
||||||
|
<path class="st10" d="M78.2 23.56c.92-.5 1.98-.69 3.02-.53 1.04.16 1.99.65 2.72 1.41a4.79 4.79 0 0 1 .67 5.77c-.53.9-1.35 1.6-2.32 2-.97.39-2.05.46-3.06.18-1.01-.28-1.9-.88-2.54-1.71-.64-.83-.98-1.85-.98-2.9M13.35 12.56s9.55-.91 1.85 2.94m34.65-1.78c-.49-.22-.47-.5-.46-.64.04-.6.77-.7 1.57-.72h.74c.44.02.89.08 1.32.18.25.06.92.22.89.78-.03.56-.77.7-1.56.72m-20.75-.32c-.49-.22-.47-.5-.46-.64.04-.6.77-.7 1.56-.72h.75c.44.02.88.08 1.32.18.25.06.93.22.89.78-.03.56-.77.73-1.56.73"/>
|
||||||
|
<path d="M47.7 2.19c-8.9-.24-16.67.3-16.67.3v7.88H47.7V2.19z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="m29.32 2.7-4.33.2-4.11 7.46h8.43V2.7z"/>
|
||||||
|
<path class="st10" d="M89.31 12.97s-8.07-.61-.13 4.23M15.9 3.44s2.07-.06 4.77 0"/>
|
||||||
|
<path class="st11" d="M66.12 10.36H49.4V2.24c3.37.03 6.99.09 10.75.34.17.01.33.05.48.13 1.91.92 3.75 2 5.49 3.21v4.44zm1.61 0h3.09a.426.426 0 0 0 .39-.28c.03-.08.03-.17 0-.25a.435.435 0 0 0-.14-.21c-.82-.62-2.04-1.54-3.25-2.45l-.09 3.19zm-43.64 24.6c3.98 0 7.2-3.23 7.2-7.2 0-3.98-3.23-7.2-7.2-7.2-3.98 0-7.2 3.23-7.2 7.2 0 3.98 3.22 7.2 7.2 7.2z"/>
|
||||||
|
<path class="st10" d="M26.36 31.97c-.92.49-1.98.67-3.02.5a4.853 4.853 0 0 1-2.71-1.43 4.824 4.824 0 0 1-1.29-2.78 4.797 4.797 0 0 1 2.99-4.97c.97-.39 2.05-.44 3.06-.16 1.01.28 1.9.89 2.53 1.72.63.84.97 1.85.97 2.9"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
14
src/assets/img/icons/suv-side-window-damage-left-all.svg
Normal file
14
src/assets/img/icons/suv-side-window-damage-left-all.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10{fill:none}.st10,.st11,.st12{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st11{fill:#fff}.st12{fill:#d92d27}
|
||||||
|
</style>
|
||||||
|
<path d="m87.25 27.63 4.26-.92a1.162 1.162 0 0 0 .98-1.14c0-3.17-.59-12.97-7.32-15.11-2.31-.73-8.26-1.04-11.71-1.04 0 0-9.69-7.92-13-8.24 0 0-23.87-1.61-43.24.97l-.86 1.47h1.59c-1.47 1.83-7.44 13.08-5.74 21.19.05.26.18.49.36.67.18.18.42.31.67.36l4.03.71 14.29 1.01h41.17" fill="#fff"/>
|
||||||
|
<path class="st10" d="m87.25 27.63 4.26-.92a1.162 1.162 0 0 0 .98-1.14c0-3.17-.59-12.97-7.32-15.11-2.31-.73-8.26-1.04-11.71-1.04 0 0-9.69-7.92-13-8.24 0 0-23.87-1.61-43.24.97l-.86 1.47h1.59c-1.47 1.83-7.44 13.08-5.74 21.19.05.26.18.49.36.67.18.18.42.31.67.36l4.03.71 14.29 1.01h41.17"/>
|
||||||
|
<path class="st11" d="M80.14 34.75c3.93 0 7.11-3.18 7.11-7.11s-3.18-7.11-7.11-7.11-7.11 3.18-7.11 7.11c0 3.92 3.19 7.11 7.11 7.11z"/>
|
||||||
|
<path class="st10" d="M77.88 23.48c.91-.5 1.96-.68 2.98-.52a4.714 4.714 0 0 1 3.98 4.12c.12 1.03-.1 2.07-.63 2.96-.53.89-1.33 1.58-2.29 1.97a4.729 4.729 0 0 1-6.5-4.38M13.83 12.62s9.43-.9 1.83 2.9m34.22-1.75c-.48-.22-.46-.49-.46-.64.04-.59.76-.69 1.55-.71h.74c.44.02.87.08 1.3.18.25.06.91.22.88.77-.03.55-.76.69-1.54.71m-20.49-.31c-.48-.22-.46-.49-.46-.64.04-.59.76-.69 1.54-.71h.74c.44.02.87.08 1.3.18.25.06.91.22.88.77-.03.55-.76.72-1.54.72"/>
|
||||||
|
<path class="st12" d="M47.76 2.38c-8.79-.24-16.46.29-16.46.29v7.78h16.46V2.38zm-18.15.51-4.27.2-4.05 7.37h8.32V2.89z"/>
|
||||||
|
<path class="st10" d="M88.85 13.03s-7.97-.61-.13 4.18M16.36 3.62s2.04-.06 4.71 0"/>
|
||||||
|
<path class="st12" d="M65.94 10.46h-16.5V2.43c3.32.03 6.9.09 10.61.34.16.01.33.05.47.12 1.89.91 3.7 1.97 5.42 3.17v4.4zm1.59 0h3.05a.426.426 0 0 0 .39-.28c.03-.08.03-.17 0-.25a.412.412 0 0 0-.14-.21c-.81-.61-2.02-1.52-3.21-2.42l-.09 3.16z"/>
|
||||||
|
<path class="st11" d="M24.44 34.75c3.93 0 7.11-3.18 7.11-7.11s-3.18-7.11-7.11-7.11-7.11 3.18-7.11 7.11c0 3.92 3.19 7.11 7.11 7.11z"/>
|
||||||
|
<path class="st10" d="M26.68 31.79c-.91.49-1.96.66-2.98.5a4.685 4.685 0 0 1-2.67-1.41 4.716 4.716 0 0 1-1.27-2.74 4.7 4.7 0 0 1 .65-2.95 4.74 4.74 0 0 1 2.3-1.96c.96-.38 2.02-.44 3.02-.16s1.87.88 2.5 1.7c.62.82.96 1.83.96 2.87"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.2 KiB |
14
src/assets/img/icons/suv-side-window-damage-right-all.svg
Normal file
14
src/assets/img/icons/suv-side-window-damage-right-all.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10{fill:none}.st10,.st11,.st12{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st11{fill:#fff}.st12{fill:#d92d27}
|
||||||
|
</style>
|
||||||
|
<path d="M31.66 27.56h41.17l14.29-1.01 4.03-.71c.26-.05.49-.18.67-.36.18-.18.31-.42.36-.67 1.7-8.11-4.27-19.36-5.74-21.19h1.59l-.86-1.47c-19.35-2.58-43.22-.98-43.22-.98-3.31.32-13 8.24-13 8.24-3.46 0-9.41.31-11.71 1.04-6.73 2.15-7.32 11.94-7.32 15.11 0 .28.1.54.28.75.18.21.43.35.7.39l4.26.92" fill="#fff"/>
|
||||||
|
<path class="st10" d="M31.66 27.56h41.17l14.29-1.01 4.03-.71c.26-.05.49-.18.67-.36.18-.18.31-.42.36-.67 1.7-8.11-4.27-19.36-5.74-21.19h1.59l-.86-1.47c-19.35-2.58-43.22-.98-43.22-.98-3.31.32-13 8.24-13 8.24-3.46 0-9.41.31-11.71 1.04-6.73 2.15-7.32 11.94-7.32 15.11 0 .28.1.54.28.75.18.21.43.35.7.39l4.26.92"/>
|
||||||
|
<path class="st11" d="M31.37 27.63c0-3.93-3.18-7.11-7.11-7.11s-7.11 3.18-7.11 7.11 3.18 7.11 7.11 7.11c3.93.01 7.11-3.18 7.11-7.11z"/>
|
||||||
|
<path class="st10" d="M28.98 27.63a4.729 4.729 0 0 1-6.5 4.38 4.692 4.692 0 0 1-2.29-1.97c-.53-.89-.75-1.93-.63-2.96s.57-1.99 1.29-2.73a4.77 4.77 0 0 1 2.69-1.39 4.75 4.75 0 0 1 2.98.52m62.22-7.95c-7.6-3.8 1.83-2.9 1.83-2.9m-38.51 1.46c-.78-.02-1.51-.16-1.54-.71-.03-.55.63-.71.88-.77.43-.1.86-.16 1.3-.18h.74c.78.02 1.51.12 1.55.71.01.15.02.42-.46.64m15.55.32c-.78 0-1.51-.17-1.54-.72-.03-.55.63-.71.88-.77.43-.1.86-.16 1.3-.18h.74c.78.02 1.51.12 1.54.71.01.15.02.42-.46.64"/>
|
||||||
|
<path class="st12" d="M56.65 10.46h16.46V2.68s-7.68-.53-16.46-.29v8.07zm18.15 0h8.32l-4.05-7.37-4.27-.2v7.57z"/>
|
||||||
|
<path class="st10" d="M15.69 17.2c7.84-4.78-.13-4.18-.13-4.18m67.77-9.4c2.67-.06 4.71 0 4.71 0"/>
|
||||||
|
<path class="st12" d="M38.46 6.07c1.72-1.2 3.53-2.26 5.42-3.17.15-.07.31-.11.47-.12 3.71-.25 7.29-.3 10.61-.34v8.02h-16.5V6.07zM36.78 7.3c-1.2.9-2.41 1.81-3.21 2.42-.07.05-.12.12-.14.21-.02.08-.02.17 0 .25a.426.426 0 0 0 .39.28h3.05l-.09-3.16z"/>
|
||||||
|
<path class="st11" d="M87.07 27.63c0-3.93-3.18-7.11-7.11-7.11s-7.11 3.18-7.11 7.11 3.18 7.11 7.11 7.11c3.93.01 7.11-3.18 7.11-7.11z"/>
|
||||||
|
<path class="st10" d="M75.22 27.63c0-1.03.33-2.04.96-2.87a4.738 4.738 0 0 1 5.52-1.54c.96.38 1.77 1.07 2.3 1.96.53.89.76 1.92.65 2.95a4.716 4.716 0 0 1-1.27 2.74c-.71.75-1.65 1.24-2.67 1.41a4.74 4.74 0 0 1-2.98-.5"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
15
src/assets/img/icons/suv-vent-left-front.svg
Normal file
15
src/assets/img/icons/suv-vent-left-front.svg
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M31.42 27.67h41.64l14.46-1.02 4.08-.72c.26-.05.5-.18.68-.36.19-.19.31-.42.37-.68 1.72-8.2-4.32-19.58-5.81-21.43h1.61l-.87-1.49C68-.64 43.85.98 43.85.98 40.5 1.3 30.7 9.32 30.7 9.32c-3.5 0-9.52.31-11.85 1.05-6.81 2.17-7.41 12.08-7.41 15.29 0 .28.1.55.28.76.18.21.43.35.71.4l4.31.93" fill="#fff"/>
|
||||||
|
<path class="st10" d="M31.42 27.67h41.64l14.46-1.02 4.08-.72c.26-.05.5-.18.68-.36.19-.19.31-.42.37-.68 1.72-8.2-4.32-19.58-5.81-21.43h1.61l-.87-1.49C68-.64 43.85.98 43.85.98 40.5 1.3 30.7 9.32 30.7 9.32c-3.5 0-9.52.31-11.85 1.05-6.81 2.17-7.41 12.08-7.41 15.29 0 .28.1.55.28.76.18.21.43.35.71.4l4.31.93"/>
|
||||||
|
<path class="st11" d="M31.13 27.75c0-3.97-3.22-7.2-7.2-7.2-3.97 0-7.2 3.22-7.2 7.2 0 3.97 3.22 7.2 7.2 7.2 3.98-.01 7.2-3.23 7.2-7.2z"/>
|
||||||
|
<path class="st10" d="M28.72 27.75c0 1.05-.34 2.07-.98 2.9-.64.83-1.53 1.43-2.54 1.71s-2.08.21-3.05-.18a4.75 4.75 0 0 1-2.32-1.99c-.53-.9-.76-1.95-.64-2.99a4.789 4.789 0 0 1 4.03-4.18c1.04-.16 2.09.03 3.01.53m62.93-8.05c-7.69-3.85 1.85-2.94 1.85-2.94m-38.95 1.48c-.79-.03-1.53-.16-1.56-.72-.03-.56.64-.72.89-.78.43-.1.87-.16 1.32-.18h.74c.79.03 1.53.12 1.56.72.01.15.03.42-.46.64m15.74.34c-.79 0-1.53-.17-1.56-.73-.03-.56.64-.72.89-.78.43-.1.87-.16 1.31-.18h.75c.79.03 1.52.12 1.56.72.01.15.03.42-.46.64"/>
|
||||||
|
<path class="st11" d="M56.7 10.37h16.65V2.5s-7.77-.53-16.65-.3v8.17zm18.36.01h8.42l-4.1-7.46-4.32-.21v7.67z"/>
|
||||||
|
<path class="st10" d="M15.27 17.2c7.93-4.84-.13-4.22-.13-4.22m68.55-9.52c2.7-.06 4.77 0 4.77 0"/>
|
||||||
|
<path class="st11" d="M38.3 5.93c1.74-1.21 3.57-2.29 5.48-3.21.15-.07.31-.12.48-.13 3.76-.24 7.38-.3 10.74-.33v8.12H38.3V5.93z"/>
|
||||||
|
<path d="M36.61 7.18c-1.21.91-2.43 1.83-3.25 2.45-.07.05-.12.13-.14.21-.03.08-.02.17 0 .25a.426.426 0 0 0 .39.28h3.08l-.08-3.19z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M87.48 27.75c0-3.97-3.22-7.2-7.2-7.2-3.97 0-7.2 3.22-7.2 7.2 0 3.97 3.22 7.2 7.2 7.2 3.97-.01 7.2-3.23 7.2-7.2z"/>
|
||||||
|
<path class="st10" d="M75.49 27.75c0-1.05.34-2.06.97-2.9a4.792 4.792 0 0 1 5.58-1.56 4.797 4.797 0 0 1 2.99 4.97 4.763 4.763 0 0 1-1.29 2.77 4.764 4.764 0 0 1-5.71.93"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.4 KiB |
14
src/assets/img/icons/suv-vent-left-rear.svg
Normal file
14
src/assets/img/icons/suv-vent-left-rear.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M31.44 27.67h41.61l14.45-1.02 4.07-.72c.26-.05.5-.18.68-.36.19-.19.31-.42.37-.68 1.72-8.2-4.32-19.56-5.8-21.41h1.61l-.87-1.49C67.99-.63 43.86 1 43.86 1c-3.35.32-13.14 8.33-13.14 8.33-3.5 0-9.51.31-11.84 1.05-6.8 2.17-7.4 12.07-7.4 15.27 0 .28.1.55.28.76.18.21.43.35.71.4l4.31.93" fill="#fff"/>
|
||||||
|
<path class="st10" d="M31.44 27.67h41.61l14.45-1.02 4.07-.72c.26-.05.5-.18.68-.36.19-.19.31-.42.37-.68 1.72-8.2-4.32-19.56-5.8-21.41h1.61l-.87-1.49C67.99-.63 43.86 1 43.86 1c-3.35.32-13.14 8.33-13.14 8.33-3.5 0-9.51.31-11.84 1.05-6.8 2.17-7.4 12.07-7.4 15.27 0 .28.1.55.28.76.18.21.43.35.71.4l4.31.93"/>
|
||||||
|
<path class="st11" d="M31.15 27.74a7.191 7.191 0 0 0-14.38 0 7.191 7.191 0 0 0 14.38 0z"/>
|
||||||
|
<path class="st10" d="M28.74 27.74c0 1.05-.34 2.06-.98 2.9-.63.83-1.53 1.43-2.53 1.71-1.01.28-2.08.21-3.05-.18a4.75 4.75 0 0 1-2.32-1.99c-.53-.9-.76-1.95-.64-2.99.12-1.04.58-2.01 1.31-2.76.73-.75 1.68-1.25 2.72-1.4a4.78 4.78 0 0 1 3.01.53m62.87-8.06c-7.68-3.84 1.85-2.93 1.85-2.93m-38.92 1.48c-.79-.03-1.53-.16-1.56-.72-.03-.56.63-.72.89-.78.43-.1.87-.16 1.32-.18h.74c.79.03 1.53.12 1.56.72.01.15.03.42-.46.64m15.72.33c-.79 0-1.53-.17-1.56-.73-.03-.56.64-.72.89-.78.43-.1.87-.16 1.31-.18h.75c.79.03 1.52.12 1.56.72.01.15.03.42-.46.64"/>
|
||||||
|
<path class="st11" d="M56.69 10.38h16.64V2.52s-7.76-.53-16.64-.3v8.16z"/>
|
||||||
|
<path d="M75.04 10.38h8.41l-4.1-7.45-4.31-.21v7.66z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M15.3 17.2c7.92-4.83-.13-4.22-.13-4.22m68.49-9.51c2.7-.06 4.77 0 4.77 0"/>
|
||||||
|
<path class="st11" d="M38.31 5.94c1.74-1.21 3.57-2.29 5.48-3.21.15-.07.31-.12.48-.13 3.75-.24 7.37-.3 10.73-.33v8.11H38.31V5.94zm-1.69 1.25c-1.21.91-2.43 1.83-3.25 2.45-.07.05-.12.13-.14.21-.02.08-.02.17 0 .25a.426.426 0 0 0 .39.28h3.08l-.08-3.19zm50.83 20.55a7.191 7.191 0 0 0-14.38 0 7.191 7.191 0 0 0 14.38 0z"/>
|
||||||
|
<path class="st10" d="M75.47 27.74c0-1.05.34-2.06.97-2.9s1.52-1.44 2.52-1.72c1.01-.28 2.08-.22 3.05.16.97.39 1.79 1.08 2.33 1.98.54.9.77 1.94.65 2.98a4.763 4.763 0 0 1-1.29 2.77 4.72 4.72 0 0 1-2.7 1.42c-1.03.17-2.09-.01-3.01-.5"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
15
src/assets/img/icons/suv-vent-right-front.svg
Normal file
15
src/assets/img/icons/suv-vent-right-front.svg
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m87.66 27.75 4.31-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.21-.6-13.12-7.41-15.29-2.33-.74-8.35-1.05-11.85-1.05 0 0-9.8-8.02-13.15-8.34 0 0-24.15-1.62-43.74.99l-.87 1.49h1.61c-1.48 1.85-7.53 13.23-5.81 21.43.05.26.18.49.37.68.19.19.42.31.68.36l4.08.72 14.46 1.02h41.64" fill="#fff"/>
|
||||||
|
<path class="st10" d="m87.66 27.75 4.31-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.21-.6-13.12-7.41-15.29-2.33-.74-8.35-1.05-11.85-1.05 0 0-9.8-8.02-13.15-8.34 0 0-24.15-1.62-43.74.99l-.87 1.49h1.61c-1.48 1.85-7.53 13.23-5.81 21.43.05.26.18.49.37.68.19.19.42.31.68.36l4.08.72 14.46 1.02h41.64"/>
|
||||||
|
<path class="st11" d="M80.47 34.94c3.97 0 7.2-3.22 7.2-7.2 0-3.97-3.22-7.2-7.2-7.2-3.97 0-7.2 3.22-7.2 7.2s3.22 7.2 7.2 7.2z"/>
|
||||||
|
<path class="st10" d="M78.17 23.55a4.78 4.78 0 0 1 7.04 3.65c.12 1.04-.1 2.09-.64 2.99-.53.9-1.35 1.6-2.32 1.99-.97.39-2.04.45-3.05.18-1.01-.28-1.9-.88-2.54-1.71-.64-.83-.98-1.85-.98-2.9M13.39 12.56s9.54-.91 1.85 2.94m34.61-1.78c-.49-.22-.47-.49-.46-.64.04-.6.77-.7 1.56-.72h.74c.44.02.88.08 1.32.18.25.06.92.22.89.78-.03.56-.77.7-1.56.72m-20.71-.32c-.49-.22-.47-.49-.46-.64.04-.6.77-.7 1.56-.72h.75c.44.02.88.08 1.31.18.25.06.92.22.89.78-.03.56-.77.73-1.56.73"/>
|
||||||
|
<path class="st11" d="M47.71 2.21c-8.89-.24-16.65.3-16.65.3v7.87h16.65V2.21zm-18.37.51-4.32.21-4.1 7.46h8.42V2.72z"/>
|
||||||
|
<path class="st10" d="M89.27 12.97s-8.06-.61-.13 4.22M15.95 3.46s2.07-.06 4.77 0"/>
|
||||||
|
<path class="st11" d="M66.1 10.37H49.4V2.26c3.36.03 6.98.09 10.73.34.17.01.33.05.48.13 1.91.92 3.74 2 5.48 3.21v4.43z"/>
|
||||||
|
<path d="M67.71 10.37h3.08a.426.426 0 0 0 .39-.28c.03-.08.03-.17 0-.25a.435.435 0 0 0-.14-.21c-.82-.62-2.04-1.54-3.25-2.45l-.08 3.19z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M24.12 34.94c3.97 0 7.2-3.22 7.2-7.2 0-3.97-3.22-7.2-7.2-7.2-3.97 0-7.2 3.22-7.2 7.2.01 3.98 3.23 7.2 7.2 7.2z"/>
|
||||||
|
<path class="st10" d="M26.39 31.95a4.764 4.764 0 0 1-5.71-.93 4.825 4.825 0 0 1-1.29-2.77 4.797 4.797 0 0 1 2.99-4.97 4.792 4.792 0 0 1 5.58 1.56c.63.83.97 1.85.97 2.9"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
14
src/assets/img/icons/suv-vent-right-rear.svg
Normal file
14
src/assets/img/icons/suv-vent-right-rear.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m87.63 27.74 4.31-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.2-.6-13.11-7.4-15.27-2.33-.74-8.34-1.05-11.84-1.05 0 0-9.79-8.01-13.14-8.33 0 0-24.13-1.62-43.7.98l-.87 1.49h1.61c-1.48 1.85-7.52 13.22-5.8 21.41.05.26.18.49.37.68.19.19.42.31.68.36l4.07.72 14.45 1.02h41.61" fill="#fff"/>
|
||||||
|
<path class="st10" d="m87.63 27.74 4.31-.93c.28-.04.53-.18.71-.4.18-.21.28-.48.28-.76 0-3.2-.6-13.11-7.4-15.27-2.33-.74-8.34-1.05-11.84-1.05 0 0-9.79-8.01-13.14-8.33 0 0-24.13-1.62-43.7.98l-.87 1.49h1.61c-1.48 1.85-7.52 13.22-5.8 21.41.05.26.18.49.37.68.19.19.42.31.68.36l4.07.72 14.45 1.02h41.61"/>
|
||||||
|
<path class="st11" d="M80.44 34.93a7.191 7.191 0 0 0 0-14.38 7.191 7.191 0 0 0 0 14.38z"/>
|
||||||
|
<path class="st10" d="M78.15 23.55c.92-.5 1.98-.69 3.01-.53 1.03.16 1.99.65 2.72 1.4.73.75 1.19 1.72 1.31 2.76.12 1.04-.1 2.09-.64 2.99-.53.9-1.35 1.6-2.32 1.99-.97.39-2.04.45-3.05.18-1.01-.28-1.9-.88-2.53-1.71-.63-.83-.98-1.85-.98-2.9M13.42 12.57s9.53-.91 1.85 2.93m34.59-1.77c-.49-.22-.47-.49-.46-.64.04-.6.77-.7 1.56-.72h.74c.44.02.88.08 1.32.18.25.06.92.22.89.78-.03.56-.77.7-1.56.72m-20.71-.32c-.49-.22-.47-.49-.46-.64.04-.6.77-.7 1.56-.72h.75c.44.02.88.08 1.31.18.25.06.92.22.89.78-.03.56-.77.73-1.56.73"/>
|
||||||
|
<path class="st11" d="M47.71 2.22c-8.88-.24-16.64.3-16.64.3v7.86h16.64V2.22z"/>
|
||||||
|
<path d="m29.36 2.73-4.31.21-4.1 7.45h8.41V2.73z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M89.24 12.98s-8.06-.61-.13 4.22M15.98 3.47s2.06-.06 4.77 0"/>
|
||||||
|
<path class="st11" d="M66.09 10.38H49.41V2.27c3.36.03 6.98.09 10.72.34.17.01.33.05.48.13 1.91.92 3.74 1.99 5.48 3.21v4.43zm1.61 0h3.08a.426.426 0 0 0 .39-.28c.03-.08.03-.17 0-.25a.435.435 0 0 0-.14-.21c-.82-.62-2.04-1.54-3.25-2.45l-.08 3.19zM24.15 34.93a7.191 7.191 0 0 0 0-14.38 7.191 7.191 0 0 0 0 14.38z"/>
|
||||||
|
<path class="st10" d="M26.41 31.94c-.92.49-1.98.67-3.01.5a4.84 4.84 0 0 1-2.7-1.42 4.825 4.825 0 0 1-1.29-2.77c-.11-1.04.12-2.09.65-2.98.54-.9 1.36-1.59 2.33-1.98.97-.39 2.04-.44 3.05-.16 1.01.28 1.89.88 2.52 1.72.63.83.97 1.85.97 2.9"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.3 KiB |
18
src/assets/img/icons/truck-left-front-vent.svg
Normal file
18
src/assets/img/icons/truck-left-front-vent.svg
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M73.92 26.75h-3.7c.04-5.1-.3-10.19-1-15.23h29.16v12"/>
|
||||||
|
<path class="st10" d="M73.92 26.75h-3.7c.04-5.1-.3-10.19-1-15.23h29.16v12M69.21 11.53h0"/>
|
||||||
|
<path class="st9" d="m88.92 23.56.27-.05h10.53v.2c0 1.68-1.16 3.05-3.77 3.05H70.21"/>
|
||||||
|
<path class="st10" d="m88.92 23.56.27-.05h10.53v.2c0 1.68-1.16 3.05-3.77 3.05H70.21"/>
|
||||||
|
<path class="st11" d="M6.65 26.41c-.47-.23-.89-.56-1.22-.97-.33-.41-.56-.89-.67-1.4-.12-.51-.12-1.04 0-1.56l1.67-7.16c.16-.68.52-1.3 1.03-1.78s1.16-.79 1.85-.91l15.84-2.89c.48-.08.93-.26 1.33-.53l11.67-7.93c.56-.38 1.23-.59 1.91-.59h26.21s1.76 3.06 2.92 10.83c.71 5.05 1.04 10.14 1 15.23H8.17c-.53.01-1.04-.11-1.52-.34z"/>
|
||||||
|
<path class="st10" d="M96.2 19.12c-2.58-2.48-1.7-4.96-1.7-4.96h3.39"/>
|
||||||
|
<path d="m31.9 7.76-3.31 2.33v1.44h3.31V7.76z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M33.94 6.75c-.06.1-.09.22-.09.33v4.44h16V2.78h-9c-.66 0-1.3.19-1.86.56L34.18 6.5c-.1.07-.18.15-.24.25zm17.86 4.78h14.19s-.29-2-.76-4.38c-.32-1.48-.72-2.94-1.2-4.38H51.81l-.01 8.76z"/>
|
||||||
|
<path class="st10" d="M8.2 19.47c.71-.92 2.71-1.07 2.71-1.07v-3.1h-4m57.46.43c.87-.11 1.67-.34 1.64-.96-.03-.62-.78-.72-1.07-.76-.49-.06-.98-.07-1.47-.05-.26.01-.54.04-.8.07-.87.11-1.67.3-1.64.96.01.17.02.47.58.66M48 15.73c.87-.11 1.66-.34 1.64-.96-.02-.62-.78-.72-1.07-.76-.49-.06-.98-.07-1.47-.05-.29.01-.56.04-.82.07-.87.11-1.67.3-1.64.96 0 .17.02.47.58.66"/>
|
||||||
|
<path class="st11" d="M28.98 26.76a7.861 7.861 0 0 0-15.72 0 7.861 7.861 0 0 0 15.72 0z"/>
|
||||||
|
<path class="st10" d="M26.33 26.76c0 1.14-.38 2.26-1.08 3.16a5.224 5.224 0 0 1-8.64-.52c-.58-.98-.83-2.13-.69-3.27a5.212 5.212 0 0 1 4.4-4.55c1.13-.17 2.29.03 3.29.58"/>
|
||||||
|
<path class="st11" d="M73.91 26.13a7.885 7.885 0 0 1 2.75-5.3 7.894 7.894 0 0 1 11.02.78 7.87 7.87 0 0 1 1.97 5.63c-.1 2.06-1.01 4-2.53 5.4a7.919 7.919 0 0 1-5.59 2.09 7.878 7.878 0 0 1-5.45-2.42 7.9 7.9 0 0 1-2.17-6.18z"/>
|
||||||
|
<path class="st10" d="M76.52 26.76c0-1.14.38-2.26 1.07-3.16.69-.91 1.67-1.57 2.77-1.87 1.1-.3 2.27-.24 3.34.19 1.06.43 1.95 1.19 2.54 2.17.58.98.83 2.13.7 3.27s-.63 2.2-1.42 3.02c-.79.82-1.83 1.37-2.96 1.54-1.13.18-2.29-.02-3.29-.57"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.4 KiB |
14
src/assets/img/icons/truck-rear-glass-multi-center.svg
Normal file
14
src/assets/img/icons/truck-rear-glass-multi-center.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M38.19 29.38v1.96c-.07.96-.5 1.85-1.21 2.5-.7.65-1.63 1.02-2.59 1.02s-1.88-.36-2.59-1.02c-.7-.65-1.14-1.55-1.21-2.5v-1.96"/>
|
||||||
|
<path class="st10" d="M38.19 29.38v1.96c-.07.96-.5 1.85-1.21 2.5-.7.65-1.63 1.02-2.59 1.02s-1.88-.36-2.59-1.02c-.7-.65-1.14-1.55-1.21-2.5v-1.96"/>
|
||||||
|
<path class="st9" d="M73.47 29.73v1.61c-.06.97-.49 1.87-1.19 2.54-.71.66-1.64 1.03-2.6 1.03s-1.9-.37-2.6-1.03a3.777 3.777 0 0 1-1.19-2.54v-1.61"/>
|
||||||
|
<path class="st10" d="M73.47 29.73v1.61c-.06.97-.49 1.87-1.19 2.54-.71.66-1.64 1.03-2.6 1.03s-1.9-.37-2.6-1.03a3.777 3.777 0 0 1-1.19-2.54v-1.61"/>
|
||||||
|
<path class="st11" d="M71.07 14.23H33.33l6.71-12.46c.21-.31.49-.57.82-.76.33-.19.69-.3 1.07-.32C43.82.57 48.11.52 52.85.52c4.66 0 7.88.04 9.64.17.37.03.73.14 1.06.33.32.19.6.45.8.76l6.72 12.45zm-40.68 1.33c0-.17.03-.35.1-.51.07-.16.16-.31.29-.43.12-.12.27-.22.43-.29.16-.07.33-.1.51-.1H72.7c.17 0 .35.03.51.1.16.07.31.16.43.29.12.12.22.27.29.43.07.16.1.33.1.51v12.91c0 1.31.25 2.37-1.06 2.37h-41.5c-1.31 0-1.06-1.06-1.06-2.37V15.56z"/>
|
||||||
|
<path class="st11" d="M56.54 12.27H67.5l-4.11-8.5c-.23-.35-.53-.63-.9-.83-.36-.2-.77-.3-1.18-.3h-4.76v9.63zm-8.7 0H36.88l4.13-8.52c.22-.34.52-.62.88-.81.36-.19.76-.3 1.16-.3h4.79v9.63z"/>
|
||||||
|
<path class="st10" d="M74.01 26.5c-20.89 3.93-43.62 0-43.62 0"/>
|
||||||
|
<path d="M54.99 3.36h-5.57v8.91h5.57V3.36z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M32.55 22.42c.43-.94.91-2.53.91-4.93 0 0-2.53-.81-3.07 1.78m41.46 3.15c-.43-.94-.91-2.53-.91-4.93 0 0 2.51-.81 3.07 1.78"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.8 KiB |
15
src/assets/img/icons/truck-rear-glass-multi-left.svg
Normal file
15
src/assets/img/icons/truck-rear-glass-multi-left.svg
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M38.21 29.36v1.96c-.07.96-.5 1.85-1.21 2.5a3.805 3.805 0 0 1-5.16 0c-.7-.65-1.13-1.55-1.21-2.5v-1.96"/>
|
||||||
|
<path class="st10" d="M38.21 29.36v1.96c-.07.96-.5 1.85-1.21 2.5a3.805 3.805 0 0 1-5.16 0c-.7-.65-1.13-1.55-1.21-2.5v-1.96"/>
|
||||||
|
<path class="st9" d="M73.45 29.71v1.61c-.06.96-.48 1.87-1.19 2.53a3.79 3.79 0 0 1-2.6 1.03c-.97 0-1.9-.37-2.6-1.03-.7-.66-1.13-1.57-1.19-2.53v-1.61"/>
|
||||||
|
<path class="st10" d="M73.45 29.71v1.61c-.06.96-.48 1.87-1.19 2.53a3.79 3.79 0 0 1-2.6 1.03c-.97 0-1.9-.37-2.6-1.03-.7-.66-1.13-1.57-1.19-2.53v-1.61"/>
|
||||||
|
<path class="st11" d="M71.05 14.23H33.36l6.7-12.44c.21-.31.49-.57.82-.76.33-.19.69-.3 1.07-.32C43.83.59 48.12.54 52.86.54c4.65 0 7.87.04 9.63.17a2.44 2.44 0 0 1 1.85 1.09l6.71 12.43zm-40.63 1.33c0-.17.03-.35.1-.51.07-.16.16-.31.29-.43.12-.12.27-.22.43-.29.16-.07.33-.1.51-.1h40.93c.17 0 .35.03.51.1.16.07.31.16.43.29.12.12.22.27.29.43.07.16.1.33.1.51v12.89c0 1.31.25 2.37-1.06 2.37H31.47c-1.31 0-1.06-1.06-1.06-2.37V15.56z"/>
|
||||||
|
<path class="st11" d="M56.54 12.28h10.94l-4.11-8.49c-.23-.35-.53-.63-.9-.83-.36-.2-.77-.3-1.18-.3h-4.76v9.62z"/>
|
||||||
|
<path d="M47.84 12.28H36.9l4.12-8.51c.22-.34.52-.62.88-.81.36-.19.76-.3 1.16-.3h4.78v9.62z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M73.99 26.49c-20.86 3.93-43.57 0-43.57 0"/>
|
||||||
|
<path class="st11" d="M54.99 3.37h-5.57v8.9h5.57v-8.9z"/>
|
||||||
|
<path class="st10" d="M32.57 22.41c.43-.94.91-2.53.91-4.92 0 0-2.53-.81-3.06 1.78m41.41 3.14c-.43-.94-.91-2.53-.91-4.92 0 0 2.51-.81 3.06 1.78"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.8 KiB |
15
src/assets/img/icons/truck-rear-glass-multi-right.svg
Normal file
15
src/assets/img/icons/truck-rear-glass-multi-right.svg
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M73.77 29.36v1.96c-.07.96-.5 1.85-1.21 2.5s-1.63 1.01-2.58 1.01c-.96 0-1.88-.36-2.58-1.01s-1.13-1.55-1.21-2.5v-1.96"/>
|
||||||
|
<path class="st10" d="M73.77 29.36v1.96c-.07.96-.5 1.85-1.21 2.5s-1.63 1.01-2.58 1.01c-.96 0-1.88-.36-2.58-1.01s-1.13-1.55-1.21-2.5v-1.96"/>
|
||||||
|
<path class="st9" d="M38.54 29.71v1.61c-.06.96-.48 1.87-1.19 2.53a3.79 3.79 0 0 1-2.6 1.03c-.97 0-1.9-.37-2.6-1.03-.7-.66-1.13-1.57-1.19-2.53v-1.61"/>
|
||||||
|
<path class="st10" d="M38.54 29.71v1.61c-.06.96-.48 1.87-1.19 2.53a3.79 3.79 0 0 1-2.6 1.03c-.97 0-1.9-.37-2.6-1.03-.7-.66-1.13-1.57-1.19-2.53v-1.61"/>
|
||||||
|
<path class="st11" d="M40.07 1.79A2.44 2.44 0 0 1 41.92.7C43.68.57 46.9.53 51.55.53c4.73 0 9.02.05 10.91.17.38.03.74.14 1.07.32.33.19.61.45.82.76l6.7 12.44H33.36l6.71-12.43zm33.92 26.66c0 1.31.25 2.37-1.06 2.37H31.47c-1.31 0-1.06-1.06-1.06-2.37V15.56c0-.17.03-.35.1-.51.07-.16.16-.31.29-.43.12-.12.27-.22.43-.29.16-.07.33-.1.51-.1h40.93c.17 0 .35.03.51.1.16.07.31.16.43.29.12.12.22.27.29.43.07.16.1.33.1.51v12.89z"/>
|
||||||
|
<path class="st11" d="M47.87 2.66h-4.76c-.41 0-.82.1-1.18.3-.36.2-.67.48-.9.83l-4.11 8.49h10.94V2.66z"/>
|
||||||
|
<path d="M56.56 2.66h4.78c.41 0 .8.1 1.16.3.36.19.66.47.88.81l4.12 8.51H56.56V2.66z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M73.99 26.49s-22.71 3.93-43.57 0"/>
|
||||||
|
<path class="st11" d="M49.42 12.28h5.57v-8.9h-5.57v8.9z"/>
|
||||||
|
<path class="st10" d="M73.99 19.27c-.53-2.59-3.06-1.78-3.06-1.78 0 2.39.48 3.98.91 4.92m-41.42-3.14c.55-2.59 3.06-1.78 3.06-1.78 0 2.39-.48 3.98-.91 4.92"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.8 KiB |
14
src/assets/img/icons/truck-rear-glass-multi.svg
Normal file
14
src/assets/img/icons/truck-rear-glass-multi.svg
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st12{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st12{fill:#d92d27}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M38.07 29.48v1.98a3.831 3.831 0 0 1-3.83 3.55 3.831 3.831 0 0 1-3.83-3.55v-1.98"/>
|
||||||
|
<path class="st10" d="M38.07 29.48v1.98a3.831 3.831 0 0 1-3.83 3.55 3.831 3.831 0 0 1-3.83-3.55v-1.98"/>
|
||||||
|
<path class="st9" d="M73.66 29.84v1.63c-.06.97-.49 1.89-1.2 2.56-.71.67-1.65 1.04-2.63 1.04s-1.92-.37-2.63-1.04a3.835 3.835 0 0 1-1.2-2.56v-1.63"/>
|
||||||
|
<path class="st10" d="M73.66 29.84v1.63c-.06.97-.49 1.89-1.2 2.56-.71.67-1.65 1.04-2.63 1.04s-1.92-.37-2.63-1.04a3.835 3.835 0 0 1-1.2-2.56v-1.63"/>
|
||||||
|
<path d="M71.24 14.2H33.16l6.77-12.57c.21-.32.5-.58.83-.77.33-.19.7-.3 1.08-.33 1.9-.12 6.24-.18 11.02-.18 4.7 0 7.95.04 9.72.17.38.03.74.14 1.06.33.33.19.6.45.81.77l6.79 12.58zm-41.05 1.34c0-.18.03-.35.1-.51.07-.16.17-.31.29-.43.12-.12.27-.22.43-.29.16-.07.34-.1.51-.1h41.34c.18 0 .35.03.51.1.16.07.31.17.43.29.12.12.22.27.29.43.07.16.1.34.1.51v13.02c0 1.32.25 2.39-1.07 2.39H31.26c-1.32 0-1.07-1.07-1.07-2.39V15.54z" fill="#fff" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st12" d="M56.58 12.22h11.05l-4.15-8.57c-.23-.35-.54-.64-.9-.83-.37-.2-.78-.3-1.19-.3h-4.81v9.7zm-8.78 0H36.74l4.17-8.59c.22-.34.53-.63.89-.82.36-.2.76-.3 1.17-.3h4.83v9.71z"/>
|
||||||
|
<path class="st10" d="M74.21 26.58c-21.08 3.97-44.01 0-44.01 0"/>
|
||||||
|
<path class="st12" d="M55.01 3.23h-5.62v8.99h5.62V3.23z"/>
|
||||||
|
<path class="st10" d="M32.37 22.46c.43-.95.92-2.55.92-4.97 0 0-2.55-.82-3.09 1.8m41.83 3.17c-.43-.95-.92-2.55-.92-4.97 0 0 2.53-.82 3.09 1.8"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.7 KiB |
12
src/assets/img/icons/truck-rear-glass.svg
Normal file
12
src/assets/img/icons/truck-rear-glass.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M38.15 29.41v1.97a3.818 3.818 0 0 1-3.81 3.53c-.96 0-1.89-.36-2.6-1.02a3.773 3.773 0 0 1-1.21-2.51v-1.97"/>
|
||||||
|
<path class="st10" d="M38.15 29.41v1.97a3.818 3.818 0 0 1-3.81 3.53c-.96 0-1.89-.36-2.6-1.02a3.773 3.773 0 0 1-1.21-2.51v-1.97"/>
|
||||||
|
<path class="st9" d="M73.53 29.76v1.62c-.06.97-.49 1.88-1.19 2.54-.71.66-1.64 1.04-2.61 1.04s-1.91-.37-2.61-1.04a3.777 3.777 0 0 1-1.19-2.54v-1.62"/>
|
||||||
|
<path class="st10" d="M73.53 29.76v1.62c-.06.97-.49 1.88-1.19 2.54-.71.66-1.64 1.04-2.61 1.04s-1.91-.37-2.61-1.04a3.777 3.777 0 0 1-1.19-2.54v-1.62"/>
|
||||||
|
<path d="M71.13 14.22H33.28l6.73-12.49A2.525 2.525 0 0 1 41.9.64C43.79.52 48.1.47 52.85.47c4.67 0 7.9.04 9.67.17a2.482 2.482 0 0 1 1.87 1.09l6.74 12.49zm-40.8 1.33c0-.17.03-.35.1-.51.07-.16.16-.31.29-.43.12-.12.27-.22.43-.29.16-.07.33-.1.51-.1h41.1c.17 0 .35.03.51.1.16.07.31.17.43.29.12.12.22.27.29.43.07.16.1.33.1.51V28.5c0 1.31.25 2.38-1.06 2.38H31.39c-1.31 0-1.06-1.07-1.06-2.38V15.55z" fill="#fff" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M47.82 12.25H36.83l4.14-8.54c.22-.34.53-.62.88-.82.36-.19.76-.3 1.17-.3h18.31c.41 0 .82.1 1.19.3.36.2.67.48.9.83l4.13 8.52H47.82z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M74.08 26.53c-20.95 3.94-43.75 0-43.75 0m2.16-4.1c.43-.95.91-2.54.91-4.94 0 0-2.54-.82-3.07 1.79m41.58 3.15c-.43-.94-.91-2.53-.91-4.94 0 0 2.52-.82 3.07 1.79"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.7 KiB |
18
src/assets/img/icons/truck-right-front-vent.svg
Normal file
18
src/assets/img/icons/truck-right-front-vent.svg
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M6.03 23.52v-12H35.2c-.71 5.05-1.04 10.14-1 15.23h-3.7"/>
|
||||||
|
<path class="st10" d="M6.03 23.52v-12H35.2c-.71 5.05-1.04 10.14-1 15.23h-3.7m4.7-15.22h0"/>
|
||||||
|
<path class="st9" d="M34.19 26.76H8.44c-2.61 0-3.77-1.36-3.77-3.05v-.2H15.2l.27.05"/>
|
||||||
|
<path class="st10" d="M34.19 26.76H8.44c-2.61 0-3.77-1.36-3.77-3.05v-.2H15.2l.27.05"/>
|
||||||
|
<path class="st11" d="M96.23 26.76H34.19c-.04-5.1.3-10.19 1-15.23C36.35 3.76 38.11.7 38.11.7h26.21c.68 0 1.35.2 1.91.59L77.9 9.22c.4.27.85.45 1.33.53l15.84 2.89c.69.11 1.34.43 1.85.91.51.48.87 1.1 1.03 1.78l1.67 7.16c.12.51.12 1.04 0 1.56-.12.51-.35.99-.67 1.4a3.5 3.5 0 0 1-1.22.97c-.45.22-.97.34-1.5.34z"/>
|
||||||
|
<path class="st10" d="M6.51 14.16H9.9s.88 2.48-1.7 4.96"/>
|
||||||
|
<path d="M72.51 11.53h3.31v-1.44l-3.31-2.33v3.77z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="m70.23 6.5-4.82-3.17c-.55-.36-1.2-.56-1.86-.56h-9v8.75h16V7.09a.63.63 0 0 0-.09-.33.64.64 0 0 0-.23-.26zM52.59 2.78H40.38c-.48 1.43-.88 2.9-1.2 4.38-.47 2.38-.76 4.38-.76 4.38h14.19l-.02-8.76z"/>
|
||||||
|
<path class="st10" d="M97.49 15.31h-4v3.1s2 .14 2.71 1.07m-53.4-3.84c.56-.19.57-.49.58-.66.03-.66-.77-.86-1.64-.96-.26-.03-.54-.06-.8-.07-.49-.03-.98-.01-1.47.05-.29.04-1.04.14-1.07.76-.03.62.77.86 1.64.96m19.14-.08c.56-.19.58-.49.58-.66.03-.66-.77-.86-1.64-.96-.26-.03-.54-.06-.82-.07-.49-.03-.98-.01-1.47.05-.28.04-1.04.14-1.07.76-.02.62.77.86 1.64.96"/>
|
||||||
|
<path class="st11" d="M83.28 34.62a7.861 7.861 0 0 0 0-15.72 7.861 7.861 0 0 0 0 15.72z"/>
|
||||||
|
<path class="st10" d="M80.79 22.17c1-.55 2.16-.75 3.29-.58 1.13.17 2.17.71 2.97 1.53.8.82 1.3 1.88 1.43 3.02.13 1.14-.11 2.29-.69 3.27a5.23 5.23 0 0 1-2.53 2.18c-1.06.43-2.23.5-3.34.2-1.1-.3-2.08-.96-2.77-1.86-.7-.91-1.07-2.02-1.08-3.16"/>
|
||||||
|
<path class="st11" d="M30.52 26.76a7.9 7.9 0 0 1-2.2 5.55 7.878 7.878 0 0 1-5.45 2.42c-2.06.06-4.07-.69-5.59-2.09a7.864 7.864 0 0 1-2.53-5.4c-.1-2.06.6-4.08 1.97-5.63a7.894 7.894 0 0 1 11.02-.78 7.927 7.927 0 0 1 2.75 5.3c.02.21.03.42.03.63z"/>
|
||||||
|
<path class="st10" d="M25.15 31.35c-1.01.54-2.16.74-3.29.57a5.257 5.257 0 0 1-2.96-1.54 5.228 5.228 0 0 1-1.42-3.02c-.13-1.14.12-2.28.7-3.27a5.236 5.236 0 0 1 8.65-.49c.69.91 1.07 2.02 1.07 3.16"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
19
src/assets/img/icons/truck-side-glass-left-front.svg
Normal file
19
src/assets/img/icons/truck-side-glass-left-front.svg
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M74.08 26.82h-3.73c.04-5.13-.3-10.26-1.01-15.35h29.38v12.09"/>
|
||||||
|
<path class="st10" d="M74.08 26.82h-3.73c.04-5.13-.3-10.26-1.01-15.35h29.38v12.09M69.34 11.48h0"/>
|
||||||
|
<path class="st9" d="m89.2 23.61.27-.05h10.61v.2c0 1.7-1.16 3.07-3.8 3.07H70.35"/>
|
||||||
|
<path class="st10" d="m89.2 23.61.27-.05h10.61v.2c0 1.7-1.16 3.07-3.8 3.07H70.35"/>
|
||||||
|
<path class="st11" d="M6.3 26.48c-.48-.23-.9-.56-1.23-.98-.33-.41-.56-.9-.68-1.41-.12-.52-.12-1.05 0-1.57l1.68-7.22c.16-.69.52-1.31 1.04-1.8.52-.48 1.17-.8 1.86-.91l15.97-2.91c.48-.08.94-.26 1.34-.54l11.76-7.99c.57-.39 1.24-.59 1.93-.59H66.4s1.77 3.08 2.94 10.92c.71 5.08 1.05 10.21 1.01 15.35H7.83c-.53 0-1.05-.12-1.53-.35z"/>
|
||||||
|
<path class="st10" d="M96.53 19.14c-2.6-2.5-1.71-5-1.71-5h3.41"/>
|
||||||
|
<path class="st11" d="m31.74 7.68-3.34 2.35v1.45h3.34v-3.8z"/>
|
||||||
|
<path d="M33.8 6.67c-.06.1-.09.22-.09.34v4.47h16.12V2.66h-9.07c-.66 0-1.31.19-1.87.56l-4.86 3.2c-.09.06-.17.15-.23.25z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M51.79 11.48h14.3s-.29-2.01-.77-4.41c-.32-1.49-.72-2.96-1.2-4.41H51.81l-.02 8.82z"/>
|
||||||
|
<path class="st10" d="M7.86 19.49c.72-.93 2.73-1.08 2.73-1.08v-3.12H6.56m57.9.42c.87-.11 1.68-.34 1.65-.97-.03-.63-.79-.73-1.08-.77-.49-.06-.99-.08-1.48-.05-.27.01-.54.04-.81.07-.87.11-1.68.3-1.65.97.01.17.02.47.58.66m-13.7.09c.87-.11 1.67-.34 1.65-.97-.02-.63-.79-.73-1.08-.77-.49-.06-.99-.08-1.48-.05-.29.01-.57.04-.83.07-.87.11-1.68.3-1.65.97 0 .17.02.47.58.66"/>
|
||||||
|
<path class="st11" d="M28.81 26.83c0-4.38-3.55-7.92-7.92-7.92-4.38 0-7.92 3.55-7.92 7.92s3.55 7.92 7.92 7.92 7.92-3.55 7.92-7.92z"/>
|
||||||
|
<path class="st10" d="M26.13 26.83c0 1.15-.38 2.27-1.08 3.19-.7.92-1.68 1.58-2.8 1.88-1.11.3-2.29.23-3.36-.2a5.22 5.22 0 0 1-2.55-2.2c-.59-.99-.83-2.15-.7-3.3s.64-2.21 1.44-3.04c.8-.83 1.85-1.37 2.99-1.54a5.25 5.25 0 0 1 3.32.59"/>
|
||||||
|
<path class="st11" d="M74.08 26.19a7.958 7.958 0 0 1 2.77-5.34 7.936 7.936 0 0 1 5.71-1.87c2.08.15 4.01 1.1 5.39 2.66a7.967 7.967 0 0 1 1.99 5.67 7.958 7.958 0 0 1-2.55 5.44 7.919 7.919 0 0 1-5.63 2.1 7.93 7.93 0 0 1-5.49-2.44 7.918 7.918 0 0 1-2.21-5.59c-.01-.21 0-.42.02-.63z"/>
|
||||||
|
<path class="st10" d="M76.7 26.83c0-1.15.38-2.27 1.08-3.19.7-.92 1.68-1.58 2.79-1.88a5.268 5.268 0 0 1 5.2 8.72c-.8.83-1.85 1.38-2.99 1.55-1.14.18-2.3-.02-3.32-.57"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
18
src/assets/img/icons/truck-side-glass-left-rear.svg
Normal file
18
src/assets/img/icons/truck-side-glass-left-rear.svg
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M73.94 26.76h-3.71c.04-5.1-.3-10.2-1-15.25h29.19v12.01"/>
|
||||||
|
<path class="st10" d="M73.94 26.76h-3.71c.04-5.1-.3-10.2-1-15.25h29.19v12.01m-29.2-12h0"/>
|
||||||
|
<path class="st9" d="m88.96 23.57.27-.05h10.54v.2c0 1.69-1.16 3.05-3.77 3.05H70.23"/>
|
||||||
|
<path class="st10" d="m88.96 23.57.27-.05h10.54v.2c0 1.69-1.16 3.05-3.77 3.05H70.23"/>
|
||||||
|
<path class="st11" d="M6.61 26.42a3.515 3.515 0 0 1-1.9-2.37c-.12-.51-.12-1.05 0-1.56l1.67-7.17c.16-.68.52-1.3 1.03-1.78s1.16-.79 1.85-.91l15.86-2.89c.48-.08.93-.26 1.33-.53l11.68-7.93c.56-.38 1.23-.59 1.91-.59H66.3s1.76 3.06 2.92 10.84c.71 5.05 1.04 10.15 1 15.25H8.13c-.53-.01-1.05-.13-1.52-.36z"/>
|
||||||
|
<path class="st10" d="M96.24 19.13c-2.58-2.48-1.7-4.97-1.7-4.97h3.39"/>
|
||||||
|
<path class="st11" d="m31.88 7.75-3.31 2.33v1.44h3.31V7.75zm2.04-1.01c-.06.1-.09.22-.09.33v4.44h16.01V2.76h-9.01c-.66 0-1.31.19-1.86.56l-4.82 3.17c-.09.07-.17.15-.23.25z"/>
|
||||||
|
<path d="M51.8 11.52H66s-.29-2-.76-4.38c-.32-1.48-.72-2.94-1.2-4.38H51.81l-.01 8.76z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M8.16 19.47c.71-.92 2.71-1.07 2.71-1.07v-3.1h-4m57.51.43c.87-.11 1.67-.34 1.64-.96-.03-.62-.78-.72-1.07-.76-.49-.06-.98-.07-1.47-.05-.26.01-.54.04-.8.07-.87.11-1.67.3-1.64.96.01.17.02.47.58.66M48 15.73c.87-.11 1.66-.34 1.64-.96-.02-.62-.78-.72-1.07-.76-.49-.06-.98-.07-1.47-.05-.29.01-.56.04-.82.07-.87.11-1.67.3-1.64.96 0 .17.02.47.58.66"/>
|
||||||
|
<path class="st11" d="M28.96 26.77c0-4.35-3.52-7.87-7.87-7.87s-7.87 3.52-7.87 7.87 3.52 7.87 7.87 7.87 7.87-3.53 7.87-7.87z"/>
|
||||||
|
<path class="st10" d="M26.3 26.77c0 1.15-.38 2.26-1.08 3.17a5.229 5.229 0 0 1-6.12 1.67 5.298 5.298 0 0 1-2.54-2.18c-.58-.99-.83-2.14-.69-3.27a5.212 5.212 0 0 1 4.4-4.55c1.13-.17 2.29.03 3.29.58"/>
|
||||||
|
<path class="st11" d="M73.93 26.14a7.885 7.885 0 0 1 2.75-5.3 7.862 7.862 0 0 1 5.67-1.86c2.06.15 3.98 1.09 5.36 2.64a7.93 7.93 0 0 1 1.98 5.64 7.887 7.887 0 0 1-2.53 5.41 7.919 7.919 0 0 1-5.59 2.09 7.85 7.85 0 0 1-5.46-2.43 7.9 7.9 0 0 1-2.2-5.55c-.01-.22 0-.44.02-.64z"/>
|
||||||
|
<path class="st10" d="M76.54 26.77c0-1.14.38-2.26 1.07-3.17.69-.91 1.67-1.57 2.77-1.87 1.1-.3 2.28-.24 3.34.19s1.95 1.19 2.54 2.18c.59.98.83 2.13.7 3.27-.13 1.14-.63 2.2-1.42 3.03-.79.83-1.83 1.37-2.97 1.54-1.13.18-2.29-.02-3.29-.57"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
19
src/assets/img/icons/truck-side-glass-right-front.svg
Normal file
19
src/assets/img/icons/truck-side-glass-right-front.svg
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M5.68 23.56V11.47h29.38c-.71 5.08-1.05 10.21-1.01 15.35h-3.73"/>
|
||||||
|
<path class="st10" d="M5.68 23.56V11.47h29.38c-.71 5.08-1.05 10.21-1.01 15.35h-3.73m4.75-15.34h0"/>
|
||||||
|
<path class="st9" d="M34.05 26.83H8.11c-2.63 0-3.8-1.37-3.8-3.07v-.2h10.61l.27.05"/>
|
||||||
|
<path class="st10" d="M34.05 26.83H8.11c-2.63 0-3.8-1.37-3.8-3.07v-.2h10.61l.27.05"/>
|
||||||
|
<path class="st11" d="M96.57 26.83H34.05c-.04-5.13.3-10.26 1.01-15.35C36.23 3.65 38 .56 38 .56h26.41c.69 0 1.36.21 1.93.59L78.1 9.14c.4.27.86.46 1.34.54l15.97 2.91c.7.11 1.35.43 1.86.91.52.48.88 1.11 1.04 1.8l1.68 7.22c.12.52.12 1.05 0 1.57s-.35 1-.68 1.41c-.33.41-.75.75-1.23.98-.46.23-.98.35-1.51.35z"/>
|
||||||
|
<path class="st10" d="M6.16 14.13h3.41s.89 2.5-1.71 5"/>
|
||||||
|
<path class="st11" d="M72.66 11.48H76v-1.45l-3.34-2.35v3.8z"/>
|
||||||
|
<path d="m70.37 6.42-4.86-3.2c-.55-.37-1.21-.56-1.87-.56h-9.07v8.82h16.12V7.01c0-.12-.03-.23-.09-.34a.614.614 0 0 0-.23-.25z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="M52.59 2.66h-12.3c-.49 1.45-.89 2.92-1.21 4.41-.47 2.39-.77 4.41-.77 4.41h14.3l-.02-8.82z"/>
|
||||||
|
<path class="st10" d="M97.84 15.29h-4.03v3.12s2.01.15 2.73 1.08m-53.81-3.86c.56-.19.58-.49.58-.66.03-.67-.78-.86-1.65-.97-.26-.03-.54-.06-.81-.07-.49-.03-.99-.01-1.48.05-.29.04-1.05.14-1.08.77-.03.63.78.86 1.65.97m19.3-.09c.56-.19.58-.49.58-.66.03-.67-.77-.86-1.65-.97-.26-.03-.54-.06-.83-.07-.49-.03-.99-.01-1.48.05-.29.04-1.05.14-1.08.77-.02.63.77.86 1.65.97"/>
|
||||||
|
<path class="st11" d="M83.52 34.75c4.38 0 7.92-3.55 7.92-7.92s-3.55-7.92-7.92-7.92c-4.38 0-7.92 3.55-7.92 7.92s3.54 7.92 7.92 7.92z"/>
|
||||||
|
<path class="st10" d="M81.01 22.2c1.01-.55 2.18-.76 3.32-.59a5.248 5.248 0 0 1 4.43 4.58c.13 1.15-.11 2.3-.7 3.3-.59.99-1.48 1.76-2.55 2.2-1.07.43-2.25.5-3.36.2-1.11-.3-2.09-.96-2.8-1.88a5.27 5.27 0 0 1-1.08-3.19"/>
|
||||||
|
<path class="st11" d="M30.35 26.83c.02 2.08-.77 4.09-2.21 5.59a7.93 7.93 0 0 1-5.49 2.44c-2.08.06-4.1-.69-5.63-2.1a7.915 7.915 0 0 1-2.55-5.44c-.11-2.08.61-4.12 1.99-5.67a7.952 7.952 0 0 1 13.87 4.55c.02.2.02.41.02.63z"/>
|
||||||
|
<path class="st10" d="M24.94 31.46a5.292 5.292 0 0 1-6.31-.98c-.8-.83-1.3-1.9-1.43-3.05a5.272 5.272 0 0 1 3.27-5.48c1.07-.43 2.25-.5 3.36-.19 1.11.31 2.09.97 2.79 1.88.7.92 1.08 2.04 1.08 3.19"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
18
src/assets/img/icons/truck-side-glass-right-rear.svg
Normal file
18
src/assets/img/icons/truck-side-glass-right-rear.svg
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M5.99 23.52V11.51h29.19c-.71 5.05-1.04 10.15-1 15.25h-3.71"/>
|
||||||
|
<path class="st10" d="M5.99 23.52V11.51h29.19c-.71 5.05-1.04 10.15-1 15.25h-3.71m4.71-15.24h0"/>
|
||||||
|
<path class="st9" d="M34.17 26.77H8.4c-2.61 0-3.77-1.37-3.77-3.05v-.2h10.54l.27.05"/>
|
||||||
|
<path class="st10" d="M34.17 26.77H8.4c-2.61 0-3.77-1.37-3.77-3.05v-.2h10.54l.27.05"/>
|
||||||
|
<path class="st11" d="M96.27 26.77h-62.1c-.04-5.1.3-10.2 1-15.25C36.34 3.74 38.1.68 38.1.68h26.24c.68 0 1.35.2 1.91.59L77.94 9.2c.4.27.85.45 1.33.53l15.86 2.89c.69.11 1.34.43 1.85.91.51.48.87 1.1 1.03 1.78l1.67 7.17c.12.51.12 1.05 0 1.56a3.515 3.515 0 0 1-1.9 2.37c-.46.24-.98.36-1.51.36z"/>
|
||||||
|
<path class="st10" d="M6.47 14.16h3.39s.88 2.49-1.7 4.97"/>
|
||||||
|
<path class="st11" d="M72.53 11.52h3.31v-1.44l-3.31-2.33v3.77zm-2.29-5.03-4.82-3.17c-.55-.36-1.2-.56-1.86-.56h-9.01v8.76h16.01V7.08a.63.63 0 0 0-.09-.33.64.64 0 0 0-.23-.26z"/>
|
||||||
|
<path d="M52.59 2.76H40.37c-.48 1.44-.88 2.9-1.2 4.38-.47 2.38-.76 4.38-.76 4.38h14.2l-.02-8.76z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M97.54 15.3h-4v3.1s2 .14 2.71 1.07m-53.46-3.83c.56-.19.57-.49.58-.66.03-.66-.77-.86-1.64-.96-.26-.03-.54-.06-.8-.07-.49-.03-.98-.01-1.47.05-.29.04-1.04.14-1.07.76-.03.62.77.86 1.64.96m19.16-.08c.56-.19.58-.49.58-.66.03-.66-.77-.86-1.64-.96-.26-.03-.54-.06-.82-.07-.49-.03-.98-.01-1.47.05-.28.04-1.04.14-1.07.76-.02.62.77.86 1.64.96"/>
|
||||||
|
<path class="st11" d="M83.31 34.64c4.35 0 7.87-3.52 7.87-7.87s-3.52-7.87-7.87-7.87-7.87 3.52-7.87 7.87 3.52 7.87 7.87 7.87z"/>
|
||||||
|
<path class="st10" d="M80.82 22.17c1-.55 2.16-.75 3.29-.58a5.21 5.21 0 0 1 4.4 4.55c.13 1.14-.11 2.29-.69 3.27-.58.99-1.47 1.75-2.54 2.18-1.06.43-2.23.5-3.34.2-1.1-.3-2.08-.96-2.78-1.87-.7-.91-1.07-2.02-1.08-3.17"/>
|
||||||
|
<path class="st11" d="M30.5 26.77a7.9 7.9 0 0 1-2.2 5.55 7.936 7.936 0 0 1-5.46 2.43c-2.07.06-4.07-.69-5.59-2.09a7.867 7.867 0 0 1-2.53-5.41c-.1-2.06.6-4.09 1.98-5.64a7.854 7.854 0 0 1 5.36-2.64c2.06-.15 4.1.52 5.67 1.86a7.927 7.927 0 0 1 2.75 5.3c.01.21.02.43.02.64z"/>
|
||||||
|
<path class="st10" d="M25.12 31.37c-1.01.55-2.16.74-3.29.57a5.316 5.316 0 0 1-2.97-1.54 5.255 5.255 0 0 1-1.42-3.03c-.13-1.14.12-2.29.7-3.27.59-.98 1.48-1.75 2.54-2.18a5.236 5.236 0 0 1 6.11 1.68c.69.91 1.07 2.02 1.07 3.17"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
17
src/assets/img/icons/truck-side-window-damage-left-all.svg
Normal file
17
src/assets/img/icons/truck-side-window-damage-left-all.svg
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M74.11 26.83h-3.74c.04-5.14-.3-10.28-1.01-15.37h29.42v12.11"/>
|
||||||
|
<path class="st10" d="M74.11 26.83h-3.74c.04-5.14-.3-10.28-1.01-15.37h29.42v12.11m-29.42-12.1h0"/>
|
||||||
|
<path class="st9" d="m89.25 23.62.27-.05h10.63v.2c0 1.7-1.17 3.07-3.8 3.07H70.37"/>
|
||||||
|
<path class="st10" d="m89.25 23.62.27-.05h10.63v.2c0 1.7-1.17 3.07-3.8 3.07H70.37"/>
|
||||||
|
<path class="st11" d="M6.24 26.49c-.48-.23-.9-.57-1.23-.98-.33-.41-.56-.9-.68-1.42-.12-.52-.12-1.05 0-1.57l1.69-7.23c.16-.69.52-1.31 1.04-1.8.52-.48 1.17-.8 1.87-.91l15.99-2.92c.48-.08.94-.26 1.34-.54l11.78-8c.57-.39 1.24-.59 1.93-.59h26.45s1.77 3.09 2.95 10.93c.71 5.09 1.05 10.23 1.01 15.37H7.77c-.53.01-1.05-.11-1.53-.34z"/>
|
||||||
|
<path class="st10" d="M96.59 19.14c-2.6-2.5-1.71-5.01-1.71-5.01h3.42"/>
|
||||||
|
<path d="m31.71 7.67-3.34 2.35v1.45h3.34v-3.8zm2.06-1.01c-.06.1-.09.22-.09.34v4.48h16.14V2.64h-9.08c-.67 0-1.32.19-1.87.56l-4.86 3.2c-.1.07-.18.15-.24.26zm18.02 4.81h14.32s-.29-2.02-.77-4.41c-.32-1.49-.72-2.97-1.21-4.41H51.81l-.02 8.82z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M7.8 19.49c.72-.93 2.74-1.08 2.74-1.08v-3.13H6.5m57.97.43c.88-.11 1.68-.34 1.65-.97-.03-.63-.79-.73-1.08-.77-.49-.06-.99-.08-1.48-.05-.27.01-.54.04-.81.07-.88.11-1.68.3-1.65.97.01.17.02.47.59.66m-13.72.09c.88-.11 1.67-.34 1.65-.97-.02-.63-.79-.73-1.08-.77-.49-.06-.99-.08-1.48-.05-.29.01-.57.04-.83.07-.88.11-1.68.3-1.65.97 0 .17.02.47.59.66"/>
|
||||||
|
<path class="st11" d="M28.78 26.84a7.93 7.93 0 0 0-7.93-7.93 7.93 7.93 0 0 0-7.93 7.93 7.93 7.93 0 1 0 15.86 0z"/>
|
||||||
|
<path class="st10" d="M26.09 26.84c0 1.15-.38 2.28-1.08 3.19-.7.92-1.68 1.58-2.8 1.88-1.11.3-2.3.23-3.37-.2a5.288 5.288 0 0 1-2.56-2.2 5.26 5.26 0 0 1 .75-6.35c.8-.83 1.86-1.37 3-1.55a5.25 5.25 0 0 1 3.32.59"/>
|
||||||
|
<path class="st11" d="M74.11 26.2a7.936 7.936 0 0 1 2.77-5.34 7.998 7.998 0 0 1 5.72-1.88c2.08.15 4.02 1.1 5.4 2.66 1.38 1.56 2.1 3.6 1.99 5.68a7.943 7.943 0 0 1-8.19 7.55 7.954 7.954 0 0 1-5.5-2.44 7.977 7.977 0 0 1-2.19-6.23z"/>
|
||||||
|
<path class="st10" d="M76.74 26.84a5.288 5.288 0 0 1 3.87-5.08 5.267 5.267 0 0 1 5.93 2.38c.59.99.84 2.15.71 3.3a5.295 5.295 0 0 1-1.43 3.05c-.8.83-1.85 1.38-2.99 1.56a5.24 5.24 0 0 1-3.32-.57"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.5 KiB |
17
src/assets/img/icons/truck-side-window-damage-right-all.svg
Normal file
17
src/assets/img/icons/truck-side-window-damage-right-all.svg
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10,.st11{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M5.62 23.57V11.46h29.42c-.71 5.09-1.05 10.23-1.01 15.37h-3.74"/>
|
||||||
|
<path class="st10" d="M5.62 23.57V11.46h29.42c-.71 5.09-1.05 10.23-1.01 15.37h-3.74m4.76-15.36h0"/>
|
||||||
|
<path class="st9" d="M34.03 26.84H8.05c-2.63 0-3.8-1.38-3.8-3.07v-.2h10.63l.27.05"/>
|
||||||
|
<path class="st10" d="M34.03 26.84H8.05c-2.63 0-3.8-1.38-3.8-3.07v-.2h10.63l.27.05"/>
|
||||||
|
<path class="st11" d="M96.63 26.84h-62.6c-.04-5.14.3-10.28 1.01-15.37C36.21 3.63 37.99.54 37.99.54h26.45c.69 0 1.36.21 1.93.59l11.78 8c.4.28.86.46 1.34.54l15.99 2.92c.7.11 1.35.43 1.87.91.52.48.88 1.11 1.04 1.8l1.69 7.23c.12.52.12 1.05 0 1.57s-.35 1-.68 1.42c-.33.41-.75.75-1.23.98-.49.22-1.01.34-1.54.34z"/>
|
||||||
|
<path class="st10" d="M6.1 14.13h3.42s.89 2.51-1.71 5.01"/>
|
||||||
|
<path d="M72.69 11.47h3.34v-1.45l-3.34-2.35v3.8zm-2.3-5.07-4.86-3.2c-.56-.37-1.21-.56-1.87-.56h-9.08v8.83h16.14V6.99c0-.12-.03-.23-.09-.34a.816.816 0 0 0-.24-.25zM52.6 2.64H40.27c-.49 1.45-.89 2.92-1.21 4.41-.47 2.4-.77 4.41-.77 4.41h14.32l-.01-8.82z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M97.9 15.28h-4.04v3.13s2.02.15 2.74 1.08m-53.88-3.87c.56-.19.58-.49.59-.66.03-.67-.78-.86-1.65-.97-.26-.03-.54-.06-.81-.07-.5-.03-.99-.01-1.48.05-.29.04-1.05.14-1.08.77-.03.63.78.86 1.65.97m19.31-.09c.56-.19.58-.49.59-.66.03-.67-.77-.86-1.65-.97-.26-.03-.54-.06-.83-.07-.5-.03-.99-.01-1.48.05-.29.04-1.05.14-1.08.77-.02.63.77.86 1.65.97"/>
|
||||||
|
<path class="st11" d="M83.56 34.77c4.38 0 7.93-3.55 7.93-7.93s-3.55-7.93-7.93-7.93-7.93 3.55-7.93 7.93 3.55 7.93 7.93 7.93z"/>
|
||||||
|
<path class="st10" d="M81.05 22.21c1.01-.55 2.18-.76 3.32-.59a5.29 5.29 0 0 1 4.45 4.6c.14 1.15-.11 2.31-.7 3.3-.59.99-1.49 1.77-2.56 2.2-1.07.43-2.25.5-3.37.2a5.24 5.24 0 0 1-2.8-1.88 5.27 5.27 0 0 1-1.08-3.19"/>
|
||||||
|
<path class="st11" d="M30.33 26.84c.02 2.08-.77 4.09-2.22 5.6a7.954 7.954 0 0 1-5.5 2.44c-2.08.06-4.11-.69-5.64-2.1s-2.45-3.37-2.55-5.45c-.11-2.08.61-4.12 1.99-5.68a7.926 7.926 0 0 1 5.4-2.66c2.08-.15 4.13.53 5.72 1.88a7.958 7.958 0 0 1 2.8 5.97z"/>
|
||||||
|
<path class="st10" d="M24.91 31.48a5.24 5.24 0 0 1-3.32.57 5.246 5.246 0 0 1-2.99-1.56c-.8-.83-1.3-1.9-1.43-3.05a5.268 5.268 0 0 1 9.43-3.79c.7.92 1.08 2.04 1.08 3.19"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.4 KiB |
15
src/assets/img/icons/truck-windshield.svg
Normal file
15
src/assets/img/icons/truck-windshield.svg
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M38.39 29.09V31c0 .98-.39 1.93-1.09 2.62-.7.7-1.64 1.09-2.62 1.09-.98 0-1.93-.39-2.62-1.09-.7-.7-1.09-1.64-1.09-2.62v-1.91"/>
|
||||||
|
<path class="st10" d="M38.39 29.09V31c0 .98-.39 1.93-1.09 2.62-.7.7-1.64 1.09-2.62 1.09-.98 0-1.93-.39-2.62-1.09-.7-.7-1.09-1.64-1.09-2.62v-1.91"/>
|
||||||
|
<path class="st9" d="M73.46 29.43V31c0 .98-.39 1.93-1.09 2.62-.7.7-1.64 1.09-2.62 1.09s-1.93-.39-2.62-1.09c-.7-.7-1.09-1.64-1.09-2.62v-1.57"/>
|
||||||
|
<path class="st10" d="M73.46 29.43V31c0 .98-.39 1.93-1.09 2.62-.7.7-1.64 1.09-2.62 1.09s-1.93-.39-2.62-1.09c-.7-.7-1.09-1.64-1.09-2.62v-1.57"/>
|
||||||
|
<path class="st9" d="M34.48 10.17h-1.01V8.4c0-.08-.03-.16-.09-.21a.288.288 0 0 0-.21-.09H30.3c-.08 0-.16.03-.21.09-.06.06-.09.13-.09.21v2.5c0 .08.03.16.09.21.06.06.13.09.21.09h3.54l-1.66.96a2.7 2.7 0 0 0-1.35 2.17c-.13 1.96-.35 5.2-.35 8.1-.03 4.22-.25 7.94 1.02 7.94 0 0 10 .67 22.46.67s19.03-.67 19.03-.67c1.28 0 1.06-3.71 1.02-7.94-.02-2.9-.24-6.14-.37-8.1-.03-.45-.17-.88-.41-1.26a2.7 2.7 0 0 0-.95-.92l-1.42-.96h3.26c.08 0 .16-.03.21-.09.06-.06.09-.13.09-.21v-2.5c0-.08-.03-.16-.09-.21a.288.288 0 0 0-.21-.09h-2.88c-.08 0-.16.03-.21.09-.06.06-.09.13-.09.21v1.77h-1.01"/>
|
||||||
|
<path class="st10" d="M34.48 10.17h-1.01V8.4c0-.08-.03-.16-.09-.21a.288.288 0 0 0-.21-.09H30.3c-.08 0-.16.03-.21.09-.06.06-.09.13-.09.21v2.5c0 .08.03.16.09.21.06.06.13.09.21.09h3.54l-1.66.96a2.7 2.7 0 0 0-1.35 2.17c-.13 1.96-.35 5.2-.35 8.1-.03 4.22-.25 7.94 1.02 7.94 0 0 10 .67 22.46.67s19.03-.67 19.03-.67c1.28 0 1.06-3.71 1.02-7.94-.02-2.9-.24-6.14-.37-8.1-.03-.45-.17-.88-.41-1.26a2.7 2.7 0 0 0-.95-.92l-1.42-.96h3.26c.08 0 .16-.03.21-.09.06-.06.09-.13.09-.21v-2.5c0-.08-.03-.16-.09-.21a.288.288 0 0 0-.21-.09h-2.88c-.08 0-.16.03-.21.09-.06.06-.09.13-.09.21v1.77h-1.01"/>
|
||||||
|
<path class="st9" d="m69.91 10.17-2.98-8.03C66.34 1.08 65.21.72 63.98.72H40.4c-1.23 0-2.36.33-2.95 1.42l-2.97 8.03"/>
|
||||||
|
<path class="st10" d="m69.91 10.17-2.98-8.03C66.34 1.08 65.21.72 63.98.72H40.4c-1.23 0-2.36.33-2.95 1.42l-2.97 8.03m2.39 20.2v-2.69s5.32.35 16.2.35 14.5-.35 14.5-.35v3.03"/>
|
||||||
|
<path d="M40.36 2.61c-.21 0-.41.06-.59.16s-.33.25-.43.43l-3.06 7.9s5.15-.52 15.92-.52 15.98.51 15.98.51L65.12 3.2c-.1-.18-.25-.33-.44-.44-.18-.1-.39-.16-.6-.16H40.36z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M73.82 18.85c-.84-3.31-5.32-2.27-5.32-2.27 0 3.06.71 5.07 1.37 6.27m-39.24-4c.84-3.31 5.32-2.27 5.32-2.27 0 3.06-.71 5.07-1.37 6.27m31.05-6.42H38.81a.47.47 0 0 0-.47.47v7.18c0 .26.21.47.47.47h26.82c.26 0 .47-.21.47-.47V16.9a.47.47 0 0 0-.47-.47zm-25.66 2.14h24.51m-24.51 1.86h24.51m-24.51 1.85h24.51"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.8 KiB |
10
src/assets/img/icons/van-rear-glass.svg
Normal file
10
src/assets/img/icons/van-rear-glass.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M15.78.8h26.14l3.98 1.14h28.77L83.16.8c7.99 0 10.56 6.47 10.56 14.46v4.9c0 7.99-2.57 14.46-10.56 14.46l-8.49-1.14H45.91l-3.98 1.14H15.78c-.8 0-1.59-.26-2.23-.74a3.709 3.709 0 0 1-1.33-1.94c-.7-2.55-1.55-6.94-1.55-13.25 0-6.3.85-12.66 1.55-15.21A3.688 3.688 0 0 1 15.78.8z"/>
|
||||||
|
<path class="st9" d="m76.55 3.93-5.92 2.63c-.79.35-1.32 1.68-1.18 2.89.62 5.5.62 11.04 0 16.54-.15 1.21.39 2.54 1.18 2.89l5.92 2.63c1.02.45 2.04-.09 2.41-1.34 2.25-7.47 2.25-17.44 0-24.89-.38-1.27-1.41-1.81-2.41-1.35z"/>
|
||||||
|
<path d="m15.8 5.99 2.28 2.06c.1.12.17.26.21.41.04.15.05.31.03.47-.09 1.4-.31 4.96-.31 8.78s.22 7.44.32 8.81c.04.31-.04.62-.22.86l-2.28 2.36c-.22.24-.5.02-.59-.45-.25-1.4-.66-4.72-.66-11.58 0-6.87.39-9.98.65-11.27.09-.44.35-.64.57-.45z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="M19.98 3.77H35.5c.06 0 .12.02.18.05.05.03.1.08.12.13.03.06.04.12.04.18s-.03.12-.06.17l-1.49 2.09a.754.754 0 0 1-.61.31H24.5c-.4 0-.79-.08-1.15-.24l-3.71-2.47c.03-.07.08-.12.14-.16.05-.04.13-.06.2-.06zm48.79.72a.394.394 0 0 0-.19-.72H54.21c-.12 0-.24.03-.34.08-.11.05-.2.13-.27.23-.39.53-1.18 1.62-1.57 2.21-.03.04-.04.09-.05.13 0 .05.01.1.03.14.02.04.06.08.1.1.04.02.09.04.14.04h11.92c.16 0 .32-.04.46-.12l4.14-2.09zM49.69 6.7c.12 0 .24-.03.34-.08.11-.05.2-.13.27-.23.39-.53 1.18-1.62 1.57-2.21.02-.04.03-.08.03-.13s-.01-.09-.03-.13a.284.284 0 0 0-.09-.1.284.284 0 0 0-.13-.04H38.21c-.12 0-.24.03-.34.08-.11.07-.2.14-.28.24-.39.53-1.18 1.62-1.57 2.21-.03.04-.04.09-.05.13 0 .05.01.1.03.14.02.04.06.08.1.1.04.02.09.04.14.04H49.7l-.01-.02zM19.98 31.66h16.31c.06 0 .12-.02.18-.05a.3.3 0 0 0 .12-.13c.03-.06.04-.12.04-.18s-.03-.12-.06-.17l-1.49-2.09a.711.711 0 0 0-.26-.23.808.808 0 0 0-.34-.08h-9.97c-.4 0-.79.08-1.15.24l-3.7 2.46c.02.07.07.13.13.17.04.03.11.06.19.06zm48.79-.73a.394.394 0 0 1-.2.72H54.21c-.12 0-.24-.03-.34-.09a.667.667 0 0 1-.27-.23 70.49 70.49 0 0 1-1.57-2.21.277.277 0 0 1-.03-.13c0-.04.01-.09.03-.13.02-.04.05-.07.09-.1.04-.02.08-.04.13-.04h11.92c.16 0 .32.04.46.12l4.14 2.09zm-19.08-2.21c.12 0 .24.03.34.08.11.05.2.13.27.23.39.53 1.18 1.62 1.57 2.21.02.04.03.08.03.13s-.01.09-.03.13c-.02.04-.05.07-.09.1-.04.02-.08.04-.13.04H39c-.12 0-.24-.03-.34-.09a.667.667 0 0 1-.27-.23 70.49 70.49 0 0 1-1.57-2.21.277.277 0 0 1-.03-.13c0-.05.01-.09.03-.13.02-.04.05-.07.09-.1.04-.02.08-.04.13-.04h12.65v.01z"/>
|
||||||
|
<path d="m13.18 30.27.66.05c.13.01.26.06.37.14.11.08.19.19.23.31l1.18 3.59M90.83 8.62c-1.99-1.2-3.64-2.87-4.82-4.86-.24-.44.67-2.25.67-2.25.01-.03.02-.06.04-.09M15.6.8l-1.18 3.59c-.05.12-.13.23-.23.31a.7.7 0 0 1-.37.14l-.66.05m77.67 21.7c-1.99 1.2-3.64 2.87-4.82 4.86-.24.44.67 2.25.67 2.25.01.03.02.06.04.09M24.8 11.81h38.63m-38.63 5.9h38.63M24.8 23.62h38.63" fill="none" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3 KiB |
12
src/assets/img/icons/van-side-glass-left-front.svg
Normal file
12
src/assets/img/icons/van-side-glass-left-front.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="m93.05 28.85 3.66-.37.07-6.59c-1.03-1.24-1.03-1.24-1.07-1.35 0 0 .22-5.68-1.22-10.86-.76-2.74-3.07-8.59-7.17-8.79C75.57.31 59.59.53 43.98.53c-2.63 0-5.2.83-7.32 2.38l-8.29 6.04s-6.17 1.48-9.29 2.15C11.8 12.66 7.62 16.34 7.62 23.13c0 0 2.36 1.26.16 2.93v3.17l6.42-.04 14.65.02H78.3l14.75-.36z"/>
|
||||||
|
<path class="st9" d="M92.9 27.64c0-4.03-3.27-7.3-7.3-7.3-4.03 0-7.3 3.27-7.3 7.3s3.27 7.3 7.3 7.3c4.03 0 7.3-3.27 7.3-7.3zm-64.11 0c0-4.03-3.27-7.3-7.3-7.3-4.03 0-7.3 3.27-7.3 7.3s3.27 7.3 7.3 7.3c4.03 0 7.3-3.27 7.3-7.3z"/>
|
||||||
|
<path class="st10" d="M80.75 27.64c0-1.06.35-2.09.99-2.94.64-.84 1.55-1.45 2.57-1.74a4.85 4.85 0 0 1 3.1.18c.99.4 1.81 1.11 2.36 2.02A4.85 4.85 0 0 1 89.1 31c-.74.77-1.7 1.27-2.75 1.43-1.05.16-2.12-.02-3.06-.53m-56.96-4.26c0 1.06-.35 2.1-.99 2.94-.64.84-1.55 1.45-2.57 1.74a4.85 4.85 0 0 1-3.1-.18c-.99-.4-1.81-1.11-2.35-2.02-.54-.91-.77-1.98-.65-3.04s.59-2.04 1.33-2.81c.74-.76 1.71-1.27 2.76-1.43 1.05-.16 2.12.03 3.06.54m54.09 4.19H32.74M50 16.3c-.8-.03-1.55-.16-1.58-.73-.04-.57.64-.73.9-.79.44-.1.89-.16 1.34-.18h.75c.8.02 1.55.12 1.59.73.01.15.02.43-.47.65m17.07.32c-.8-.03-1.55-.16-1.58-.73-.03-.57.64-.73.9-.79.44-.1.89-.16 1.34-.18h.75c.8.02 1.55.12 1.59.73.01.15.03.43-.47.65"/>
|
||||||
|
<path class="st9" d="M55.08 11.85h18.36l-.73-8.97H54.35l.73 8.97zm20.1 0h16.96l-1.35-4.08c-1.26-2.78-2.54-4.6-5.6-4.67l-10.75-.23.74 8.98z"/>
|
||||||
|
<path d="M36.06 6.25c4.02-3.3 7.59-3.3 10.46-3.3l6.11-.08.73 8.97H36.07l-.01-5.59z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="M34.36 7.51c-1.23.92-3.57 2.96-4.39 3.59-.07.05-.12.13-.15.21a.46.46 0 0 0 0 .26c.03.08.08.16.15.21.07.05.16.08.24.08h4.21l-.06-4.35z"/>
|
||||||
|
<path class="st10" d="M11.05 18.59s4.42-.63 4.49-.73c1.46-2.27 1.1-2.64 1.1-2.64-1.87-.52-3.84-.64-5.76-.37m82.51 4.83-1.22-.91v-3.74c0-.12.04-.23.12-.32a.47.47 0 0 1 .31-.16l2.56-.31m-.79 12.8 2.04-.21m-88.34.73h3.88"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.2 KiB |
12
src/assets/img/icons/van-side-glass-left-rear.svg
Normal file
12
src/assets/img/icons/van-side-glass-left-rear.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="m93.01 28.84 3.66-.37.07-6.58c-1.03-1.24-1.03-1.24-1.06-1.35 0 0 .22-5.68-1.22-10.85C93.7 6.95 91.4 1.11 87.3.91 75.56.32 59.6.54 44.01.54c-2.63 0-5.19.83-7.32 2.38L28.4 8.96s-6.16 1.48-9.28 2.15c-7.28 1.55-11.45 5.23-11.45 12.01 0 0 2.36 1.26.16 2.93v3.17l6.42-.04 14.63.02h49.39l14.74-.36z"/>
|
||||||
|
<path class="st9" d="M92.85 27.63c0-4.03-3.26-7.29-7.29-7.29s-7.29 3.26-7.29 7.29 3.26 7.29 7.29 7.29 7.29-3.27 7.29-7.29zm-64.04 0c0-4.03-3.26-7.29-7.29-7.29s-7.29 3.26-7.29 7.29 3.26 7.29 7.29 7.29 7.29-3.27 7.29-7.29z"/>
|
||||||
|
<path class="st10" d="M80.72 27.63c0-1.06.35-2.09.99-2.94.64-.84 1.54-1.45 2.57-1.73 1.02-.28 2.11-.22 3.09.18s1.81 1.1 2.35 2.02c.54.91.77 1.98.65 3.03a4.795 4.795 0 0 1-1.32 2.8 4.837 4.837 0 0 1-5.8.9m-56.89-4.26c0 1.06-.35 2.09-.99 2.94a4.854 4.854 0 0 1-5.67 1.55c-.98-.4-1.81-1.11-2.35-2.02-.54-.91-.77-1.98-.64-3.03.12-1.05.59-2.04 1.33-2.8.74-.76 1.7-1.26 2.75-1.42 1.05-.16 2.12.03 3.05.54m54.05 4.17H32.76M50 16.3c-.8-.03-1.54-.16-1.58-.73-.04-.57.64-.73.9-.79.44-.1.89-.16 1.34-.18h.75c.8.02 1.55.12 1.58.73.01.15.02.43-.47.65m17.06.32c-.8-.03-1.55-.16-1.58-.73-.03-.57.64-.73.9-.79.44-.1.89-.16 1.34-.18h.75c.8.02 1.55.12 1.58.73.01.15.03.43-.47.65"/>
|
||||||
|
<path class="st9" d="M55.08 11.85h18.34l-.73-8.96H54.35l.73 8.96z"/>
|
||||||
|
<path d="M75.15 11.86h16.94l-1.35-4.08C89.48 5 88.21 3.19 85.16 3.12l-10.74-.23.73 8.97z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="M36.08 6.26c4.01-3.29 7.58-3.29 10.44-3.29l6.11-.08.73 8.96H36.09l-.01-5.59zm-1.7 1.26c-1.23.92-3.56 2.95-4.39 3.58-.07.05-.12.13-.15.21a.46.46 0 0 0 0 .26c.03.08.08.16.15.21.07.05.16.08.24.08h4.21l-.06-4.34z"/>
|
||||||
|
<path class="st10" d="M11.09 18.59s4.42-.63 4.49-.73c1.46-2.27 1.1-2.63 1.1-2.63-1.87-.52-3.83-.64-5.75-.37m82.42 4.81-1.21-.91v-3.74c0-.12.04-.23.12-.32a.47.47 0 0 1 .31-.16l2.56-.31m-.81 12.8 2.04-.21m-88.24.73H12"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
11
src/assets/img/icons/van-side-glass-left-slider.svg
Normal file
11
src/assets/img/icons/van-side-glass-left-slider.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="m93.1 28.87 3.67-.37.07-6.6c-1.03-1.24-1.03-1.24-1.07-1.35 0 0 .22-5.69-1.22-10.87-.76-2.74-3.07-8.6-7.18-8.8C75.6.29 59.6.51 43.97.51c-2.64 0-5.2.83-7.33 2.38l-8.3 6.05s-6.18 1.48-9.3 2.15c-7.29 1.56-11.47 5.24-11.47 12.04 0 0 2.36 1.27.16 2.93v3.18l6.43-.04 14.67.02h49.5l14.77-.35z"/>
|
||||||
|
<path class="st9" d="M92.95 27.65c0-4.04-3.27-7.31-7.31-7.31-4.04 0-7.31 3.27-7.31 7.31s3.27 7.31 7.31 7.31c4.04 0 7.31-3.27 7.31-7.31zm-64.19 0c0-4.04-3.27-7.31-7.31-7.31-4.04 0-7.31 3.27-7.31 7.31s3.27 7.31 7.31 7.31c4.03 0 7.31-3.27 7.31-7.31z"/>
|
||||||
|
<path class="st10" d="M80.79 27.65c0-1.06.35-2.1.99-2.94.64-.85 1.55-1.46 2.57-1.74 1.03-.28 2.11-.22 3.1.18.99.4 1.81 1.11 2.36 2.02.54.91.77 1.98.65 3.04s-.59 2.04-1.32 2.81-1.7 1.27-2.75 1.43a4.85 4.85 0 0 1-3.06-.53M26.3 27.65c0 1.06-.35 2.1-1 2.94a4.84 4.84 0 0 1-2.58 1.74c-1.03.28-2.12.22-3.1-.18a4.87 4.87 0 0 1-3.01-5.07c.12-1.06.59-2.04 1.33-2.81.74-.77 1.71-1.27 2.76-1.43 1.05-.16 2.13.03 3.06.54m54.19 4.21H32.72M49.99 16.3c-.8-.03-1.55-.17-1.58-.73-.04-.57.65-.73.9-.8.44-.1.89-.16 1.34-.18h.76c.8.02 1.55.12 1.59.73.01.15.02.43-.47.65m17.09.33c-.8-.03-1.55-.17-1.58-.73-.03-.57.65-.73.9-.8.44-.1.89-.16 1.34-.18h.76c.8.02 1.55.12 1.59.73.01.15.03.43-.47.65"/>
|
||||||
|
<path d="M55.08 11.84h18.39l-.73-8.98H54.35l.73 8.98z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="M75.2 11.84h16.99l-1.35-4.08c-1.27-2.79-2.54-4.6-5.6-4.68l-10.77-.23.73 8.99zM36.04 6.23c4.02-3.3 7.6-3.3 10.47-3.3l6.12-.08.73 8.98H36.05l-.01-5.6zm-1.71 1.26c-1.23.92-3.57 2.96-4.4 3.59-.07.05-.12.13-.15.21a.46.46 0 0 0 0 .26c.03.08.08.16.15.21.07.05.16.08.24.08h4.22l-.06-4.35z"/>
|
||||||
|
<path class="st10" d="M10.99 18.59s4.43-.63 4.5-.73c1.47-2.27 1.1-2.64 1.1-2.64-1.88-.52-3.84-.64-5.77-.37m82.62 4.83-1.22-.91v-3.74c0-.12.04-.23.12-.32a.47.47 0 0 1 .31-.16l2.57-.31m-.8 12.81 2.05-.21m-88.46.73h3.89"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
12
src/assets/img/icons/van-side-glass-right-front.svg
Normal file
12
src/assets/img/icons/van-side-glass-right-front.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M26.1 29.21h49.44l14.65-.02 6.42.04v-3.17c-2.2-1.67.16-2.93.16-2.93 0-6.79-4.18-10.47-11.46-12.02-3.12-.67-9.29-2.15-9.29-2.15l-8.29-6.04A12.431 12.431 0 0 0 60.41.54c-15.6 0-31.58-.22-43.34.37-4.1.2-6.41 6.05-7.17 8.79-1.44 5.17-1.22 10.86-1.22 10.86-.04.11-.04.11-1.07 1.35l.07 6.59 3.66.37 14.76.34z"/>
|
||||||
|
<path class="st9" d="M18.81 34.94c4.03 0 7.3-3.27 7.3-7.3s-3.27-7.3-7.3-7.3c-4.03 0-7.3 3.27-7.3 7.3s3.26 7.3 7.3 7.3zm64.11 0c4.03 0 7.3-3.27 7.3-7.3s-3.27-7.3-7.3-7.3c-4.03 0-7.3 3.27-7.3 7.3s3.27 7.3 7.3 7.3z"/>
|
||||||
|
<path class="st10" d="M21.12 31.9a4.85 4.85 0 0 1-5.81-.9c-.74-.77-1.2-1.75-1.32-2.81-.12-1.05.11-2.12.65-3.03.54-.91 1.37-1.62 2.36-2.02.99-.4 2.07-.46 3.1-.18 1.02.28 1.93.89 2.57 1.74.64.84.99 1.88.99 2.94m56.93-4.26c.93-.51 2.01-.7 3.06-.54a4.867 4.867 0 0 1 4.09 4.24c.12 1.06-.1 2.12-.65 3.04-.54.91-1.37 1.62-2.35 2.02-.99.4-2.07.46-3.1.18a4.816 4.816 0 0 1-2.57-1.74c-.64-.84-.99-1.88-.99-2.94m-6.42-.07H26.49m25.39-11.59c-.49-.22-.48-.5-.47-.65.04-.61.78-.71 1.59-.73h.75c.45.02.9.08 1.34.18.26.06.94.23.9.79-.04.57-.78.71-1.58.73m-22.13-.32c-.49-.22-.48-.5-.47-.65.04-.61.78-.71 1.59-.73h.75c.45.02.9.08 1.34.18.26.06.93.23.9.79-.03.57-.78.71-1.58.73"/>
|
||||||
|
<path class="st9" d="M50.06 2.87H31.69l-.73 8.97h18.36l.74-8.97zm-20.1 0-10.75.23c-3.05.07-4.33 1.89-5.6 4.67l-1.35 4.08h16.96l.74-8.98z"/>
|
||||||
|
<path d="M68.33 11.85H51.04l.73-8.97 6.11.08c2.86 0 6.44 0 10.46 3.3l-.01 5.59z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="M69.97 11.85h4.21a.408.408 0 0 0 .39-.29c.03-.08.03-.17 0-.26a.453.453 0 0 0-.15-.21c-.83-.63-3.16-2.66-4.39-3.59l-.06 4.35z"/>
|
||||||
|
<path class="st10" d="M93.53 14.85c-1.93-.27-3.89-.15-5.76.37 0 0-.37.37 1.1 2.64.07.1 4.49.73 4.49.73M9.24 14.23l2.56.31c.12.01.23.07.31.16.08.09.12.2.12.32v3.74l-1.22.91m-3.02 7.16 2.04.21m82.42.52h3.88"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
12
src/assets/img/icons/van-side-glass-right-rear.svg
Normal file
12
src/assets/img/icons/van-side-glass-right-rear.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M26.13 29.2h49.39l14.63-.02 6.42.04v-3.17c-2.2-1.66.16-2.93.16-2.93 0-6.78-4.17-10.46-11.45-12.01C82.16 10.44 76 8.96 76 8.96l-8.28-6.04A12.431 12.431 0 0 0 60.4.54C44.81.54 28.85.32 17.11.91c-4.1.2-6.4 6.04-7.16 8.78-1.44 5.17-1.22 10.85-1.22 10.85-.04.11-.04.11-1.06 1.35l.07 6.58 3.66.37 14.73.36z"/>
|
||||||
|
<path class="st9" d="M18.84 34.92c4.03 0 7.29-3.26 7.29-7.29s-3.26-7.29-7.29-7.29-7.29 3.26-7.29 7.29 3.27 7.29 7.29 7.29zm64.04 0c4.03 0 7.29-3.26 7.29-7.29s-3.26-7.29-7.29-7.29-7.29 3.26-7.29 7.29 3.27 7.29 7.29 7.29z"/>
|
||||||
|
<path class="st10" d="M21.15 31.88c-.93.51-2.01.69-3.05.53a4.869 4.869 0 0 1-2.75-1.43c-.73-.76-1.2-1.75-1.32-2.8-.12-1.05.11-2.12.65-3.03.54-.91 1.37-1.62 2.35-2.02.98-.4 2.07-.46 3.09-.18s1.92.89 2.57 1.73c.64.84.99 1.87.99 2.94m56.88-4.24c.93-.51 2-.7 3.05-.54 1.05.16 2.02.66 2.75 1.42.74.76 1.2 1.75 1.33 2.8.12 1.05-.1 2.12-.64 3.03a4.842 4.842 0 0 1-5.45 2.2 4.817 4.817 0 0 1-2.57-1.73c-.64-.84-.99-1.88-.99-2.94m-6.4-.06H26.52m25.36-11.58c-.49-.22-.48-.5-.47-.65.04-.61.78-.71 1.58-.73h.75c.45.02.9.08 1.34.18.26.06.94.23.9.79-.04.57-.78.71-1.58.73m-22.1-.32c-.49-.22-.48-.5-.47-.65.04-.61.78-.71 1.58-.73h.75c.45.02.9.08 1.34.18.26.06.93.23.9.79-.03.57-.78.71-1.58.73"/>
|
||||||
|
<path class="st9" d="M50.06 2.89H31.72l-.73 8.96h18.34l.73-8.96z"/>
|
||||||
|
<path d="m29.99 2.89-10.74.23c-3.05.07-4.33 1.88-5.59 4.66l-1.35 4.08h16.94l.74-8.97z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="M68.31 11.85H51.05l.73-8.96 6.11.08c2.86 0 6.43 0 10.44 3.29l-.02 5.59zm1.64 0h4.21a.408.408 0 0 0 .39-.29c.03-.08.03-.17 0-.26a.453.453 0 0 0-.15-.21c-.83-.63-3.16-2.66-4.39-3.58l-.06 4.34z"/>
|
||||||
|
<path class="st10" d="M93.48 14.86c-1.92-.27-3.88-.15-5.75.37 0 0-.37.37 1.1 2.63.07.1 4.49.73 4.49.73M9.28 14.23l2.56.31c.12.01.23.07.31.16.08.09.12.2.12.32v3.74l-1.21.91m-3.02 7.15 2.04.21m82.33.52h3.88"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
11
src/assets/img/icons/van-side-glass-right-slider.svg
Normal file
11
src/assets/img/icons/van-side-glass-right-slider.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M26.07 29.22h49.5l14.67-.02 6.43.04v-3.18c-2.2-1.67.16-2.93.16-2.93 0-6.79-4.18-10.48-11.47-12.04-3.12-.67-9.3-2.15-9.3-2.15l-8.3-6.05C65.63 1.34 63.06.51 60.43.51 44.81.51 28.81.29 17.04.88c-4.11.2-6.41 6.06-7.18 8.8-1.44 5.18-1.22 10.87-1.22 10.87-.04.11-.04.11-1.07 1.35l.07 6.6 3.67.37 14.76.35z"/>
|
||||||
|
<path class="st9" d="M18.76 34.96c4.04 0 7.31-3.27 7.31-7.31s-3.27-7.31-7.31-7.31c-4.04 0-7.31 3.27-7.31 7.31s3.28 7.31 7.31 7.31zm64.2 0c4.04 0 7.31-3.27 7.31-7.31s-3.27-7.31-7.31-7.31c-4.04 0-7.31 3.27-7.31 7.31s3.27 7.31 7.31 7.31z"/>
|
||||||
|
<path class="st10" d="M21.08 31.92a4.85 4.85 0 0 1-5.81-.9c-.74-.77-1.2-1.75-1.32-2.81-.12-1.06.11-2.12.65-3.04.54-.91 1.37-1.62 2.36-2.02s2.08-.46 3.1-.18c1.03.28 1.93.89 2.57 1.74.64.85.99 1.88.99 2.94m57.01-4.26c.93-.51 2.01-.7 3.06-.54 1.05.16 2.02.66 2.76 1.43.74.77 1.21 1.75 1.33 2.81.12 1.06-.1 2.12-.65 3.04a4.85 4.85 0 0 1-5.46 2.21 4.84 4.84 0 0 1-2.58-1.74c-.65-.85-.99-1.88-1-2.94m-6.4-.07H26.46m25.42-11.62c-.49-.22-.48-.5-.47-.65.04-.61.78-.71 1.59-.73h.76c.45.02.9.08 1.34.18.26.06.94.23.9.8-.04.57-.78.71-1.58.73m-22.17-.33c-.49-.22-.48-.5-.47-.65.04-.61.78-.71 1.59-.73h.76c.45.02.9.08 1.34.18.26.06.94.23.9.8-.03.57-.78.71-1.58.73"/>
|
||||||
|
<path d="M50.05 2.85H31.67l-.73 8.98h18.39l.72-8.98z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st9" d="m29.93 2.85-10.76.23c-3.06.07-4.34 1.89-5.6 4.68l-1.35 4.08H29.2l.73-8.99zm38.42 8.99H51.04l.73-8.98 6.12.08c2.87 0 6.45 0 10.47 3.3l-.01 5.6zm1.65 0h4.22c.09 0 .17-.03.24-.08a.36.36 0 0 0 .15-.21c.03-.08.03-.17 0-.26a.453.453 0 0 0-.15-.21c-.83-.63-3.17-2.67-4.4-3.59L70 11.84z"/>
|
||||||
|
<path class="st10" d="M93.58 14.85c-1.93-.27-3.89-.15-5.77.37 0 0-.37.37 1.1 2.64.07.1 4.5.73 4.5.73M9.18 14.23l2.57.31c.12.01.23.07.31.16.08.09.12.2.12.32v3.74l-1.22.91m-3.03 7.17 2.05.21m82.52.52h3.89"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
10
src/assets/img/icons/van-side-window-damage-left-all.svg
Normal file
10
src/assets/img/icons/van-side-window-damage-left-all.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="m92.96 28.83 3.65-.37.07-6.58c-1.03-1.24-1.03-1.24-1.06-1.35 0 0 .22-5.67-1.22-10.83-.76-2.73-3.06-8.57-7.15-8.77C75.51.35 59.57.57 44 .57c-2.63 0-5.18.83-7.31 2.38l-8.27 6.03s-6.15 1.48-9.27 2.14c-7.27 1.55-11.43 5.23-11.43 12 0 0 2.35 1.26.16 2.92v3.16l6.41-.04 14.62.02h49.33l14.72-.35z"/>
|
||||||
|
<path class="st9" d="M92.8 27.61a7.28 7.28 0 1 0-7.28 7.28c4.02.01 7.28-3.25 7.28-7.28zm-63.96 0a7.28 7.28 0 1 0-7.28 7.28c4.02.01 7.28-3.25 7.28-7.28z"/>
|
||||||
|
<path class="st10" d="M80.68 27.61a4.838 4.838 0 0 1 3.55-4.66c1.02-.28 2.11-.22 3.09.18s1.81 1.1 2.35 2.01c.54.91.77 1.97.65 3.03a4.795 4.795 0 0 1-1.32 2.8 4.837 4.837 0 0 1-5.8.9m-56.81-4.26c0 1.06-.35 2.09-.99 2.93-.64.84-1.54 1.45-2.57 1.73-1.02.28-2.11.22-3.09-.18s-1.81-1.11-2.35-2.02c-.54-.91-.77-1.98-.64-3.03.12-1.05.59-2.04 1.32-2.8.74-.76 1.7-1.26 2.75-1.42 1.05-.16 2.12.03 3.05.54m53.99 4.19H32.79M50 16.31c-.8-.03-1.54-.16-1.58-.73-.04-.57.64-.73.9-.79.44-.1.88-.16 1.33-.18h.75c.8.02 1.55.12 1.58.73.01.15.02.43-.47.65m17.05.32c-.8-.03-1.55-.16-1.58-.73-.03-.57.64-.73.9-.79.44-.1.88-.16 1.33-.18h.75c.8.02 1.55.12 1.58.73.01.15.03.43-.47.65"/>
|
||||||
|
<path d="M55.07 11.86h18.32l-.73-8.95H54.34l.73 8.95zm20.05 0h16.92L90.7 7.79c-1.26-2.78-2.54-4.59-5.58-4.66l-10.73-.22.73 8.95zM36.1 6.27c4.01-3.29 7.57-3.29 10.43-3.29l6.1-.08.73 8.95H36.11l-.01-5.58zm-1.7 1.26c-1.23.92-3.56 2.95-4.38 3.58-.07.05-.12.13-.15.21a.46.46 0 0 0 0 .26c.03.08.08.15.15.21.07.05.16.08.24.08h4.2l-.06-4.34z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M11.14 18.59s4.41-.63 4.48-.73c1.46-2.27 1.1-2.63 1.1-2.63-1.87-.51-3.83-.64-5.75-.37m82.33 4.81-1.21-.91v-3.73c0-.12.04-.23.12-.32a.47.47 0 0 1 .31-.16l2.56-.31m-.81 12.78 2.04-.21m-88.14.73h3.87"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2 KiB |
10
src/assets/img/icons/van-side-window-damage-right-all.svg
Normal file
10
src/assets/img/icons/van-side-window-damage-right-all.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M26.16 29.18h49.33l14.62-.02 6.41.04v-3.16c-2.19-1.66.16-2.92.16-2.92 0-6.77-4.17-10.44-11.43-12-3.11-.67-9.27-2.14-9.27-2.14l-8.27-6.03A12.448 12.448 0 0 0 60.4.57C44.83.57 28.89.35 17.16.94c-4.09.2-6.39 6.04-7.15 8.77-1.44 5.16-1.22 10.83-1.22 10.83-.04.11-.04.11-1.06 1.35l.07 6.58 3.65.37 14.71.34z"/>
|
||||||
|
<path class="st9" d="M18.88 34.9a7.28 7.28 0 1 0-.002-14.562A7.28 7.28 0 0 0 18.88 34.9zm63.97 0a7.28 7.28 0 1 0-7.28-7.28c0 4.02 3.25 7.28 7.28 7.28z"/>
|
||||||
|
<path class="st10" d="M21.19 31.87c-.93.5-2 .69-3.05.53a4.809 4.809 0 0 1-2.75-1.43c-.73-.76-1.2-1.75-1.32-2.8-.12-1.05.11-2.12.65-3.03.54-.91 1.37-1.62 2.35-2.01a4.829 4.829 0 0 1 5.65 1.55c.64.84.99 1.87.99 2.93m56.82-4.24c.93-.51 2-.7 3.05-.54 1.05.16 2.01.66 2.75 1.42.74.76 1.2 1.75 1.32 2.8.12 1.05-.1 2.12-.64 3.03-.54.91-1.37 1.62-2.35 2.02-.98.4-2.07.46-3.09.18A4.893 4.893 0 0 1 79 30.55c-.64-.84-.99-1.87-.99-2.93m-6.39-.07H26.55m25.33-11.57c-.49-.22-.47-.5-.47-.65.04-.61.78-.71 1.58-.73h.75c.45.02.9.08 1.33.18.26.06.94.23.9.79-.04.57-.78.71-1.58.73m-22.07-.32c-.49-.22-.47-.5-.47-.65.04-.61.78-.71 1.58-.73h.75c.45.02.9.08 1.33.18.26.06.93.23.9.79-.03.57-.78.71-1.58.73"/>
|
||||||
|
<path d="M50.06 2.91H31.74l-.73 8.95h18.32l.73-8.95zm-20.05 0-10.72.22c-3.05.07-4.32 1.88-5.58 4.66l-1.35 4.07h16.92l.73-8.95zm38.28 8.95H51.05l.73-8.95 6.1.08c2.86 0 6.42 0 10.43 3.29l-.02 5.58zm1.64 0h4.2a.408.408 0 0 0 .39-.29c.03-.08.03-.17 0-.26a.453.453 0 0 0-.15-.21c-.83-.63-3.16-2.66-4.38-3.58l-.06 4.34z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M93.43 14.86c-1.92-.27-3.88-.15-5.75.37 0 0-.37.37 1.1 2.63.07.1 4.48.73 4.48.73M9.33 14.24l2.56.31c.12.01.23.07.31.16.08.09.12.2.12.32v3.73l-1.21.91m-3.02 7.14 2.04.21m82.23.52h3.87"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2 KiB |
11
src/assets/img/icons/van-vent-left-front.svg
Normal file
11
src/assets/img/icons/van-vent-left-front.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="m93.11 28.87 3.67-.37.07-6.6c-1.03-1.24-1.03-1.24-1.07-1.35 0 0 .22-5.69-1.22-10.87-.76-2.74-3.07-8.6-7.18-8.8C75.6.28 59.6.5 43.97.5c-2.64 0-5.2.83-7.33 2.38l-8.3 6.05s-6.18 1.48-9.3 2.15c-7.29 1.56-11.48 5.24-11.48 12.04 0 0 2.36 1.27.16 2.93v3.18l6.43-.04 14.67.02h49.51l14.78-.34z"/>
|
||||||
|
<path class="st9" d="M92.95 27.65c0-4.04-3.27-7.31-7.31-7.31-4.04 0-7.31 3.27-7.31 7.31s3.27 7.31 7.31 7.31c4.04 0 7.31-3.27 7.31-7.31zm-64.2 0c0-4.04-3.27-7.31-7.31-7.31-4.04 0-7.31 3.27-7.31 7.31s3.27 7.31 7.31 7.31c4.04 0 7.31-3.27 7.31-7.31z"/>
|
||||||
|
<path class="st10" d="M80.79 27.65c0-1.06.35-2.1.99-2.94.64-.85 1.55-1.46 2.57-1.74 1.03-.28 2.11-.22 3.1.18.99.4 1.82 1.11 2.36 2.02.54.91.77 1.98.65 3.04s-.59 2.04-1.32 2.81-1.7 1.27-2.76 1.43a4.85 4.85 0 0 1-3.06-.53M26.3 27.65c0 1.06-.35 2.1-1 2.94a4.84 4.84 0 0 1-2.58 1.74c-1.03.28-2.12.22-3.1-.18a4.87 4.87 0 0 1-3.01-5.07c.12-1.06.59-2.04 1.33-2.81.74-.77 1.71-1.27 2.76-1.43 1.05-.16 2.13.03 3.06.54m54.19 4.21H32.71M49.99 16.3c-.8-.03-1.55-.17-1.58-.73-.04-.57.65-.73.9-.8.44-.1.89-.16 1.34-.18h.76c.8.02 1.55.12 1.59.73.01.15.02.43-.47.65m17.1.33c-.8-.03-1.55-.17-1.58-.73-.03-.57.65-.73.9-.8.44-.1.89-.16 1.34-.18h.76c.8.02 1.55.12 1.59.73.01.15.03.43-.47.65"/>
|
||||||
|
<path class="st9" d="M55.08 11.84h18.39l-.73-8.99H54.35l.73 8.99zm20.13 0H92.2l-1.35-4.09c-1.27-2.79-2.55-4.6-5.6-4.68l-10.78-.22.74 8.99zM36.04 6.23c4.02-3.3 7.6-3.3 10.47-3.3l6.12-.08.73 8.99H36.05l-.01-5.61z"/>
|
||||||
|
<path d="M34.33 7.49c-1.23.92-3.57 2.96-4.4 3.59-.07.05-.12.13-.15.21a.46.46 0 0 0 0 .26c.03.08.08.16.15.21.07.05.16.08.24.08h4.22l-.06-4.35z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M10.99 18.59s4.43-.63 4.5-.73c1.47-2.27 1.1-2.64 1.1-2.64-1.88-.52-3.84-.64-5.77-.37m82.63 4.83-1.22-.91v-3.74c0-.12.04-.23.12-.32a.47.47 0 0 1 .31-.16l2.57-.31m-.8 12.81 2.05-.21m-88.47.73h3.89"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
11
src/assets/img/icons/van-vent-right-front.svg
Normal file
11
src/assets/img/icons/van-vent-right-front.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st9{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st9{fill:#fff}.st10{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M26.07 29.22h49.51l14.67-.02 6.43.04v-3.18c-2.2-1.67.16-2.93.16-2.93 0-6.8-4.18-10.48-11.48-12.04-3.12-.67-9.3-2.15-9.3-2.15l-8.3-6.05C65.63 1.34 63.06.51 60.43.51 44.8.51 28.8.29 17.03.88c-4.11.2-6.41 6.06-7.18 8.8-1.44 5.18-1.22 10.87-1.22 10.87-.04.11-.04.11-1.07 1.35l.07 6.6 3.67.37 14.77.35z"/>
|
||||||
|
<path class="st9" d="M18.76 34.96c4.04 0 7.31-3.27 7.31-7.31s-3.27-7.31-7.31-7.31c-4.04 0-7.31 3.27-7.31 7.31s3.27 7.31 7.31 7.31zm64.2 0c4.04 0 7.31-3.27 7.31-7.31s-3.27-7.31-7.31-7.31c-4.04 0-7.31 3.27-7.31 7.31s3.27 7.31 7.31 7.31z"/>
|
||||||
|
<path class="st10" d="M21.07 31.92c-.93.51-2.01.69-3.06.53-1.05-.16-2.02-.67-2.76-1.43s-1.2-1.75-1.32-2.81c-.12-1.06.11-2.12.65-3.04.54-.91 1.37-1.62 2.36-2.02.99-.4 2.08-.46 3.1-.18 1.03.28 1.93.89 2.57 1.74.64.85.99 1.88.99 2.94m57.03-4.26c.93-.51 2.01-.7 3.06-.54 1.05.16 2.02.66 2.76 1.43.74.77 1.21 1.75 1.33 2.81.12 1.06-.1 2.12-.65 3.04a4.85 4.85 0 0 1-5.46 2.21 4.84 4.84 0 0 1-2.58-1.74c-.65-.85-1-1.88-1-2.94m-6.4-.07H26.45m25.43-11.62c-.49-.22-.48-.5-.47-.65.04-.61.78-.71 1.59-.73h.76c.45.02.9.08 1.34.18.26.06.94.23.9.8-.04.57-.78.71-1.58.73m-22.17-.33c-.5-.22-.48-.5-.47-.65.04-.61.78-.71 1.59-.73h.76c.45.02.9.08 1.34.18.26.06.94.23.9.8-.03.57-.78.71-1.58.73"/>
|
||||||
|
<path class="st9" d="M50.05 2.85H31.66l-.73 8.99h18.39l.73-8.99zm-20.12 0-10.76.23c-3.06.07-4.34 1.89-5.6 4.68l-1.35 4.09H29.2l.73-9zm38.42 8.99H51.04l.73-8.99 6.12.08c2.87 0 6.45 0 10.47 3.3l-.01 5.61z"/>
|
||||||
|
<path d="M70 11.84h4.22c.09 0 .17-.03.24-.08a.36.36 0 0 0 .15-.21c.03-.08.03-.17 0-.26a.453.453 0 0 0-.15-.21c-.83-.63-3.17-2.67-4.4-3.59L70 11.84z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M93.58 14.85c-1.93-.27-3.89-.15-5.77.37 0 0-.37.37 1.1 2.64.07.1 4.5.73 4.5.73M9.18 14.22l2.57.31c.12.01.23.07.31.16.08.09.12.2.12.32v3.74l-1.22.91m-3.03 7.18 2.05.21m82.53.52h3.89"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
13
src/assets/img/icons/van-windshield.svg
Normal file
13
src/assets/img/icons/van-windshield.svg
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st9{fill:#fff}.st10{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}
|
||||||
|
</style>
|
||||||
|
<path class="st9" d="M37.91 29.93v1.43c0 1.89-1.63 3.42-3.65 3.42s-3.65-1.53-3.65-3.42v-1.43"/>
|
||||||
|
<path class="st10" d="M37.91 29.93v1.43c0 1.89-1.63 3.42-3.65 3.42s-3.65-1.53-3.65-3.42v-1.43"/>
|
||||||
|
<path class="st9" d="M73.79 29.93v1.43c0 1.89-1.64 3.42-3.65 3.42s-3.65-1.53-3.65-3.42v-1.43"/>
|
||||||
|
<path class="st10" d="M73.79 29.93v1.43c0 1.89-1.64 3.42-3.65 3.42s-3.65-1.53-3.65-3.42v-1.43"/>
|
||||||
|
<path d="M70.37 11.73h.98v-1.68c0-.07.02-.14.05-.21.03-.07.07-.13.13-.18.05-.05.11-.09.18-.11.07-.03.14-.04.21-.04h2.59c.34-.01.66.11.91.34.25.23.39.55.4.89v1.45c-.01.15-.07.28-.18.38-.11.1-.25.15-.4.15H70.7l1.41 1.53c1.68 1.99 2.31 4.7 2.31 7.8 0 3.1-.41 7.74-.41 7.74 0 1.52-16.28 2.23-21.53 2.23s-22.07-.72-22.07-2.23c0 0-.41-4.65-.41-7.74s1.17-6.48 2.31-7.8l1.41-1.53h-4.56c-.15 0-.29-.05-.4-.15a.568.568 0 0 1-.18-.38v-1.45c.01-.34.16-.66.4-.89.25-.23.57-.35.91-.34h2.58c.07 0 .15.01.21.03a.544.544 0 0 1 .31.29c.03.07.05.14.05.21v1.68h.99c.31-1.32 2.86-7.11 3.71-9.34.17-.43.46-.8.83-1.07.37-.27.81-.43 1.27-.47 2.74-.25 6.64-.2 11.59-.2h1.52c4.93 0 8.81-.05 11.56.2.47.03.92.2 1.3.48.38.28.67.66.85 1.09.84 2.25 3.41 8.01 3.71 9.32z" fill="#fff" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M51.48 12.02c-8.04 0-15.54-.52-15.54-.52.39-1.59 2.9-8.44 3.7-8.54 1.79-.24 6.12-.29 11.84-.29h1.41c5.73 0 10.05.05 11.84.29.8.11 3.31 6.95 3.7 8.54 0 0-7.5.52-15.54.52h-1.41z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st10" d="M33.01 22.44c1.67.67 3.45 1.04 5.26 1.07.08.01.17-.01.25-.04.08-.03.14-.09.2-.15.05-.07.09-.14.1-.23a.43.43 0 0 0-.02-.25l-.95-3.28a.483.483 0 0 0-.14-.2.57.57 0 0 0-.22-.11l-4.13-.92c-.36.2-.69.47-.94.79-.26.33-.44.7-.55 1.1m39.51 2.4c-1.68.66-3.47 1-5.27 1.02a.548.548 0 0 1-.25-.04c-.08-.03-.14-.09-.2-.15s-.09-.14-.1-.23a.533.533 0 0 1 .02-.25l.98-3.27c.03-.08.08-.15.14-.2a.57.57 0 0 1 .22-.11l4.13-.88c.36.2.68.47.93.8.25.33.44.7.54 1.11m-31.71-.41c.13.6 3.29 4.89 4.25 4.89h14.48c.96 0 4.12-4.3 4.25-4.89"/>
|
||||||
|
<path class="st10" d="M34.41 18.56s15.13 4.07 33.82.55c.87-.16 1.74-.36 2.62-.54M44.72 29.1c.19.18.42.32.66.41.25.09.51.12.77.1 0 0 2.38.25 6.17.25 3.78 0 6.19-.25 6.19-.25.26.02.52-.02.77-.1.25-.09.47-.23.66-.41l1.11-1.91H43.61l1.11 1.91zm-8.84-2.25-3.85-.38.24 1.83c.24.57 1.22.76 1.84.82l1.95.19c.2.02.36-.11.33-.25l-.51-2.21zm32.5 0 3.85-.38-.24 1.83c-.24.57-1.22.76-1.84.82l-1.95.19c-.2.02-.36-.11-.33-.25l.51-2.21z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.7 KiB |
12
src/assets/img/icons/vent-left-front.svg
Normal file
12
src/assets/img/icons/vent-left-front.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M92.99 28.34c4.72-1.13 7.53-2.77 9.11-4.03.49-.39.89-.89 1.17-1.45a4.2 4.2 0 0 0 .44-1.81c.22-9.53-4.11-9.95-4.11-9.95l-.16-1.65c-5.22 0-10.33-1.45-14.78-4.19-2.59-1.49-5.86-3.1-7.35-3.83-.53-.26-1.09-.41-1.67-.47-12.97-1.14-26.5.08-26.5.08-3.88.37-23.61 10.49-23.61 10.49-29.99.43-24.44 12.56-24.44 12.56 2.18 1.02.77 3.24.77 3.24l7.68 1.01" fill="#fff"/>
|
||||||
|
<path class="st10" d="M92.99 28.34c4.72-1.13 7.53-2.77 9.11-4.03.49-.39.89-.89 1.17-1.45a4.2 4.2 0 0 0 .44-1.81c.22-9.53-4.11-9.95-4.11-9.95l-.16-1.65c-5.22 0-10.33-1.45-14.78-4.19-2.59-1.49-5.86-3.1-7.35-3.83-.53-.26-1.09-.41-1.67-.47-12.97-1.14-26.5.08-26.5.08-3.88.37-23.61 10.49-23.61 10.49-29.99.43-24.44 12.56-24.44 12.56 2.18 1.02.77 3.24.77 3.24l7.68 1.01"/>
|
||||||
|
<path class="st11" d="M92.99 26.61c0-4.6-3.73-8.34-8.34-8.34s-8.34 3.73-8.34 8.34c0 4.61 3.73 8.34 8.34 8.34s8.34-3.74 8.34-8.34zm-67.6-3.19c-.42-1.01-1.03-1.93-1.81-2.71s-1.69-1.39-2.71-1.81c-1.01-.42-2.1-.63-3.19-.63a8.3 8.3 0 0 0-4.63 1.41 8.37 8.37 0 0 0-3.07 3.74c-.63 1.52-.79 3.2-.47 4.82.32 1.62 1.12 3.1 2.28 4.27a8.301 8.301 0 0 0 4.27 2.28c1.62.32 3.29.16 4.82-.48a8.318 8.318 0 0 0 5.14-7.7c.01-1.1-.21-2.18-.63-3.19z"/>
|
||||||
|
<path class="st10" d="M10.01 17.74c-1.53.53-3.12.91-4.73 1.12 1.41-1.5 3.15-2.31 4.9-2.91.15-.05.31-.07.47-.05 1.26.15 1.6.43 1.67.5m43.72-1.33c-.92 0-1.77-.14-1.82-.79-.05-.65.72-.85 1.01-.93.5-.12 1.01-.2 1.52-.24.3-.03.59-.04.87-.04.91 0 1.77.1 1.82.79.01.17.04.49-.52.76m16.78-1.08c-.92 0-1.77-.1-1.82-.79-.03-.29-.08-.96 2.54-1.17.3-.04.59-.04.86-.04.92 0 1.77.1 1.82.79.02.18.05.55-.74.84m.76 13.44c0-1.21.4-2.39 1.13-3.36.74-.96 1.77-1.66 2.94-1.98a5.58 5.58 0 0 1 3.54.2 5.519 5.519 0 0 1 3.43 5.76 5.565 5.565 0 0 1-1.51 3.21c-.84.87-1.94 1.45-3.14 1.64-1.2.19-2.43-.03-3.49-.6m-58.79-4.87a5.54 5.54 0 0 1-4.08 5.34c-1.17.32-2.41.25-3.54-.21a5.52 5.52 0 0 1-2.69-2.31 5.534 5.534 0 0 1-.74-3.47c.14-1.21.67-2.33 1.52-3.2.84-.87 1.95-1.45 3.15-1.63 1.2-.18 2.43.03 3.49.61m55.96 6.47H25.95m73.69-12.63c-15.73-5.2-.04-4.47-.04-4.47"/>
|
||||||
|
<path class="st11" d="M43.15 6.31c4.16-1.5 9.41-3.13 15.59-3.26l.21 7.41-15.9.89.1-5.04z"/>
|
||||||
|
<path d="M33.82 10.54c1.54-1.01 3.93-2.02 7.11-3.35l-.04 4.28-9.01.51c.49-.33 1.11-.83 1.94-1.44z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="m71.99 4 .21 5.7-11 .63-.2-7.32c3.69-.08 7.38.26 10.99.99zm2.32 5.62-.1-4.97c2.87.93 5.31 2.38 6.32 4.64l-6.22.33z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.7 KiB |
11
src/assets/img/icons/vent-left-rear.svg
Normal file
11
src/assets/img/icons/vent-left-rear.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="M92.99 28.34c4.72-1.13 7.53-2.77 9.11-4.03.49-.39.89-.89 1.17-1.45a4.2 4.2 0 0 0 .44-1.81c.22-9.53-4.11-9.95-4.11-9.95l-.16-1.65c-5.22 0-10.33-1.45-14.78-4.19-2.59-1.49-5.86-3.1-7.35-3.83-.53-.26-1.09-.41-1.67-.47-12.97-1.14-26.5.08-26.5.08-3.88.37-23.61 10.49-23.61 10.49-29.99.43-24.44 12.56-24.44 12.56 2.18 1.02.77 3.24.77 3.24l7.68 1.01" fill="#fff"/>
|
||||||
|
<path class="st10" d="M92.99 28.34c4.72-1.13 7.53-2.77 9.11-4.03.49-.39.89-.89 1.17-1.45a4.2 4.2 0 0 0 .44-1.81c.22-9.53-4.11-9.95-4.11-9.95l-.16-1.65c-5.22 0-10.33-1.45-14.78-4.19-2.59-1.49-5.86-3.1-7.35-3.83-.53-.26-1.09-.41-1.67-.47-12.97-1.14-26.5.08-26.5.08-3.88.37-23.61 10.49-23.61 10.49-29.99.43-24.44 12.56-24.44 12.56 2.18 1.02.77 3.24.77 3.24l7.68 1.01"/>
|
||||||
|
<path class="st11" d="M92.99 26.61c0-4.6-3.73-8.34-8.34-8.34s-8.34 3.73-8.34 8.34c0 4.61 3.73 8.34 8.34 8.34s8.34-3.74 8.34-8.34zm-67.6-3.19c-.42-1.01-1.03-1.93-1.81-2.71s-1.69-1.39-2.71-1.81c-1.01-.42-2.1-.63-3.19-.63a8.3 8.3 0 0 0-4.63 1.41 8.37 8.37 0 0 0-3.07 3.74c-.63 1.52-.79 3.2-.47 4.82.32 1.62 1.12 3.1 2.28 4.27a8.301 8.301 0 0 0 4.27 2.28c1.62.32 3.29.16 4.82-.48a8.318 8.318 0 0 0 5.14-7.7c.01-1.1-.21-2.18-.63-3.19z"/>
|
||||||
|
<path class="st10" d="M10.01 17.74c-1.53.53-3.12.91-4.73 1.12 1.41-1.5 3.15-2.31 4.9-2.91.15-.05.31-.07.47-.05 1.26.15 1.6.43 1.67.5m43.72-1.33c-.92 0-1.77-.14-1.82-.79-.05-.65.72-.85 1.01-.93.5-.12 1.01-.2 1.52-.24.3-.03.59-.04.87-.04.91 0 1.77.1 1.82.79.01.17.04.49-.52.76m16.78-1.08c-.92 0-1.77-.1-1.82-.79-.03-.29-.08-.96 2.54-1.17.3-.04.59-.04.86-.04.92 0 1.77.1 1.82.79.02.18.05.55-.74.84m.76 13.44c0-1.21.4-2.39 1.13-3.36.74-.96 1.77-1.66 2.94-1.98a5.58 5.58 0 0 1 3.54.2 5.519 5.519 0 0 1 3.43 5.76 5.565 5.565 0 0 1-1.51 3.21c-.84.87-1.94 1.45-3.14 1.64-1.2.19-2.43-.03-3.49-.6m-58.79-4.87a5.54 5.54 0 0 1-4.08 5.34c-1.17.32-2.41.25-3.54-.21a5.52 5.52 0 0 1-2.69-2.31 5.534 5.534 0 0 1-.74-3.47c.14-1.21.67-2.33 1.52-3.2.84-.87 1.95-1.45 3.15-1.63 1.2-.18 2.43.03 3.49.61m55.96 6.47H25.95m73.69-12.63c-15.73-5.2-.04-4.47-.04-4.47"/>
|
||||||
|
<path class="st11" d="M43.15 6.31c4.16-1.5 9.41-3.13 15.59-3.26l.21 7.41-15.9.89.1-5.04zm-9.33 4.23c1.54-1.01 3.93-2.02 7.11-3.35l-.04 4.28-9.01.51c.49-.33 1.11-.83 1.94-1.44zM71.99 4l.21 5.7-11 .63-.2-7.32c3.69-.08 7.38.26 10.99.99z"/>
|
||||||
|
<path d="m74.31 9.62-.1-4.97c2.87.93 5.31 2.38 6.32 4.64l-6.22.33z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
12
src/assets/img/icons/vent-right-front.svg
Normal file
12
src/assets/img/icons/vent-right-front.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m94.87 28.34 7.68-1.01s-1.41-2.22.77-3.24c0 0 5.54-12.13-24.44-12.55 0 0-19.73-10.12-23.61-10.49 0 0-13.53-1.22-26.5-.08-.58.05-1.15.21-1.67.47-1.49.72-4.76 2.34-7.35 3.83A28.393 28.393 0 0 1 4.96 9.46l-.16 1.65s-4.33.42-4.11 9.95c.01.63.17 1.24.44 1.81.28.56.68 1.06 1.17 1.45 1.58 1.26 4.39 2.9 9.11 4.03" fill="#fff"/>
|
||||||
|
<path class="st10" d="m94.87 28.34 7.68-1.01s-1.41-2.22.77-3.24c0 0 5.54-12.13-24.44-12.55 0 0-19.73-10.12-23.61-10.49 0 0-13.53-1.22-26.5-.08-.58.05-1.15.21-1.67.47-1.49.72-4.76 2.34-7.35 3.83A28.393 28.393 0 0 1 4.96 9.46l-.16 1.65s-4.33.42-4.11 9.95c.01.63.17 1.24.44 1.81.28.56.68 1.06 1.17 1.45 1.58 1.26 4.39 2.9 9.11 4.03"/>
|
||||||
|
<path class="st11" d="M19.75 34.95c4.61 0 8.34-3.73 8.34-8.34 0-4.6-3.73-8.34-8.34-8.34s-8.34 3.73-8.34 8.34c0 4.6 3.74 8.34 8.34 8.34zm58.62-8.34c0 1.65.49 3.26 1.4 4.63a8.37 8.37 0 0 0 3.74 3.07c1.52.63 3.2.8 4.82.48 1.62-.32 3.1-1.12 4.27-2.28a8.301 8.301 0 0 0 2.28-4.27 8.318 8.318 0 0 0-3.54-8.56 8.3 8.3 0 0 0-4.63-1.41c-1.1 0-2.18.21-3.19.63-1.01.42-1.93 1.03-2.71 1.81S79.42 22.4 79 23.42a8.477 8.477 0 0 0-.63 3.19z"/>
|
||||||
|
<path class="st10" d="M92.08 16.4c.07-.07.42-.34 1.67-.5.16-.02.32-.01.47.05 1.74.6 3.49 1.41 4.9 2.91-1.61-.21-3.19-.58-4.73-1.12m-48.9-3.12c-.56-.27-.53-.59-.52-.76.05-.69.91-.79 1.82-.79.28 0 .57.01.87.04.51.04 1.02.12 1.52.24.29.08 1.07.28 1.01.93-.05.65-.91.79-1.82.79m-22.32-1.9c-.79-.28-.76-.65-.74-.84.05-.69.91-.79 1.82-.79.28 0 .56 0 .86.04 2.61.21 2.56.88 2.54 1.17-.05.69-.91.79-1.82.79m-6.32 17.94a5.5 5.5 0 0 1-3.49.6 5.52 5.52 0 0 1-3.14-1.64c-.84-.87-1.37-2-1.51-3.21-.14-1.21.12-2.42.74-3.46a5.544 5.544 0 0 1 2.69-2.3 5.58 5.58 0 0 1 3.54-.2c1.17.32 2.2 1.02 2.94 1.98.74.96 1.13 2.14 1.13 3.36m58.77-4.87c1.07-.58 2.29-.8 3.49-.61 1.2.18 2.31.76 3.15 1.63.84.87 1.37 2 1.52 3.2a5.548 5.548 0 0 1-3.43 5.78c-1.13.45-2.37.53-3.54.21a5.576 5.576 0 0 1-2.94-1.98 5.498 5.498 0 0 1-1.14-3.36m-2.71 1.6H28.11M4.8 11.11s15.69-.72-.04 4.47"/>
|
||||||
|
<path class="st11" d="m61.35 11.35-15.9-.89.21-7.41c6.18.13 11.43 1.76 15.59 3.26l.1 5.04z"/>
|
||||||
|
<path d="m72.52 11.97-9.01-.51-.04-4.28c3.18 1.33 5.57 2.33 7.11 3.35.83.62 1.46 1.12 1.94 1.44z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st11" d="m43.4 3.01-.2 7.32-11-.63.21-5.7c3.62-.73 7.3-1.07 10.99-.99zM23.88 9.28c1-2.26 3.45-3.71 6.32-4.64l-.1 4.97-6.22-.33z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
11
src/assets/img/icons/vent-right-rear.svg
Normal file
11
src/assets/img/icons/vent-right-rear.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10,.st11{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none}.st11{fill:#fff}
|
||||||
|
</style>
|
||||||
|
<path d="m94.87 28.34 7.68-1.01s-1.41-2.22.77-3.24c0 0 5.54-12.13-24.44-12.55 0 0-19.73-10.12-23.61-10.49 0 0-13.53-1.22-26.5-.08-.58.05-1.15.21-1.67.47-1.49.72-4.76 2.34-7.35 3.83A28.393 28.393 0 0 1 4.96 9.46l-.16 1.65s-4.33.42-4.11 9.95c.01.63.17 1.24.44 1.81.28.56.68 1.06 1.17 1.45 1.58 1.26 4.39 2.9 9.11 4.03" fill="#fff"/>
|
||||||
|
<path class="st10" d="m94.87 28.34 7.68-1.01s-1.41-2.22.77-3.24c0 0 5.54-12.13-24.44-12.55 0 0-19.73-10.12-23.61-10.49 0 0-13.53-1.22-26.5-.08-.58.05-1.15.21-1.67.47-1.49.72-4.76 2.34-7.35 3.83A28.393 28.393 0 0 1 4.96 9.46l-.16 1.65s-4.33.42-4.11 9.95c.01.63.17 1.24.44 1.81.28.56.68 1.06 1.17 1.45 1.58 1.26 4.39 2.9 9.11 4.03"/>
|
||||||
|
<path class="st11" d="M19.75 34.95c4.61 0 8.34-3.73 8.34-8.34 0-4.6-3.73-8.34-8.34-8.34s-8.34 3.73-8.34 8.34c0 4.6 3.74 8.34 8.34 8.34zm58.62-8.34c0 1.65.49 3.26 1.4 4.63a8.37 8.37 0 0 0 3.74 3.07c1.52.63 3.2.8 4.82.48 1.62-.32 3.1-1.12 4.27-2.28a8.301 8.301 0 0 0 2.28-4.27 8.318 8.318 0 0 0-3.54-8.56 8.3 8.3 0 0 0-4.63-1.41c-1.1 0-2.18.21-3.19.63-1.01.42-1.93 1.03-2.71 1.81S79.42 22.4 79 23.42a8.477 8.477 0 0 0-.63 3.19z"/>
|
||||||
|
<path class="st10" d="M92.08 16.4c.07-.07.42-.34 1.67-.5.16-.02.32-.01.47.05 1.74.6 3.49 1.41 4.9 2.91-1.61-.21-3.19-.58-4.73-1.12m-48.9-3.12c-.56-.27-.53-.59-.52-.76.05-.69.91-.79 1.82-.79.28 0 .57.01.87.04.51.04 1.02.12 1.52.24.29.08 1.07.28 1.01.93-.05.65-.91.79-1.82.79m-22.32-1.9c-.79-.28-.76-.65-.74-.84.05-.69.91-.79 1.82-.79.28 0 .56 0 .86.04 2.61.21 2.56.88 2.54 1.17-.05.69-.91.79-1.82.79m-6.32 17.94a5.5 5.5 0 0 1-3.49.6 5.52 5.52 0 0 1-3.14-1.64c-.84-.87-1.37-2-1.51-3.21-.14-1.21.12-2.42.74-3.46a5.544 5.544 0 0 1 2.69-2.3 5.58 5.58 0 0 1 3.54-.2c1.17.32 2.2 1.02 2.94 1.98.74.96 1.13 2.14 1.13 3.36m58.77-4.87c1.07-.58 2.29-.8 3.49-.61 1.2.18 2.31.76 3.15 1.63.84.87 1.37 2 1.52 3.2a5.548 5.548 0 0 1-3.43 5.78c-1.13.45-2.37.53-3.54.21a5.576 5.576 0 0 1-2.94-1.98 5.498 5.498 0 0 1-1.14-3.36m-2.71 1.6H28.11M4.8 11.11s15.69-.72-.04 4.47"/>
|
||||||
|
<path class="st11" d="m61.35 11.35-15.9-.89.21-7.41c6.18.13 11.43 1.76 15.59 3.26l.1 5.04zm11.17.62-9.01-.51-.04-4.28c3.18 1.33 5.57 2.33 7.11 3.35.83.62 1.46 1.12 1.94 1.44zM43.4 3.01l-.2 7.32-11-.63.21-5.7c3.62-.73 7.3-1.07 10.99-.99z"/>
|
||||||
|
<path d="M23.88 9.28c1-2.26 3.45-3.71 6.32-4.64l-.1 4.97-6.22-.33z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
13
src/assets/img/icons/vent-window-left-all.svg
Normal file
13
src/assets/img/icons/vent-window-left-all.svg
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10{fill:none}.st10,.st11,.st12{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st11{fill:#fff}.st12{fill:#d92d27}
|
||||||
|
</style>
|
||||||
|
<path d="M93.1 28.37c4.73-1.14 7.55-2.78 9.13-4.04.49-.39.89-.89 1.17-1.45.28-.56.43-1.18.45-1.81.22-9.55-4.12-9.97-4.12-9.97l-.16-1.66a28.433 28.433 0 0 1-14.83-4.21c-2.59-1.49-5.87-3.11-7.37-3.84-.53-.26-1.09-.41-1.68-.47C62.7-.22 49.13 1 49.13 1c-3.89.37-23.67 10.52-23.67 10.52C-4.6 11.94.96 24.11.96 24.11c2.19 1.02.77 3.25.77 3.25l7.7 1.01" fill="#fff"/>
|
||||||
|
<path class="st10" d="M93.1 28.37c4.73-1.14 7.55-2.78 9.13-4.04.49-.39.89-.89 1.17-1.45.28-.56.43-1.18.45-1.81.22-9.55-4.12-9.97-4.12-9.97l-.16-1.66a28.433 28.433 0 0 1-14.83-4.21c-2.59-1.49-5.87-3.11-7.37-3.84-.53-.26-1.09-.41-1.68-.47C62.7-.22 49.13 1 49.13 1c-3.89.37-23.67 10.52-23.67 10.52C-4.6 11.94.96 24.11.96 24.11c2.19 1.02.77 3.25.77 3.25l7.7 1.01"/>
|
||||||
|
<path class="st11" d="M93.09 26.63c0-4.62-3.74-8.36-8.36-8.36s-8.36 3.74-8.36 8.36c0 4.62 3.74 8.36 8.36 8.36s8.36-3.74 8.36-8.36zm-67.76-3.2a8.422 8.422 0 0 0-1.81-2.71 8.368 8.368 0 0 0-5.91-2.45 8.365 8.365 0 0 0-7.72 5.16c-.63 1.53-.8 3.21-.47 4.83a8.347 8.347 0 0 0 2.29 4.28 8.42 8.42 0 0 0 4.28 2.29c1.62.32 3.3.16 4.83-.48 1.53-.63 2.83-1.7 3.75-3.08a8.332 8.332 0 0 0 1.41-4.64 8.79 8.79 0 0 0-.65-3.2z"/>
|
||||||
|
<path class="st10" d="M9.9 17.74c-1.54.53-3.13.91-4.74 1.12 1.41-1.51 3.16-2.31 4.91-2.92.15-.05.31-.07.47-.05 1.26.16 1.61.43 1.68.5m43.82-1.33c-.92 0-1.77-.14-1.83-.79-.05-.65.72-.86 1.02-.94.5-.12 1.01-.2 1.52-.24.3-.03.59-.04.87-.04.91 0 1.77.1 1.83.79.01.17.04.49-.52.76m16.83-1.07c-.92 0-1.77-.1-1.83-.79-.03-.29-.08-.96 2.54-1.17.3-.04.59-.04.86-.04.92 0 1.77.1 1.83.79.02.18.05.55-.75.84m.78 13.47c0-1.22.4-2.4 1.14-3.37.74-.97 1.77-1.67 2.94-1.99 1.17-.32 2.42-.25 3.55.2s2.08 1.27 2.7 2.31c.62 1.04.88 2.27.75 3.47a5.548 5.548 0 0 1-4.66 4.85c-1.2.19-2.43-.03-3.5-.61m-58.95-4.86c0 1.22-.4 2.4-1.14 3.37-.74.97-1.77 1.67-2.95 1.99s-2.42.25-3.55-.21a5.563 5.563 0 0 1-3.44-5.8 5.49 5.49 0 0 1 1.52-3.21c.84-.88 1.95-1.45 3.16-1.63 1.2-.18 2.43.03 3.5.61m56.1 6.48H25.88m73.88-12.65c-15.77-5.21-.04-4.48-.04-4.48"/>
|
||||||
|
<path class="st11" d="M43.13 6.28c4.17-1.5 9.43-3.14 15.63-3.27l.21 7.43-15.94.89.1-5.05z"/>
|
||||||
|
<path class="st12" d="M33.77 10.52c1.54-1.02 3.94-2.02 7.13-3.36l-.04 4.29-9.03.51c.49-.32 1.11-.83 1.94-1.44z"/>
|
||||||
|
<path class="st11" d="m72.04 3.97.21 5.71-11.03.63-.2-7.34c3.7-.08 7.4.26 11.02 1z"/>
|
||||||
|
<path class="st12" d="m74.36 9.6-.1-4.99c2.88.93 5.33 2.39 6.33 4.65l-6.23.34z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.6 KiB |
13
src/assets/img/icons/vent-window-right-all.svg
Normal file
13
src/assets/img/icons/vent-window-right-all.svg
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st10{fill:none}.st10,.st11,.st12{stroke-width:.75;stroke-linecap:round;stroke-linejoin:round;stroke:#000}.st11{fill:#fff}.st12{fill:#d92d27}
|
||||||
|
</style>
|
||||||
|
<path d="m94.98 28.37 7.7-1.01s-1.42-2.23.77-3.25c0 0 5.56-12.16-24.5-12.58 0 0-19.78-10.15-23.67-10.52 0 0-13.57-1.22-26.57-.08-.58.06-1.15.21-1.68.47-1.49.73-4.77 2.34-7.37 3.84-4.46 2.74-9.59 4.2-14.82 4.21l-.16 1.66s-4.34.42-4.12 9.97c.01.63.17 1.25.45 1.81s.68 1.06 1.17 1.45c1.59 1.26 4.4 2.9 9.13 4.04" fill="#fff"/>
|
||||||
|
<path class="st10" d="m94.98 28.37 7.7-1.01s-1.42-2.23.77-3.25c0 0 5.56-12.16-24.5-12.58 0 0-19.78-10.15-23.67-10.52 0 0-13.57-1.22-26.57-.08-.58.06-1.15.21-1.68.47-1.49.73-4.77 2.34-7.37 3.84-4.46 2.74-9.59 4.2-14.82 4.21l-.16 1.66s-4.34.42-4.12 9.97c.01.63.17 1.25.45 1.81s.68 1.06 1.17 1.45c1.59 1.26 4.4 2.9 9.13 4.04"/>
|
||||||
|
<path class="st11" d="M19.67 34.99c4.62 0 8.36-3.74 8.36-8.36 0-4.62-3.74-8.36-8.36-8.36s-8.36 3.74-8.36 8.36c0 4.62 3.74 8.36 8.36 8.36zm58.77-8.36a8.365 8.365 0 0 0 9.99 8.2 8.347 8.347 0 0 0 4.28-2.29A8.347 8.347 0 0 0 95 28.26c.32-1.62.16-3.3-.47-4.83a8.301 8.301 0 0 0-3.08-3.75 8.332 8.332 0 0 0-7.84-.77 8.422 8.422 0 0 0-2.71 1.81c-.78.78-1.39 1.7-1.81 2.71a8.21 8.21 0 0 0-.65 3.2z"/>
|
||||||
|
<path class="st10" d="M92.19 16.39c.07-.07.42-.34 1.68-.5.16-.02.32-.01.47.05 1.74.6 3.5 1.41 4.91 2.92-1.61-.21-3.2-.59-4.74-1.12m-49.04-3.13c-.56-.27-.53-.59-.52-.76.05-.7.91-.79 1.83-.79.28 0 .57.01.87.04.51.04 1.02.12 1.52.24.29.08 1.07.29 1.02.94-.05.65-.91.79-1.83.79m-22.37-1.92c-.79-.29-.76-.65-.75-.84.05-.7.91-.79 1.83-.79.28 0 .57 0 .86.04 2.62.21 2.57.89 2.54 1.17-.05.7-.91.79-1.83.79m-6.33 17.99c-1.07.58-2.3.79-3.5.61a5.548 5.548 0 0 1-4.66-4.85c-.14-1.21.12-2.43.75-3.47.62-1.04 1.57-1.86 2.7-2.31s2.37-.53 3.55-.2 2.21 1.02 2.94 1.99c.74.97 1.14 2.15 1.14 3.37m58.91-4.9c1.07-.58 2.3-.8 3.5-.61 1.2.18 2.31.76 3.16 1.63.84.88 1.38 2 1.52 3.21a5.563 5.563 0 0 1-6.99 6.01 5.562 5.562 0 0 1-4.09-5.36m-2.72 1.6H28.04M4.68 11.09s15.73-.73-.04 4.48"/>
|
||||||
|
<path class="st11" d="m61.37 11.33-15.94-.89.21-7.43c6.2.13 11.45 1.77 15.63 3.27l.1 5.05z"/>
|
||||||
|
<path class="st12" d="m72.57 11.96-9.03-.51-.04-4.28c3.19 1.33 5.59 2.34 7.13 3.36.83.6 1.46 1.11 1.94 1.43z"/>
|
||||||
|
<path class="st11" d="m43.38 2.97-.2 7.34-11.03-.63.21-5.71c3.63-.74 7.32-1.08 11.02-1z"/>
|
||||||
|
<path class="st12" d="M23.81 9.26c1.01-2.26 3.46-3.72 6.33-4.65l-.1 4.99-6.23-.34z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.4 KiB |
|
|
@ -1,12 +1,12 @@
|
||||||
<svg version="1.1" id="windshield-damage" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 72.1 47.1" xml:space="preserve">
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 104.4 35.42" xml:space="preserve">
|
||||||
<style>
|
<style>
|
||||||
.st0{fill:#fff}.st1{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}
|
.st0{fill:#fff}.st1{fill:none;stroke:#000;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}
|
||||||
</style>
|
</style>
|
||||||
<path class="st0" d="M5.9 41.3c0 1.4.6 2.8 1.6 3.7 1 1 2.4 1.5 3.8 1.5s2.8-.6 3.8-1.5c1-1 1.6-2.3 1.6-3.7"/>
|
<path class="st0" d="M29.5 30.98c.03 1.06.47 2.06 1.24 2.8.76.74 1.78 1.15 2.83 1.15 1.06 0 2.08-.42 2.83-1.15.76-.74 1.2-1.75 1.24-2.8"/>
|
||||||
<path class="st1" d="M5.9 41.3c0 1.4.6 2.8 1.6 3.7 1 1 2.4 1.5 3.8 1.5s2.8-.6 3.8-1.5c1-1 1.6-2.3 1.6-3.7"/>
|
<path class="st1" d="M29.5 30.98c.03 1.06.47 2.06 1.24 2.8.76.74 1.78 1.15 2.83 1.15 1.06 0 2.08-.42 2.83-1.15.76-.74 1.2-1.75 1.24-2.8"/>
|
||||||
<path class="st0" d="M55.1 41.3c0 1.4.6 2.8 1.6 3.8s2.4 1.6 3.8 1.6 2.8-.6 3.8-1.6 1.6-2.4 1.6-3.8"/>
|
<path class="st0" d="M66.52 30.98c0 1.08.42 2.11 1.19 2.88s1.8 1.19 2.88 1.19 2.11-.42 2.88-1.19 1.19-1.8 1.19-2.88"/>
|
||||||
<path class="st1" d="M55.1 41.3c0 1.4.6 2.8 1.6 3.8s2.4 1.6 3.8 1.6 2.8-.6 3.8-1.6 1.6-2.4 1.6-3.8"/>
|
<path class="st1" d="M66.52 30.98c0 1.08.42 2.11 1.19 2.88s1.8 1.19 2.88 1.19 2.11-.42 2.88-1.19 1.19-1.8 1.19-2.88"/>
|
||||||
<path d="M36.1.4c12.4 0 18.2 1.4 18.2 1.4 5.5.9 8.7 11.1 8.7 11.1h1.1c0-3.7 2-3.7 3.6-3.1 1.1.5 2.1 1.2 2.9 2.1 2 2.4.7 2.6.7 2.6h-7.8l5.9 4.6v18.5c0 3.7-3.1 3.6-3.1 3.6H5.8s-3.1.2-3.1-3.6V19.2l5.9-4.6H.8s-1.3-.2.7-2.6c.8-.9 1.7-1.6 2.9-2.1C5.9 9.3 8 9.2 8 13h1.1s3.2-10.2 8.7-11.1c0-.1 5.9-1.5 18.3-1.5z" fill="#fff" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
<path d="M52.21.38c9.33 0 13.72 1.08 13.72 1.08 4.13.66 6.57 8.32 6.57 8.32h.84c0-2.8 1.51-2.77 2.71-2.31.83.34 1.57.88 2.14 1.57 1.52 1.78.54 1.93.54 1.93h-5.85l4.44 3.47v13.87c0 2.78-2.35 2.67-2.35 2.67H29.45s-2.35.12-2.35-2.67V14.45l4.43-3.47h-5.86s-.99-.15.54-1.93c.57-.69 1.31-1.24 2.14-1.57 1.19-.46 2.71-.49 2.71 2.31h.85s2.45-7.66 6.57-8.32c.01-.01 4.4-1.09 13.73-1.09z" fill="#fff" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
<path d="M36.1 12.8c12.2 0 22.5.8 22.5.8 0-4-3.7-9.3-3.7-9.3S48.9 3 36.1 3 17.2 4.3 17.2 4.3s-3.7 5.3-3.7 9.3c0 0 10.4-.8 22.6-.8z" fill="#d92d27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
<path d="M52.21 9.66c9.14 0 16.95.59 16.95.59 0-2.98-2.75-6.93-2.75-6.93s-4.57-.95-14.2-.95-14.2.95-14.2.95-2.75 3.95-2.75 6.93c.01 0 7.81-.59 16.95-.59z" fill="#d92f27" stroke="#000" stroke-width=".75" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
<path class="st1" d="M25.7 24.6c6.8-.7 13.6-.7 20.4 0M51.1 24s3.7-3.5 13.2-3.5c0 0 1.8 4.1-3.9 5.2M20.6 24s-3.7-3.5-13.2-3.5c0 0-1.8 4 3.9 5.2M5.9 34.7s33 5.6 60 0"/>
|
<path class="st1" d="M44.38 18.52c5.1-.54 10.23-.54 15.33 0m3.78-.51s2.75-2.6 9.94-2.6c0 0 1.36 3.07-2.94 3.89M40.6 18.01s-2.75-2.6-9.94-2.6c0 0-1.34 2.97 2.94 3.89m-4.1 6.76s24.84 4.21 45.16 0"/>
|
||||||
</svg>
|
</svg>
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.7 KiB |
9
src/assets/img/icons/windshield-repair.svg
Normal file
9
src/assets/img/icons/windshield-repair.svg
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 59.79 34.81" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st0{display:none}.st1{display:inline;fill:#fff}.st12,.st2{display:inline;stroke-linecap:round;stroke-linejoin:round}.st2{fill:none;stroke-width:.75}.st2,.st3{stroke:#000}.st3,.st5,.st6,.st7,.st8{display:inline;stroke-width:.75;stroke-linecap:round;stroke-linejoin:round}.st3{fill:#fff}.st5{fill:none}.st5,.st6,.st7{stroke:#010101}.st6{fill:#fff}.st7{fill:#d92e27}.st12,.st8{stroke:#000}.st8{fill:#d92d27}.st12{fill:none;stroke-width:1.25}
|
||||||
|
</style>
|
||||||
|
<path d="M29.89 33.9c-14.52 0-25.31-4.35-28.86-7.6L6.81 2.72c.17-.54.51-1 .96-1.33A2.67 2.67 0 0 1 9.34.91h41.11c.56-.02 1.11.15 1.57.48.46.33.8.79.96 1.33l5.77 23.58c-3.55 3.26-14.33 7.6-28.86 7.6z" fill="#d92d27" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M50.74 2.96H36.78l-2.4 2.98h-8.97l-2.4-2.98H9.06L3.49 25.19c3.2 2.94 13.36 6.5 26.39 6.5s23.22-3.54 26.4-6.5L50.74 2.96z" fill="#fff" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M25.79 8.39h8.26" fill="none" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M12.14 17.22c.51 0 .93-.29.93-.66 0-.36-.42-.66-.93-.66s-.93.29-.93.66c0 .36.41.66.93.66zm4.28 3.72c.52 0 .94-.3.94-.68 0-.38-.42-.68-.94-.68s-.94.3-.94.68c0 .38.42.68.94.68zm31.32-2.85c.52 0 .93-.29.93-.66s-.42-.66-.93-.66-.93.29-.93.66.41.66.93.66z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.5 KiB |
10
src/assets/img/icons/windshield-replace.svg
Normal file
10
src/assets/img/icons/windshield-replace.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 59.79 34.81" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st12{stroke-linecap:round;stroke-linejoin:round;stroke:#000;fill:none;stroke-width:1.25}
|
||||||
|
</style>
|
||||||
|
<path d="M29.89 34.06c-14.67 0-25.56-4.39-29.14-7.67L6.58 2.58c.17-.54.51-1.01.97-1.34.46-.33 1.02-.5 1.59-.48h41.51a2.595 2.595 0 0 1 2.56 1.82l5.83 23.82c-3.59 3.28-14.48 7.66-29.15 7.66z" fill="#d92d27" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M50.94 2.82H36.85l-2.42 3h-9.06l-2.42-3H8.85L3.23 25.27c3.23 2.97 13.49 6.57 26.65 6.57s23.44-3.58 26.67-6.57L50.94 2.82z" fill="#fff" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M25.75 8.3h8.34" fill="none" stroke="#000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st12" d="m31.01 21.24-1.56-.87-1.35.78-.39-2.39 2.01-1.03 1.89 1.17-.6 2.34z"/>
|
||||||
|
<path class="st12" d="m32.08 15.12 1.38 1.68-3.96 2.77-1.53-3.91-2.01-.52m2.14 6.01-1.4 2.03 2.9 1.48m-15.71-5.94 3.42-2.91 5.16 3.73h5.23m.01.03 10.92 1.39 5.66 2.78 4.87-2.07"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
12
src/assets/img/icons/windshield-split-full.svg
Normal file
12
src/assets/img/icons/windshield-split-full.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 66.92 38.79" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st14,.st16{fill:#fff;stroke:#000;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}.st16{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st14" d="M57.17 3.32H41.29l-2.73 3.39h-10.2l-2.72-3.39H9.75l-6.33 25.3c3.64 3.37 15.21 7.4 30.03 7.4 14.83 0 26.4-4.05 30.03-7.4l-6.31-25.3z"/>
|
||||||
|
<path d="M63.49 28.62c-3.64 3.35-15.2 7.4-30.03 7.4-14.84 0-26.41-4.03-30.04-7.4l6.33-25.3h15.88l2.72 3.39h10.21l2.73-3.39h15.88l6.32 25.3z" fill="#d92d27" stroke="#000" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st16" d="M59.02 32.75a9.77 9.77 0 0 0-1.36-3.84 9.733 9.733 0 0 0-2.81-2.94c-1.13-.77-2.42-1.3-3.77-1.54s-2.74-.19-4.07.14-2.58.94-3.66 1.79a9.583 9.583 0 0 0-2.6 3.13 9.627 9.627 0 0 0-1.09 3.92 9.73 9.73 0 0 0 .61 4.03"/>
|
||||||
|
<path class="st16" d="M56.59 33.99c0-1.07-.23-2.12-.68-3.08a7.253 7.253 0 0 0-1.93-2.5c-.82-.68-1.78-1.17-2.81-1.43s-2.11-.3-3.16-.1c-1.05.2-2.03.63-2.89 1.26a7.201 7.201 0 0 0-2.44 8.52"/>
|
||||||
|
<path class="st16" d="M59.02 32.75a9.77 9.77 0 0 0-1.36-3.84 9.733 9.733 0 0 0-2.81-2.94c-1.13-.77-2.42-1.3-3.77-1.54s-2.74-.19-4.07.14-2.58.94-3.66 1.79a9.583 9.583 0 0 0-2.6 3.13 9.627 9.627 0 0 0-1.09 3.92 9.73 9.73 0 0 0 .61 4.03"/>
|
||||||
|
<path class="st16" d="M56.59 33.99c0-1.07-.23-2.12-.68-3.08a7.253 7.253 0 0 0-1.93-2.5c-.82-.68-1.78-1.17-2.81-1.43s-2.11-.3-3.16-.1c-1.05.2-2.03.63-2.89 1.26a7.201 7.201 0 0 0-2.44 8.52"/>
|
||||||
|
<path class="st14" d="M59.73 2.68c-.19-.61-.58-1.14-1.1-1.51-.52-.37-1.15-.56-1.79-.55H10.08c-.64-.01-1.27.18-1.79.55-.52.37-.91.9-1.1 1.51L.62 29.52c4.04 3.7 16.31 8.64 32.84 8.64 16.52 0 28.79-4.95 32.84-8.64L59.73 2.68zM33.45 36.02c-14.82 0-26.39-4.03-30.03-7.4l6.33-25.3h15.88l2.72 3.39h10.21l2.73-3.39h15.88l6.32 25.29c-3.64 3.35-15.2 7.4-30.03 7.4h-.01z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.9 KiB |
12
src/assets/img/icons/windshield-split-left.svg
Normal file
12
src/assets/img/icons/windshield-split-left.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 66.92 38.79" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st16,.st17{stroke:#000;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;fill:#fff}.st17{fill:none}
|
||||||
|
</style>
|
||||||
|
<path class="st16" d="M63.49 28.62c-3.64 3.35-15.2 7.4-30.03 7.4V6.71h5.12l2.73-3.39h15.88l6.3 25.3z"/>
|
||||||
|
<path class="st17" d="M59.02 32.75a9.77 9.77 0 0 0-1.36-3.84 9.733 9.733 0 0 0-2.81-2.94c-1.13-.77-2.42-1.3-3.77-1.54s-2.74-.19-4.07.14-2.58.94-3.66 1.79a9.583 9.583 0 0 0-2.6 3.13 9.627 9.627 0 0 0-1.09 3.92 9.73 9.73 0 0 0 .61 4.03"/>
|
||||||
|
<path class="st17" d="M56.58 33.99c0-1.07-.23-2.12-.68-3.08a7.253 7.253 0 0 0-1.93-2.5c-.82-.68-1.78-1.17-2.81-1.43s-2.11-.3-3.16-.1c-1.05.2-2.03.63-2.89 1.26a7.201 7.201 0 0 0-2.44 8.52"/>
|
||||||
|
<path class="st16" d="M59.73 2.68c-.19-.61-.58-1.14-1.1-1.51-.52-.37-1.15-.56-1.79-.55H10.08c-.64-.01-1.27.18-1.79.55-.52.37-.91.9-1.1 1.51L.62 29.52c4.04 3.7 16.31 8.64 32.84 8.64 16.52 0 28.79-4.95 32.84-8.64L59.73 2.68zM33.45 36.02V6.71h5.12l2.73-3.39h15.88l6.32 25.29c-3.64 3.35-15.2 7.4-30.03 7.4h-.02z"/>
|
||||||
|
<path d="M33.45 6.71h-5.09l-2.72-3.39H9.75l-6.33 25.3c3.64 3.37 15.21 7.4 30.03 7.4" fill="#d92d27"/>
|
||||||
|
<path class="st17" d="M33.45 6.71h-5.09l-2.72-3.39H9.75l-6.33 25.3c3.64 3.37 15.21 7.4 30.03 7.4"/>
|
||||||
|
<path d="M33.65 6.76v29" fill="none" stroke="#000" stroke-width="1.25"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.4 KiB |
10
src/assets/img/icons/windshield-split-right.svg
Normal file
10
src/assets/img/icons/windshield-split-right.svg
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 66.92 38.79" xml:space="preserve">
|
||||||
|
<style>
|
||||||
|
.st17{stroke:#000;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;fill:none}
|
||||||
|
</style>
|
||||||
|
<path d="M63.49 28.62c-3.64 3.35-15.2 7.4-30.03 7.4V6.71h5.12l2.73-3.39h15.88l6.3 25.3z" fill="#d92d27" stroke="#000" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st17" d="M59.02 32.75a9.77 9.77 0 0 0-1.36-3.84 9.733 9.733 0 0 0-2.81-2.94c-1.13-.77-2.42-1.3-3.77-1.54s-2.74-.19-4.07.14-2.58.94-3.66 1.79a9.583 9.583 0 0 0-2.6 3.13 9.627 9.627 0 0 0-1.09 3.92 9.73 9.73 0 0 0 .61 4.03"/>
|
||||||
|
<path class="st17" d="M56.58 33.99c0-1.07-.23-2.12-.68-3.08a7.253 7.253 0 0 0-1.93-2.5c-.82-.68-1.78-1.17-2.81-1.43s-2.11-.3-3.16-.1c-1.05.2-2.03.63-2.89 1.26a7.201 7.201 0 0 0-2.44 8.52"/>
|
||||||
|
<path d="M59.73 2.68c-.19-.61-.58-1.14-1.1-1.51-.52-.37-1.15-.56-1.79-.55H10.08c-.64-.01-1.27.18-1.79.55-.52.37-.91.9-1.1 1.51L.62 29.52c4.04 3.7 16.31 8.64 32.84 8.64 16.52 0 28.79-4.95 32.84-8.64L59.73 2.68zM33.45 36.02V6.71h5.12l2.73-3.39h15.88l6.32 25.29c-3.64 3.35-15.2 7.4-30.03 7.4h-.02z" fill="#fff" stroke="#000" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path class="st17" d="M33.45 6.71h-5.09l-2.72-3.39H9.75l-6.33 25.3c3.64 3.37 15.21 7.4 30.03 7.4"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.3 KiB |
|
|
@ -2,7 +2,6 @@ import { shallowMount } from "@vue/test-utils";
|
||||||
import buttonBack from "./button-back";
|
import buttonBack from "./button-back";
|
||||||
|
|
||||||
describe("back button", () => {
|
describe("back button", () => {
|
||||||
|
|
||||||
test("renders a button", () => {
|
test("renders a button", () => {
|
||||||
// Arrange
|
// Arrange
|
||||||
const myFunction = () => {};
|
const myFunction = () => {};
|
||||||
|
|
@ -14,10 +13,9 @@ describe("back button", () => {
|
||||||
backButtonAccessibleText: "something",
|
backButtonAccessibleText: "something",
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
// Assert
|
// Assert
|
||||||
expect(wrapper.find("button").exists()).toBe(true);
|
expect(wrapper.find("button").exists()).toBe(true);
|
||||||
wrapper.unmount();
|
wrapper.unmount();
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,38 @@
|
||||||
<template>
|
<template>
|
||||||
<button
|
<button
|
||||||
@click="handleClick"
|
@click="handleClick"
|
||||||
class="back-button-wrapper p-3"
|
class="back-button-wrapper"
|
||||||
:aria-label="backButtonAccessibleText"
|
:aria-label="backButtonAccessibleText"
|
||||||
>
|
>
|
||||||
<div class="button-back">
|
<svg
|
||||||
<div class="arrow-left"></div>
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
<div class="box"></div>
|
width="34px"
|
||||||
</div>
|
height="30px"
|
||||||
|
viewBox="-2.2 -6 30 30"
|
||||||
|
>
|
||||||
|
<g id="Layer_3">
|
||||||
|
<path
|
||||||
|
class="outer"
|
||||||
|
fill="#FFFFFF"
|
||||||
|
d="M19.934-1.434h-8.486c-1.683,0-2.999,0.528-4.021,1.614L1.685,6.146C0.78,7.079,0.338,8.027,0.338,9.041
|
||||||
|
c0,1.028,0.444,1.979,1.359,2.908l5.753,5.938c1.054,1.093,2.403,1.647,4.007,1.647l8.475,0.01c2.861,0,4.568-1.692,4.568-4.528
|
||||||
|
V3.094C24.5,0.259,22.793-1.434,19.934-1.434L19.934-1.434z"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
<g id="Layer_2">
|
||||||
|
<path
|
||||||
|
class="inner"
|
||||||
|
fill="#727676"
|
||||||
|
d="M19.934,17.989c2.041,0,3.066-1.006,3.066-3.028V3.039c0-2.022-1.025-3.028-3.066-3.028h-8.486
|
||||||
|
c-1.143,0-2.129,0.292-2.929,1.143L2.766,7.13C2.131,7.784,1.838,8.37,1.838,8.985c0,0.605,0.283,1.201,0.928,1.855l5.762,5.947
|
||||||
|
c0.811,0.84,1.787,1.191,2.93,1.191L19.934,17.989z M10.773,13.253c-0.439,0-0.801-0.371-0.801-0.82
|
||||||
|
c0-0.215,0.078-0.42,0.235-0.566l2.861-2.861l-2.861-2.862c-0.156-0.156-0.234-0.352-0.234-0.566c0-0.458,0.362-0.801,0.801-0.801
|
||||||
|
c0.224,0,0.41,0.069,0.556,0.225l2.881,2.872l2.891-2.881c0.166-0.166,0.353-0.234,0.566-0.234c0.439,0,0.801,0.352,0.801,0.801
|
||||||
|
c0,0.225-0.078,0.4-0.234,0.576l-2.871,2.871l2.861,2.852c0.146,0.156,0.234,0.352,0.234,0.576c0,0.449-0.361,0.82-0.811,0.82
|
||||||
|
c-0.225,0-0.43-0.098-0.586-0.244l-2.852-2.871l-2.852,2.871C11.203,13.165,10.999,13.253,10.773,13.253z"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -19,71 +44,39 @@ export default {
|
||||||
type: String,
|
type: String,
|
||||||
required: true,
|
required: true,
|
||||||
default: "",
|
default: "",
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleClick() {
|
handleClick() {
|
||||||
this.$emit('click-event');
|
this.$emit("click-event");
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.back-button-wrapper {
|
.back-button-wrapper {
|
||||||
|
padding: 0;
|
||||||
|
position: relative;
|
||||||
|
top: -1px;
|
||||||
|
margin-left: 2px;
|
||||||
border: none;
|
border: none;
|
||||||
background: transparent;
|
background: none;
|
||||||
text-decoration: none;
|
|
||||||
border-bottom: none;
|
|
||||||
// Account for padding while still being inline with heading text (for cases where text wraps to 2 lines)
|
|
||||||
margin-bottom: -.75rem;
|
|
||||||
margin-top: -.75rem;
|
|
||||||
|
|
||||||
.button-back {
|
&:focus {
|
||||||
display: inline-flex;
|
outline: none;
|
||||||
position: relative;
|
|
||||||
height: 18px;
|
svg .outer {
|
||||||
width: 23px;
|
fill: $white;
|
||||||
overflow: hidden;
|
stroke-width: 2.5px;
|
||||||
// Account for padding while still being inline with heading text (for cases where text wraps to 2 lines)
|
stroke: $blue;
|
||||||
margin-bottom: -2px;
|
stroke-linecap: round;
|
||||||
.arrow-left {
|
stroke-linejoin: round;
|
||||||
position: absolute;
|
transform: translate(-2.7px, -1.8px) scale(1.2);
|
||||||
width: 18px;
|
|
||||||
height: 18px;
|
|
||||||
left: 4px;
|
|
||||||
background-color: $gray-550;
|
|
||||||
transform: rotate(45deg);
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
.box {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
background: $gray-550;
|
|
||||||
height: 100%;
|
|
||||||
width: 11px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
left: 12px;
|
|
||||||
border-radius: 5px;
|
|
||||||
&:before, &:after {
|
|
||||||
position: absolute;
|
|
||||||
left: 1px;
|
|
||||||
top: 3px;
|
|
||||||
content: " ";
|
|
||||||
height: 12px;
|
|
||||||
width: 2px;
|
|
||||||
background-color: $white;
|
|
||||||
border-radius: 2px;
|
|
||||||
}
|
|
||||||
&:before {
|
|
||||||
transform: rotate(45deg);
|
|
||||||
}
|
|
||||||
&:after {
|
|
||||||
transform: rotate(-45deg);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&:focus-visible {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -1,23 +1,73 @@
|
||||||
import { shallowMount } from "@vue/test-utils";
|
import { shallowMount } from "@vue/test-utils";
|
||||||
import buttonQuestion from "@/common-components/button-question/button-question";
|
import buttonQuestion from "@/common-components/button-question/button-question";
|
||||||
|
import { nextTick } from "vue";
|
||||||
|
|
||||||
describe("buttonQuestion.vue", () => {
|
describe("buttonQuestion.vue", () => {
|
||||||
it("Should render the 'questionText' prop value as a span value for the button question and the 'answer' values should render as text values for button components.", async () => {
|
it("Should show overflow classes on fieldset if isOverflowScrollable is true", async () => {
|
||||||
// Act
|
// Act
|
||||||
const wrapper = shallowMount(buttonQuestion);
|
const wrapper = shallowMount(buttonQuestion);
|
||||||
await wrapper.setProps({
|
await wrapper.setProps({
|
||||||
questionText: "Question Text",
|
isOverflowScrollable: true,
|
||||||
answers: ["2023", "2022", "2021"],
|
|
||||||
modelValue: "2020",
|
|
||||||
});
|
});
|
||||||
wrapper.vm.chooseAnswer("2021");
|
|
||||||
|
|
||||||
// Assert
|
// Assert
|
||||||
expect(wrapper.find(".text-center").text()).toEqual(
|
const fieldSet = wrapper.find('fieldset');
|
||||||
"Question Text"
|
expect(fieldSet.classes()).toContain("overflow-scroll");
|
||||||
);
|
|
||||||
const buttonButtons = wrapper.findAllComponents('[data-test="button"]');
|
|
||||||
expect(buttonButtons.length).toBe(3);
|
|
||||||
expect(wrapper.props().modelValue).toBe("2020");
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe("buttonQuestion.vue", () => {
|
||||||
|
it("Fieldset classes should contain row if button type is listCard", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(buttonQuestion);
|
||||||
|
await wrapper.setProps({
|
||||||
|
buttonType: "listCard",
|
||||||
|
});
|
||||||
|
// Assert
|
||||||
|
const Div = wrapper.find('fieldset div');
|
||||||
|
expect(Div.classes()).toContain("row");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("buttonQuestion.vue", () => {
|
||||||
|
it("Fieldset classes should contain d-flex if button type is listButtonHorizontal", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(buttonQuestion);
|
||||||
|
await wrapper.setProps({
|
||||||
|
buttonType: "listButtonHorizontal",
|
||||||
|
});
|
||||||
|
// Assert
|
||||||
|
const Div = wrapper.find('fieldset div');
|
||||||
|
expect(Div.classes()).toContain("d-flex");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("buttonQuestion.vue", () => {
|
||||||
|
it("Should trigger event modelValue change to new value on when radio button selected", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(buttonQuestion);
|
||||||
|
await wrapper.setProps({
|
||||||
|
answers: ["2022", "2021", "2020"],
|
||||||
|
isMultiSelect: false
|
||||||
|
});
|
||||||
|
const val = {isChecked: true, buttonId: "2021", }
|
||||||
|
wrapper.vm.handleCheckedChanged(val);
|
||||||
|
// Assert
|
||||||
|
expect(wrapper.emitted()["update:modelValue"][0]).toEqual([["2021"]]);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("buttonQuestion.vue", () => {
|
||||||
|
it("Should add values to array on checkbox click", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(buttonQuestion);
|
||||||
|
await wrapper.setProps({
|
||||||
|
modelValue: ["2022", "2021", "2020"],
|
||||||
|
isMultiSelect: true
|
||||||
|
});
|
||||||
|
const val = {isChecked: true, buttonId: "2019", }
|
||||||
|
wrapper.vm.handleCheckedChanged(val);
|
||||||
|
// Assert
|
||||||
|
expect(wrapper.emitted()["update:modelValue"][0]).toEqual([["2022", "2021", "2020", "2019"]]);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,27 +1,39 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="button_question">
|
<div :class="isOverflowScrollable ? 'button_question' : ''">
|
||||||
<div class="mt-6 mb-4 d-flex">
|
<div v-if="questionText" class="mt-6 mb-4 d-flex">
|
||||||
<span class="text-center fs-6 fw-bold w-100">{{
|
<span class="text-center fs-6 fw-bold w-100">{{ questionText }}</span>
|
||||||
questionText
|
|
||||||
}}</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="w-100 d-flex justify-content-center">
|
<div class="w-100 d-flex justify-content-center">
|
||||||
<fieldset class="overflow-scroll position-absolute container-fluid w-100 pt-1 px-5 py-0" role="radiogroup">
|
<fieldset class="w-100" :class="getFieldSetClasses" role="radiogroup" :aria-labelledby="groupName ? groupName + '-radio-group' : ''">
|
||||||
<legend class="sr-only">{{groupName}}</legend>
|
<legend class="sr-only">{{groupName}}</legend>
|
||||||
<listButton v-for="answer in answers" :key="answer"
|
<div :class="getComponentWrapperClasses">
|
||||||
:buttonID="answer"
|
<component
|
||||||
@mouseup="chooseAnswer(answer)"
|
:is="buttonType"
|
||||||
@keyup.space="chooseAnswer(answer)"
|
v-for="answer in answers"
|
||||||
loaderColor="blue"
|
:key="answer.Name ? answer.Name : answer"
|
||||||
loaderPosition="right"
|
@isCheckedChanged="handleCheckedChanged"
|
||||||
sizeInRem="1.5"
|
:buttonID="answer.Name ? answer.Name : answer"
|
||||||
data-test="button"
|
:value="answer.Name ? answer.Name : answer"
|
||||||
:groupName="groupName"
|
:buttonLabel="answer.Text ? answer.Text : answer"
|
||||||
textPosition="text-start"
|
:buttonLabelSubCopy="answer.SubText"
|
||||||
:isRequired="true"
|
:textPosition="textPosition"
|
||||||
:value="modelValue"
|
:isMultiSelect="isMultiSelect"
|
||||||
screenReaderOnlyText="(opens new window)"
|
:groupName="groupName"
|
||||||
/>
|
:loaderEnabled="loaderEnabled"
|
||||||
|
:loaderColor="loaderColor"
|
||||||
|
:loaderPosition="loaderPosition"
|
||||||
|
:sizeInRem="sizeInRem"
|
||||||
|
:isWide="isWide"
|
||||||
|
:isRequired="isRequired"
|
||||||
|
:buttonImage="answer.AnswerImageUrl"
|
||||||
|
:buttonImageId="answer.ImageId"
|
||||||
|
:altText="answer.Name ? answer.Name : answer"
|
||||||
|
screenReaderOnlyText="(opens new window)"
|
||||||
|
:colLength="this.answers.length < 3 ? '' : '-4'"
|
||||||
|
:selectedButtonIDs="selectedValues"
|
||||||
|
data-test="button"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -29,28 +41,102 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import listButton from "@/ux-components/list-button/list-button";
|
import listButton from "@/ux-components/list-button/list-button";
|
||||||
|
import listButtonHorizontal from "@/ux-components/list-button-horizontal/list-button-horizontal";
|
||||||
|
import listCard from "@/ux-components/list-card/list-card";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "buttonQuestion",
|
name: "buttonQuestion",
|
||||||
props: {
|
props: {
|
||||||
|
buttonType: {
|
||||||
|
type: String,
|
||||||
|
default: "listButton",
|
||||||
|
},
|
||||||
isMultiSelect: Boolean,
|
isMultiSelect: Boolean,
|
||||||
|
groupName: String,
|
||||||
questionText: String,
|
questionText: String,
|
||||||
answers: Array,
|
answers: Array,
|
||||||
modelValue: String,
|
textPosition: {
|
||||||
groupName: String
|
type: String,
|
||||||
|
default: "text-center",
|
||||||
|
},
|
||||||
|
loaderEnabled: Boolean,
|
||||||
|
loaderColor: {
|
||||||
|
type: String,
|
||||||
|
default: "blue",
|
||||||
|
},
|
||||||
|
loaderPosition: {
|
||||||
|
type: String,
|
||||||
|
default: "right",
|
||||||
|
},
|
||||||
|
sizeInRem: {
|
||||||
|
type: [String, Number],
|
||||||
|
default: 1.5,
|
||||||
|
},
|
||||||
|
isRequired: Boolean,
|
||||||
|
isOverflowScrollable: Boolean,
|
||||||
|
isWide: Boolean,
|
||||||
|
modelValue: Array,
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getFieldSetClasses() {
|
||||||
|
return this.isOverflowScrollable
|
||||||
|
? "container-fluid overflow-scroll position-absolute px-5 pt-1 py-0"
|
||||||
|
: "";
|
||||||
|
},
|
||||||
|
getComponentWrapperClasses() {
|
||||||
|
let classes;
|
||||||
|
switch (this.buttonType) {
|
||||||
|
case "listButton":
|
||||||
|
classes = "w-100";
|
||||||
|
break;
|
||||||
|
case "listButtonHorizontal":
|
||||||
|
classes = "d-flex flex-row p-0";
|
||||||
|
break;
|
||||||
|
case 'listCard':
|
||||||
|
classes = 'row justify-content-center g-2'
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return classes;
|
||||||
|
},
|
||||||
|
selectedValues: {
|
||||||
|
get: function() {
|
||||||
|
return this.modelValue;
|
||||||
|
},
|
||||||
|
set: function(newValue) {
|
||||||
|
this.$emit("update:modelValue", newValue);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
if(Array.isArray(this.answers) && this.answers.length === 1) {
|
||||||
|
const newSelectedValues = this.selectedValues;
|
||||||
|
newSelectedValues.push(typeof(this.answers[0]) === 'object' ? this.answers[0].Name : this.answers[0]);
|
||||||
|
this.selectedValues = newSelectedValues;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
chooseAnswer(answer) {
|
handleCheckedChanged(val) {
|
||||||
this.$emit("update:modelValue", answer);
|
if(this.isMultiSelect) {
|
||||||
|
// Add or remove item to array of data to emit
|
||||||
|
const newSelectedValues = this.selectedValues;
|
||||||
|
val.isChecked ? newSelectedValues.push(val.buttonId) : newSelectedValues.splice(newSelectedValues.indexOf(val.buttonId), 1);
|
||||||
|
this.selectedValues = newSelectedValues;
|
||||||
|
} else {
|
||||||
|
this.selectedValues = [val.buttonId]
|
||||||
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
listButton,
|
listButton,
|
||||||
|
listButtonHorizontal,
|
||||||
|
listCard,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.button_question {
|
.button_question {
|
||||||
|
color: $black;
|
||||||
height: calc(100vh - 280px);
|
height: calc(100vh - 280px);
|
||||||
|
|
||||||
.overflow-scroll {
|
.overflow-scroll {
|
||||||
|
|
|
||||||
95
src/common-components/funnel-footer/funnel-footer.spec.js
Normal file
95
src/common-components/funnel-footer/funnel-footer.spec.js
Normal file
|
|
@ -0,0 +1,95 @@
|
||||||
|
import { mount } from "@vue/test-utils";
|
||||||
|
import funnelFooter from "./funnel-footer";
|
||||||
|
|
||||||
|
describe("funnel-footer.vue", () => {
|
||||||
|
|
||||||
|
it("Should return footer-link class", async () => {
|
||||||
|
// Act
|
||||||
|
|
||||||
|
const r = {
|
||||||
|
test:"testing",
|
||||||
|
clientHeight: 10,
|
||||||
|
classList: {
|
||||||
|
add: jest.fn(() => ''),
|
||||||
|
remove: jest.fn()
|
||||||
|
},
|
||||||
|
};
|
||||||
|
global.document.getElementById = jest.fn().mockImplementation(()=> {
|
||||||
|
return r;
|
||||||
|
});
|
||||||
|
|
||||||
|
const wrapper = mount(funnelFooter, {
|
||||||
|
propsData: {
|
||||||
|
footer: true
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
const link = wrapper.find("a");
|
||||||
|
|
||||||
|
// Expect
|
||||||
|
expect(link.attributes('class')).toContain("footer-link");
|
||||||
|
expect(global.document.getElementById).toBeCalled();
|
||||||
|
expect(r.classList.add).toBeCalledWith("justify-content-end");
|
||||||
|
expect(r.classList.remove).toBeCalledWith("justify-content-start");
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
it("Should return link text", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = mount(funnelFooter, {
|
||||||
|
propsData: {
|
||||||
|
text: "Terms of use",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
const link = wrapper.find("a");
|
||||||
|
|
||||||
|
expect(link.text()).toEqual("Terms of use");
|
||||||
|
});
|
||||||
|
|
||||||
|
it("Should return class btn-primary", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = mount(funnelFooter, {
|
||||||
|
propsData: {
|
||||||
|
isPrimary: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
const input = wrapper.find("button");
|
||||||
|
|
||||||
|
// Expect
|
||||||
|
expect(input.attributes("class")).toContain("btn-primary");
|
||||||
|
});
|
||||||
|
|
||||||
|
it("Should return class justify-content-end if paddingHeight < 80px", async () => {
|
||||||
|
|
||||||
|
global.document.getElementById = jest.fn().mockImplementation(()=> {
|
||||||
|
return {
|
||||||
|
test:"testing",
|
||||||
|
clientHeight: 10,
|
||||||
|
classList: {
|
||||||
|
add: jest.fn(),
|
||||||
|
remove: jest.fn()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Act
|
||||||
|
const wrapper = mount(funnelFooter, {
|
||||||
|
propsData: {
|
||||||
|
footer: true
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const infoBox = document.getElementById('infoBox');
|
||||||
|
// Assert
|
||||||
|
const stacked = wrapper.find("#stacked");
|
||||||
|
wrapper.vm.paddingHeight = 100;
|
||||||
|
|
||||||
|
// Expect
|
||||||
|
expect(stacked.attributes('class')).toContain("justify-content-end");
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
104
src/common-components/funnel-footer/funnel-footer.vue
Normal file
104
src/common-components/funnel-footer/funnel-footer.vue
Normal file
|
|
@ -0,0 +1,104 @@
|
||||||
|
<template>
|
||||||
|
<div class="container-fluid g-2 footer">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12 d-flex justify-content-center pb-2 fs-7">
|
||||||
|
© <span id="years"></span> Safelite Group
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row" :style="`padding-bottom: ${paddingHeight}px`">
|
||||||
|
<div class="col d-flex justify-content-center justify-content-around text-center">
|
||||||
|
<textLink
|
||||||
|
footer=true
|
||||||
|
text="Terms of use"
|
||||||
|
href="https://www.safelite.com/terms-of-use"
|
||||||
|
/>
|
||||||
|
<textLink
|
||||||
|
footer=true
|
||||||
|
text="Privacy policy"
|
||||||
|
href="https://www.safelite.com/safelite-group-privacy-policy"
|
||||||
|
/>
|
||||||
|
<textLink
|
||||||
|
footer=true
|
||||||
|
text="Do not sell my information"
|
||||||
|
href="https://privacyportal-cdn.onetrust.com/dsarwebform/d3b95a93-e22e-4d4d-a806-482052406557/9e371601-eae3-4338-9430-b90b9036022b.html"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="container-fluid fixed-bottom g-4 bg-light py-4" id="infoBox">
|
||||||
|
<div class="row d-flex flex-row-reverse align-items-center">
|
||||||
|
<div class="col d-flex justify-content-end" id="stacked">
|
||||||
|
<buttonMain
|
||||||
|
isPrimary
|
||||||
|
buttonText="Button test"
|
||||||
|
loaderColor="white"
|
||||||
|
sizeInRem="1"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col">
|
||||||
|
<textLink
|
||||||
|
navigation=true
|
||||||
|
text="back"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
import textLink from "@/ux-components/text-link/text-link";
|
||||||
|
import buttonMain from "@/ux-components/button-main/button-main";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "funnelFooter",
|
||||||
|
components: {
|
||||||
|
textLink,
|
||||||
|
buttonMain
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
paddingHeight: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.paddingHeight = document.getElementById("infoBox").offsetHeight;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
window.addEventListener('resize', this.onResize);
|
||||||
|
})
|
||||||
|
setTimeout(function(){ // Give it a moment to set the date
|
||||||
|
document.getElementById('years').innerHTML += new Date().getFullYear();
|
||||||
|
}, 100);
|
||||||
|
this.checkHeight();
|
||||||
|
},
|
||||||
|
beforeUnmount() {
|
||||||
|
window.removeEventListener('resize', this.onResize);
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onResize() {
|
||||||
|
this.paddingHeight = document.getElementById("infoBox").offsetHeight;
|
||||||
|
this.checkHeight();
|
||||||
|
},
|
||||||
|
checkHeight() {
|
||||||
|
const parentHeight = document.getElementById('infoBox').clientHeight;
|
||||||
|
const wrapper2 = document.getElementById('stacked');
|
||||||
|
console.log(parentHeight);
|
||||||
|
console.log(wrapper2);
|
||||||
|
if (parentHeight > 80) {
|
||||||
|
wrapper2.classList.add("justify-content-start");
|
||||||
|
wrapper2.classList.remove("justify-content-end");
|
||||||
|
} else {
|
||||||
|
wrapper2.classList.add("justify-content-end");
|
||||||
|
wrapper2.classList.remove("justify-content-start");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
button {
|
||||||
|
min-width: 200px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -21,5 +21,5 @@ describe("funnelHeader", () => {
|
||||||
|
|
||||||
//Mock CMS content
|
//Mock CMS content
|
||||||
const cmsContent = {
|
const cmsContent = {
|
||||||
imageSrc: 'image_url'
|
imageSrc: "image_url",
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1,23 +1,58 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="funnel-header d-flex justify-content-center align-items-center"
|
class="funnel-header d-flex justify-content-center align-items-center flex-column"
|
||||||
v-if="imageSrc"
|
v-if="imageSrc"
|
||||||
>
|
>
|
||||||
<img class="logo-image img-fluid" :src="imageSrc" alt="Safelite logo" />
|
<img class="logo-image img-fluid" :src="imageSrc" alt="Safelite logo" />
|
||||||
</div>
|
</div>
|
||||||
|
<alert
|
||||||
|
class="position-absolute rounded-0 w-100 border-0 shadow-sm"
|
||||||
|
v-if="displayGlobalAlert"
|
||||||
|
:alertClass="globalAlertMessage.type"
|
||||||
|
:alertHeadline="globalAlertMessage.messageHeadline"
|
||||||
|
:alertCopy="globalAlertMessage.messageCopy"
|
||||||
|
v-bind:isDismissible="globalAlertMessage.isDismissible"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import alert from "@/ux-components/alert/alert";
|
||||||
|
import eventBus from "@/helpers/event-bus/event-bus";
|
||||||
|
import { globalEvents } from "@/constants/events";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "funnel-header",
|
name: "funnel-header",
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
imageSrc: '',
|
imageSrc: "",
|
||||||
}
|
displayGlobalAlert: false,
|
||||||
|
globalAlertMessage: {
|
||||||
|
isDismissible: false,
|
||||||
|
messageCopy: "",
|
||||||
|
messageHeadline: "",
|
||||||
|
type: "",
|
||||||
|
},
|
||||||
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
initializeComponent(cmsContent) {
|
initializeComponent(cmsContent) {
|
||||||
this.imageSrc = cmsContent.LogoImage;
|
this.imageSrc = cmsContent.LogoImage;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
alert,
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// Check if alert event is on the bus
|
||||||
|
const alertEvent = eventBus.readAndPopEventFromBus(
|
||||||
|
globalEvents.Categories.GLOBAL_ALERT,
|
||||||
|
globalEvents.SubCategories.PAGE_NOT_FOUND
|
||||||
|
);
|
||||||
|
|
||||||
|
// If alert event is on the bus, then display the alert
|
||||||
|
if (alertEvent !== undefined) {
|
||||||
|
this.displayGlobalAlert = true;
|
||||||
|
this.globalAlertMessage = alertEvent;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
@ -27,6 +62,7 @@ export default {
|
||||||
.funnel-header {
|
.funnel-header {
|
||||||
height: 56px;
|
height: 56px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo-image {
|
.logo-image {
|
||||||
max-width: 78px;
|
max-width: 78px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@ describe("FunnelSubHeader.vue", () => {
|
||||||
it("Should render the 'text' data value as a span value for the header span text value.", async () => {
|
it("Should render the 'text' data value as a span value for the header span text value.", async () => {
|
||||||
// Act
|
// Act
|
||||||
const wrapper = shallowMount(FunnelSubHeader);
|
const wrapper = shallowMount(FunnelSubHeader);
|
||||||
await wrapper.setData ({
|
await wrapper.setData({
|
||||||
text: "FunnelSubHeader Content",
|
text: "FunnelSubHeader Content",
|
||||||
});
|
});
|
||||||
wrapper.vm.initializeComponent(cmsContent);
|
wrapper.vm.initializeComponent(cmsContent);
|
||||||
|
|
@ -18,5 +18,5 @@ describe("FunnelSubHeader.vue", () => {
|
||||||
|
|
||||||
//Mock CMS content
|
//Mock CMS content
|
||||||
const cmsContent = {
|
const cmsContent = {
|
||||||
HeaderText: 'FunnelSubHeader Content'
|
HeaderText: "FunnelSubHeader Content",
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="current_car_info-text">
|
<div class="current_car_info-text">
|
||||||
<div class="d-flex align-items-center justify-content-center container-fluid overflow-hidden">
|
<div class="d-flex align-items-center justify-content-center container-fluid overflow-hidden">
|
||||||
<h5 class="text-center fw-normal mb-0">
|
<h5 class="text-center fw-normal mb-0" :class="hasSubText ? 'dark-header' : 'light-header'">
|
||||||
<span>
|
<span>
|
||||||
{{ text }}
|
{{ text }}
|
||||||
</span>
|
</span>
|
||||||
|
|
@ -10,7 +10,14 @@
|
||||||
:backButtonAccessibleText="backButtonAccessibleText"
|
:backButtonAccessibleText="backButtonAccessibleText"
|
||||||
@click-event="clickEvent"
|
@click-event="clickEvent"
|
||||||
/>
|
/>
|
||||||
</h5>
|
</h5>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex align-items-center justify-content-center container-fluid overflow-hidden">
|
||||||
|
<p class="text-center small fw-normal mb-0">
|
||||||
|
<span>
|
||||||
|
{{ subText }}
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -22,38 +29,52 @@ export default {
|
||||||
name: "FunnelSubHeader",
|
name: "FunnelSubHeader",
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
text: '',
|
text: "",
|
||||||
}
|
subText: "",
|
||||||
|
};
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
hasBackButton: Boolean,
|
hasBackButton: Boolean,
|
||||||
backButtonAccessibleText: String,
|
backButtonAccessibleText: String
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
buttonBack,
|
buttonBack,
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
hasSubText(){
|
||||||
|
return this.subText.length > 0;
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
clickEvent() {
|
clickEvent() {
|
||||||
this.$emit('click-event');
|
this.$emit("click-event");
|
||||||
},
|
},
|
||||||
initializeComponent(cmsContent) {
|
initializeComponent(cmsContent) {
|
||||||
this.text = cmsContent.HeaderText;
|
this.text = cmsContent.HeaderText;
|
||||||
}
|
this.subText = cmsContent.HeaderSubText;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
h5 {
|
h5 {
|
||||||
color: $gray-550;
|
line-height: 32px;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
border: none;
|
color: inherit;
|
||||||
background: none;
|
|
||||||
color: inherit;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.back-button-wrapper {
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark-header {
|
||||||
|
color: $black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.light-header {
|
||||||
|
color: $gray-550;
|
||||||
|
}
|
||||||
|
|
||||||
|
p.small {
|
||||||
|
color: $gray-550
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
35
src/common-components/text-input/text-input.spec.js
Normal file
35
src/common-components/text-input/text-input.spec.js
Normal file
|
|
@ -0,0 +1,35 @@
|
||||||
|
import { shallowMount } from "@vue/test-utils";
|
||||||
|
import textInput from "./text-input";
|
||||||
|
|
||||||
|
describe("text-input.vue", () => {
|
||||||
|
it("Should render a text input", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(textInput, {
|
||||||
|
propsData: {
|
||||||
|
name: "test",
|
||||||
|
label: "unit test label",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
const input = wrapper.find("input");
|
||||||
|
|
||||||
|
expect(input.exists()).toBe(true);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("Should return aria-required state", async () => {
|
||||||
|
// Act
|
||||||
|
const wrapper = shallowMount(textInput, {
|
||||||
|
propsData: {
|
||||||
|
name: "test",
|
||||||
|
label: "unit test label",
|
||||||
|
isRequired: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
const input = wrapper.find("input");
|
||||||
|
|
||||||
|
expect(input.attributes()["aria-required"]).toEqual("true");
|
||||||
|
});
|
||||||
|
});
|
||||||
71
src/common-components/text-input/text-input.vue
Normal file
71
src/common-components/text-input/text-input.vue
Normal file
|
|
@ -0,0 +1,71 @@
|
||||||
|
<!-- Simple implementation of an input field -->
|
||||||
|
<template>
|
||||||
|
<div class="d-flex w-50 mb-2" :class="{ 'has-error': !!errorMessage }">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
:name="name"
|
||||||
|
:value="inputValue"
|
||||||
|
:id="name"
|
||||||
|
:aria-required="isRequired"
|
||||||
|
@input="handleChange"
|
||||||
|
@blur="handleBlur"
|
||||||
|
:data-focus-target="name"
|
||||||
|
/>
|
||||||
|
<label
|
||||||
|
:for="name"
|
||||||
|
:aria-labelledby="name"
|
||||||
|
class="d-flex justify-content-center py-3 px-4"
|
||||||
|
>
|
||||||
|
<span class="m-0">{{ label }}</span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div v-show="errorMessage" class="row px-3 form-test-error">
|
||||||
|
{{ errorMessage }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { useField } from "vee-validate";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "textInput",
|
||||||
|
props: {
|
||||||
|
type: {
|
||||||
|
type: String,
|
||||||
|
default: "text",
|
||||||
|
},
|
||||||
|
value: {
|
||||||
|
type: String,
|
||||||
|
default: "",
|
||||||
|
},
|
||||||
|
name: {
|
||||||
|
type: String,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
type: String,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
isRequired: Boolean,
|
||||||
|
},
|
||||||
|
setup(props) {
|
||||||
|
const {
|
||||||
|
value: inputValue,
|
||||||
|
errorMessage,
|
||||||
|
handleBlur,
|
||||||
|
handleChange,
|
||||||
|
meta,
|
||||||
|
} = useField(props.name, undefined, {
|
||||||
|
initialValue: props.value,
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
handleChange,
|
||||||
|
handleBlur,
|
||||||
|
errorMessage,
|
||||||
|
inputValue,
|
||||||
|
meta,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
@ -1,24 +1,120 @@
|
||||||
import { shallowMount } from "@vue/test-utils";
|
import { shallowMount } from "@vue/test-utils";
|
||||||
import vehicleBanner from "./vehicle-banner";
|
import vehicleBanner from "./vehicle-banner";
|
||||||
|
import { getMountOptions } from "@/helpers/unit-test-helper.js";
|
||||||
|
import store from "@/store";
|
||||||
|
import { vehicleCategories } from "@/constants/vehicle-categories.js";
|
||||||
|
|
||||||
|
jest.mock(
|
||||||
|
"@/store",
|
||||||
|
() => {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
{ virtual: true }
|
||||||
|
);
|
||||||
|
|
||||||
describe("vehicleBanner", () => {
|
describe("vehicleBanner", () => {
|
||||||
test("renders the blurrycar image", async () => {
|
test("renders the blurrycar image", async () => {
|
||||||
// Arrange
|
// Arrange
|
||||||
|
const { wrapper, cmsContent } = setupMocks({ displayGenericVehicleImageProp: true, imageUrlValue: "NULL" });
|
||||||
// Act
|
|
||||||
const wrapper = shallowMount(vehicleBanner);
|
//Act
|
||||||
await wrapper.setData ({
|
|
||||||
vehicleImageSrc: "image_url",
|
|
||||||
});
|
|
||||||
wrapper.vm.initializeComponent(cmsContent);
|
wrapper.vm.initializeComponent(cmsContent);
|
||||||
|
|
||||||
// Assert
|
// Assert
|
||||||
expect(wrapper.find("img").attributes("class")).toContain("blurrycar");
|
expect(wrapper.vm.vehicleImageToDisplay).toEqual( "image_url");
|
||||||
|
expect(wrapper.find("img").attributes("class")).toContain("vehicle-image");
|
||||||
wrapper.unmount();
|
wrapper.unmount();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
//Mock CMS content
|
describe("vehicleBanner", () => {
|
||||||
const cmsContent = {
|
test("renders expected vehicle image", async () => {
|
||||||
GenericVehicleImage: 'image_url'
|
// Arrange
|
||||||
};
|
const { wrapper, cmsContent } = setupMocks({ displayGenericVehicleImageProp: false, imageUrlValue: "url_to_vehicle_image" });
|
||||||
|
|
||||||
|
//Act
|
||||||
|
wrapper.vm.initializeComponent(cmsContent);
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(wrapper.vm.vehicleImageToDisplay).toEqual( "url_to_vehicle_image");
|
||||||
|
expect(wrapper.find("img").attributes("class")).toContain("vehicle-image");
|
||||||
|
wrapper.unmount();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("vehicleBanner", () => {
|
||||||
|
test("should render car icon when imageUrl is null and category is default", async () => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper, cmsContent } = setupMocks({ displayGenericVehicleImageProp: false, imageUrlValue: "NULL" });
|
||||||
|
|
||||||
|
//Act
|
||||||
|
wrapper.vm.initializeComponent(cmsContent);
|
||||||
|
var iconUrl = wrapper.vm.vehicleImageToDisplay;
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(iconUrl).toEqual( "car_icon_url");
|
||||||
|
wrapper.unmount();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
const params = [["CAR", "car_icon_url"],
|
||||||
|
["TRUCK", "truck_icon_url"],
|
||||||
|
["VAN", "van_icon_url"],
|
||||||
|
["COMMERCIAL VAN", "commercial_van_icon_url"],
|
||||||
|
["SUV", "suv_icon_url"],
|
||||||
|
["OTHER", "car_icon_url"]];
|
||||||
|
|
||||||
|
describe("vehicleBanner", () => {
|
||||||
|
test.each(params)("renders an icon instead of an image for %s and %s", async (category, expectedIcon) => {
|
||||||
|
// Arrange
|
||||||
|
const { wrapper, cmsContent } = setupMocks({ displayGenericVehicleImageProp: false, imageUrlValue: expectedIcon, categoryValue: category });
|
||||||
|
|
||||||
|
//Act
|
||||||
|
wrapper.vm.initializeComponent(cmsContent);
|
||||||
|
var vehicleIcon = wrapper.vm.getUnmatchedVehicleIcon();
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(wrapper.vm.carUnmatchedVehicleIcon).toEqual(cmsContent.CarUnmatchedVehicleIcon);
|
||||||
|
expect(wrapper.vm.truckUnmatchedVehicleIcon).toEqual(cmsContent.TruckUnmatchedVehicleIcon);
|
||||||
|
expect(wrapper.vm.vanUnmatchedVehicleIcon).toEqual(cmsContent.VanUnmatchedVehicleIcon);
|
||||||
|
expect(wrapper.vm.commercialUnmatchedVehicleIcon).toEqual(cmsContent.CommercialVanUnmatchedVehicleIcon);
|
||||||
|
expect(wrapper.vm.suvUnmatchedVehicleIcon).toEqual(cmsContent.SuvUnmatchedVehicleIcon);
|
||||||
|
|
||||||
|
expect(store.getters.vehicle.category).toEqual(category);
|
||||||
|
expect(wrapper.vm.vehicleImageToDisplay).toEqual(vehicleIcon);
|
||||||
|
expect(wrapper.find("img").attributes("class")).toContain("vehicle-image");
|
||||||
|
wrapper.unmount();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function setupMocks({
|
||||||
|
displayGenericVehicleImageProp,
|
||||||
|
imageUrlValue,
|
||||||
|
categoryValue = "CAR"
|
||||||
|
}) {
|
||||||
|
//Mock store
|
||||||
|
store.dispatch = jest.fn(() => dataFromStoreApi);
|
||||||
|
store.getters = { vehicle: { category: categoryValue, imageUrl: imageUrlValue } };
|
||||||
|
const mountOptions = getMountOptions({
|
||||||
|
store: {
|
||||||
|
dispatch: store.dispatch,
|
||||||
|
getters: store.getters,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
//Mock props
|
||||||
|
mountOptions.propsData = { displayGenericVehicleImage: displayGenericVehicleImageProp };
|
||||||
|
|
||||||
|
const wrapper = shallowMount(vehicleBanner, mountOptions);
|
||||||
|
|
||||||
|
//Mock CMS content
|
||||||
|
const cmsContent = {
|
||||||
|
GenericVehicleImage: "image_url",
|
||||||
|
CarUnmatchedVehicleIcon: "car_icon_url",
|
||||||
|
TruckUnmatchedVehicleIcon: "truck_icon_url",
|
||||||
|
VanUnmatchedVehicleIcon: "van_icon_url",
|
||||||
|
CommercialVanUnmatchedVehicleIcon: "commercial_van_icon_url",
|
||||||
|
SuvUnmatchedVehicleIcon: "suv_icon_url",
|
||||||
|
};
|
||||||
|
return { wrapper, cmsContent };
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="vehicle_banner mb-3 text-center">
|
<div class="vehicle_banner mb-3 text-center">
|
||||||
<img
|
<img
|
||||||
class="vehicle-image img-fluid blurrycar"
|
class="vehicle-image img-fluid"
|
||||||
:src="vehicleImageSrc"
|
:src="vehicleImageToDisplay"
|
||||||
alt=""
|
alt=""
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -11,21 +11,69 @@
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: "vehicle-banner",
|
name: "vehicle-banner",
|
||||||
|
props: {
|
||||||
|
displayGenericVehicleImage: {
|
||||||
|
type: Boolean,
|
||||||
|
required: true
|
||||||
|
}
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
vehicleImageSrc: '',
|
genericVehicleImage: '',
|
||||||
|
carUnmatchedVehicleIcon: '',
|
||||||
|
truckUnmatchedVehicleIcon: '',
|
||||||
|
vanUnmatchedVehicleIcon: '',
|
||||||
|
commercialUnmatchedVehicleIcon: '',
|
||||||
|
suvUnmatchedVehicleIcon: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
vehicleImageToDisplay(){
|
||||||
|
if (this.displayGenericVehicleImage){
|
||||||
|
return this.genericVehicleImage;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.$store.getters.vehicle.imageUrl === null || this.$store.getters.vehicle.imageUrl === "NULL"){
|
||||||
|
return this.getUnmatchedVehicleIcon();
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.$store.getters.vehicle.imageUrl;
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
initializeComponent(cmsContent) {
|
initializeComponent(cmsContent) {
|
||||||
this.vehicleImageSrc = cmsContent.GenericVehicleImage;
|
this.genericVehicleImage = cmsContent.GenericVehicleImage;
|
||||||
|
this.carUnmatchedVehicleIcon = cmsContent.CarUnmatchedVehicleIcon;
|
||||||
|
this.truckUnmatchedVehicleIcon = cmsContent.TruckUnmatchedVehicleIcon;
|
||||||
|
this.vanUnmatchedVehicleIcon = cmsContent.VanUnmatchedVehicleIcon;
|
||||||
|
this.commercialUnmatchedVehicleIcon = cmsContent.CommercialVanUnmatchedVehicleIcon;
|
||||||
|
this.suvUnmatchedVehicleIcon = cmsContent.SuvUnmatchedVehicleIcon;
|
||||||
|
},
|
||||||
|
getUnmatchedVehicleIcon(){
|
||||||
|
switch(this.$store.getters.vehicle.category){
|
||||||
|
case this.vehicleCategories.CAR:
|
||||||
|
return this.carUnmatchedVehicleIcon;
|
||||||
|
case this.vehicleCategories.SUV:
|
||||||
|
return this.suvUnmatchedVehicleIcon;
|
||||||
|
case this.vehicleCategories.TRUCK:
|
||||||
|
return this.truckUnmatchedVehicleIcon;
|
||||||
|
case this.vehicleCategories.VAN:
|
||||||
|
return this.vanUnmatchedVehicleIcon;
|
||||||
|
case this.vehicleCategories.COMMERCIALVAN:
|
||||||
|
return this.commercialUnmatchedVehicleIcon;
|
||||||
|
default:
|
||||||
|
return this.carUnmatchedVehicleIcon;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.vehicle-image {
|
.vehicle-image {
|
||||||
max-width: 290px;
|
max-width: 290px;
|
||||||
|
object-fit: cover;
|
||||||
|
width: 100%;
|
||||||
|
height: 118px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,10 @@ const endpoints = {
|
||||||
url: "/content/api/v1/content/RouteInfo",
|
url: "/content/api/v1/content/RouteInfo",
|
||||||
method: "POST",
|
method: "POST",
|
||||||
},
|
},
|
||||||
|
GetHomepageInfo: {
|
||||||
|
url: "/content/api/v1/content/HomepageInfo",
|
||||||
|
method: "GET",
|
||||||
|
},
|
||||||
GetVehicleYears: {
|
GetVehicleYears: {
|
||||||
url: "/vehicle/api/v1/vehicle/years",
|
url: "/vehicle/api/v1/vehicle/years",
|
||||||
method: "GET",
|
method: "GET",
|
||||||
|
|
@ -19,6 +23,14 @@ const endpoints = {
|
||||||
url: "/vehicle/api/v1/vehicle/Styles",
|
url: "/vehicle/api/v1/vehicle/Styles",
|
||||||
method: "GET",
|
method: "GET",
|
||||||
},
|
},
|
||||||
|
GetVehicle: {
|
||||||
|
url: "/vehicle/api/v1/vehicle/lookup",
|
||||||
|
method: "GET",
|
||||||
|
},
|
||||||
|
GetDamageOptions: {
|
||||||
|
url: "/parts/api/v1/parts/damage-options",
|
||||||
|
method: "GET",
|
||||||
|
},
|
||||||
GetPageData: {
|
GetPageData: {
|
||||||
url: "/content/api/v1/content",
|
url: "/content/api/v1/content",
|
||||||
method: "GET",
|
method: "GET",
|
||||||
|
|
|
||||||
17
src/constants/events.js
Normal file
17
src/constants/events.js
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
const globalEvents = {
|
||||||
|
Categories: {
|
||||||
|
GLOBAL_ALERT: "GLOBAL_ALERT",
|
||||||
|
},
|
||||||
|
SubCategories: {
|
||||||
|
PAGE_NOT_FOUND: "PAGE_NOT_FOUND",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const globalEventTypes = {
|
||||||
|
Success: "alert-success",
|
||||||
|
Warning: "alert-warning",
|
||||||
|
Info: "alert-info",
|
||||||
|
Danger: "alert-danger",
|
||||||
|
};
|
||||||
|
|
||||||
|
export { globalEvents, globalEventTypes };
|
||||||
|
|
@ -1,13 +1,22 @@
|
||||||
const storeActions = {
|
const storeActions = {
|
||||||
GET_ROUTE_INFO_ACTION: "getRouteInfo",
|
GET_ROUTE_INFO_ACTION: "getRouteInfo",
|
||||||
|
GET_HOMEPAGE_NAME: "getHomepageName",
|
||||||
GET_PAGE_DATA: "getPageData",
|
GET_PAGE_DATA: "getPageData",
|
||||||
GET_VEHICLE_YEARS: "getVehicleYears",
|
GET_VEHICLE_YEARS: "getVehicleYears",
|
||||||
GET_VEHICLE_MAKES: "getVehicleMakes",
|
GET_VEHICLE_MAKES: "getVehicleMakes",
|
||||||
GET_VEHICLE_MODELS: "getVehicleModels",
|
GET_VEHICLE_MODELS: "getVehicleModels",
|
||||||
GET_VEHICLE_STYLES: "getVehicleStyles",
|
GET_VEHICLE_STYLES: "getVehicleStyles",
|
||||||
|
SET_VEHICLE: "setVehicle",
|
||||||
|
GET_DAMAGE_OPTIONS: "getDamageOptions",
|
||||||
GET_EVOX_IMAGE: "getEvoxImage",
|
GET_EVOX_IMAGE: "getEvoxImage",
|
||||||
LOOKUP_VEHICLE_BY_YMMS: "lookupVehicleByYmms",
|
LOOKUP_VEHICLE_BY_YMMS: "lookupVehicleByYmms",
|
||||||
LOOKUP_VEHICLE_BY_VIN: "lookupVehicleByVin",
|
LOOKUP_VEHICLE_BY_VIN: "lookupVehicleByVin",
|
||||||
|
|
||||||
|
// DEPENDENCY MUTATIONS
|
||||||
|
RESET_VEHICLE_AND_DEPS: "resetVehicleAndDependencies",
|
||||||
|
RESET_DAMAGE_AND_DEPS: "resetDamageAndDependencies",
|
||||||
|
RESET_REGISTRATION_AND_DEPS: "resetRegistrationAndDependencies",
|
||||||
|
RESET_PARTS_AND_DEPS: "resetPartsAndDependencies",
|
||||||
};
|
};
|
||||||
|
|
||||||
export { storeActions };
|
export { storeActions };
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,26 @@
|
||||||
const storeMutations = {
|
const storeMutations = {
|
||||||
|
|
||||||
|
// VEHICLE MUTATIONS
|
||||||
UPDATE_YEAR: "updateYear",
|
UPDATE_YEAR: "updateYear",
|
||||||
UPDATE_MAKE: "updateMake",
|
UPDATE_MAKE: "updateMake",
|
||||||
UPDATE_MODEL: "updateModel",
|
UPDATE_MODEL: "updateModel",
|
||||||
UPDATE_STYLE: "updateStyle",
|
UPDATE_STYLE: "updateStyle",
|
||||||
|
UPDATE_CAR_ID: "updateCarId",
|
||||||
|
UPDATE_VEHICLE_CATEGORY: "updateVehicleCategory",
|
||||||
|
UPDATE_VEHICLE_IMAGE_URL: "updateVehicleImageUrl",
|
||||||
|
UPDATE_VEHICLE_IMAGE_VIF_NUMBER: "updateVehicleImageVifNumber",
|
||||||
|
UPDATE_VEHICLE_IMAGE_COLOR: "updateVehicleImageColor",
|
||||||
|
|
||||||
|
// EVENT BUS MUTATIONS
|
||||||
|
ADD_EVENT_TO_BUS: "addEventToBus",
|
||||||
|
REMOVE_EVENT_FROM_BUS: "removeEventFromBus",
|
||||||
|
|
||||||
|
// DEPENDENCY MUTATIONS
|
||||||
|
RESET_VEHICLE_AND_DEPS: "resetVehicleAndDependencies",
|
||||||
|
RESET_DAMAGE_AND_DEPS: "resetDamageAndDependencies",
|
||||||
|
RESET_REGISTRATION_AND_DEPS: "resetRegistrationAndDependencies",
|
||||||
|
RESET_PARTS_AND_DEPS: "resetPartsAndDependencies",
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export { storeMutations };
|
export { storeMutations };
|
||||||
|
|
|
||||||
11
src/constants/vehicle-categories.js
Normal file
11
src/constants/vehicle-categories.js
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
const vehicleCategories = {
|
||||||
|
CAR: "CAR",
|
||||||
|
TRUCK: "TRUCK",
|
||||||
|
VAN: "VAN",
|
||||||
|
COMMERCIALVAN: "COMMERCIAL VAN",
|
||||||
|
SUV: "SUV",
|
||||||
|
MOTORHOME: "MOTOR HOME",
|
||||||
|
SEMI: "SEMI",
|
||||||
|
};
|
||||||
|
|
||||||
|
export { vehicleCategories };
|
||||||
|
|
@ -9,17 +9,27 @@ export function fetchCmsContentForPage(fmgPage) {
|
||||||
const pageDataFromCms = {};
|
const pageDataFromCms = {};
|
||||||
|
|
||||||
response.data.Result.forEach((widget) => {
|
response.data.Result.forEach((widget) => {
|
||||||
|
let widgetWithReplacements = findAndReplaceGlobalStateValues(
|
||||||
|
widget.Model,
|
||||||
|
widget.Name
|
||||||
|
);
|
||||||
|
|
||||||
let widgetWithReplacements = findAndReplaceGlobalStateValues(widget.Model, widget.Type);
|
// If we already have this widget, push it on the collection
|
||||||
|
if (widgetWithReplacements.Name in pageDataFromCms) {
|
||||||
|
pageDataFromCms[widgetWithReplacements.Name].push(
|
||||||
|
widgetWithReplacements.Model
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if (Object.values(widgetNames).includes(widgetWithReplacements.Type)) {
|
pageDataFromCms[widgetWithReplacements.Name] = [
|
||||||
// If we already have this widget, push it on the collection
|
widgetWithReplacements.Model,
|
||||||
if (widgetWithReplacements.Type in pageDataFromCms) {
|
];
|
||||||
pageDataFromCms[widgetWithReplacements.Type].push(widgetWithReplacements.Model);
|
});
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
pageDataFromCms[widgetWithReplacements.Type] = [widgetWithReplacements.Model];
|
Object.keys(pageDataFromCms).forEach((key) => {
|
||||||
|
if (pageDataFromCms[key].length === 1) {
|
||||||
|
pageDataFromCms[key] = pageDataFromCms[key][0];
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -29,31 +39,29 @@ export function fetchCmsContentForPage(fmgPage) {
|
||||||
|
|
||||||
// Function to convert a string, into a matching global state item.
|
// Function to convert a string, into a matching global state item.
|
||||||
function mapStringToState(str) {
|
function mapStringToState(str) {
|
||||||
|
|
||||||
// Pull all matches out of the string.
|
// Pull all matches out of the string.
|
||||||
const regexExp = new RegExp('{(.*?):(.*?)}', 'g');
|
const regexExp = new RegExp("{(.*?):(.*?)}", "g");
|
||||||
const matches = [...str.matchAll(regexExp)];
|
const matches = [...str.matchAll(regexExp)];
|
||||||
|
|
||||||
// Our final string value that will be built from the matches.
|
// Our final string value that will be built from the matches.
|
||||||
let stringBuilder = '';
|
let stringBuilder = "";
|
||||||
|
|
||||||
for (const match of matches) {
|
for (const match of matches) {
|
||||||
|
|
||||||
// Reset store state for each match.
|
// Reset store state for each match.
|
||||||
let storeState = store.state;
|
let storeState = store.state;
|
||||||
|
|
||||||
for (const s of match[2].split('.')) {
|
for (const s of match[2].split(".")) {
|
||||||
if (storeState[s] != undefined) {
|
if (storeState[s] != undefined) {
|
||||||
storeState = storeState[s];
|
storeState = storeState[s];
|
||||||
} else {
|
} else {
|
||||||
return ''; // if we can't map our string to state data, return an empty string.
|
return ""; // if we can't map our string to state data, return an empty string.
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const stringWithReplacement = str.replace(match[0], storeState);
|
const stringWithReplacement = str.replace(match[0], storeState);
|
||||||
|
|
||||||
// If we still have values we need to substitute, call this function again.
|
// If we still have values we need to substitute, call this function again.
|
||||||
if(stringWithReplacement.includes('{globalState:')) {
|
if (stringWithReplacement.includes("{globalState:")) {
|
||||||
return mapStringToState(stringWithReplacement);
|
return mapStringToState(stringWithReplacement);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -66,16 +74,17 @@ function mapStringToState(str) {
|
||||||
|
|
||||||
// Parent function for processWidgetItemForReplacement. This will loop through the parent
|
// Parent function for processWidgetItemForReplacement. This will loop through the parent
|
||||||
// object and pass any objects that need additional processing to the processWidgetItemForReplacement function.
|
// object and pass any objects that need additional processing to the processWidgetItemForReplacement function.
|
||||||
function findAndReplaceGlobalStateValues(widgetModel, widgetType) {
|
function findAndReplaceGlobalStateValues(widgetModel, widgetName) {
|
||||||
|
|
||||||
const objWithReplacements = {
|
const objWithReplacements = {
|
||||||
Type: widgetType,
|
Name: widgetName,
|
||||||
Model: {}
|
Model: {},
|
||||||
};
|
};
|
||||||
|
|
||||||
Object.keys(widgetModel).forEach(key => {
|
Object.keys(widgetModel).forEach((key) => {
|
||||||
|
let modelWithReplacements = processWidgetItemForReplacement(
|
||||||
let modelWithReplacements = processWidgetItemForReplacement(widgetModel, key);
|
widgetModel,
|
||||||
|
key
|
||||||
|
);
|
||||||
|
|
||||||
objWithReplacements.Model[key] = modelWithReplacements;
|
objWithReplacements.Model[key] = modelWithReplacements;
|
||||||
});
|
});
|
||||||
|
|
@ -87,16 +96,19 @@ function findAndReplaceGlobalStateValues(widgetModel, widgetType) {
|
||||||
// This is a recursive function, it will call itself until it runs out of items to iterate on given the object.
|
// This is a recursive function, it will call itself until it runs out of items to iterate on given the object.
|
||||||
function processWidgetItemForReplacement(widgetModel, key) {
|
function processWidgetItemForReplacement(widgetModel, key) {
|
||||||
// If we have a string, and it needs to be replaced.
|
// If we have a string, and it needs to be replaced.
|
||||||
if (typeof widgetModel[key] === 'string') {
|
if (typeof widgetModel[key] === "string") {
|
||||||
if (widgetModel[key].includes('{globalState:')) {
|
if (widgetModel[key].includes("{globalState:")) {
|
||||||
widgetModel[key] = mapStringToState(widgetModel[key]);
|
widgetModel[key] = mapStringToState(widgetModel[key]);
|
||||||
}
|
}
|
||||||
return widgetModel[key];
|
return widgetModel[key];
|
||||||
}
|
}
|
||||||
|
|
||||||
// If we have an object. array, etc
|
// If we have an object. array, etc
|
||||||
if (typeof widgetModel[key] === 'object' && Object.keys(widgetModel[key]).length) {
|
if (
|
||||||
Object.keys(widgetModel[key]).forEach(item => {
|
typeof widgetModel[key] === "object" &&
|
||||||
|
Object.keys(widgetModel[key]).length
|
||||||
|
) {
|
||||||
|
Object.keys(widgetModel[key]).forEach((item) => {
|
||||||
processWidgetItemForReplacement(widgetModel[key], item);
|
processWidgetItemForReplacement(widgetModel[key], item);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -105,5 +117,4 @@ function processWidgetItemForReplacement(widgetModel, key) {
|
||||||
|
|
||||||
// If we have something else like a number, boolean, etc. just return it
|
// If we have something else like a number, boolean, etc. just return it
|
||||||
return widgetModel[key];
|
return widgetModel[key];
|
||||||
|
}
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -4,137 +4,133 @@ import { dispatch } from "@/store";
|
||||||
jest.mock("@/store", () => ({
|
jest.mock("@/store", () => ({
|
||||||
dispatch: jest.fn(),
|
dispatch: jest.fn(),
|
||||||
state: {
|
state: {
|
||||||
order: { vehicle: { year: "2019", make: "Acura" } }
|
order: { vehicle: { year: "2019", make: "Acura" } },
|
||||||
}
|
},
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
describe("cms-content-helper.js", () => {
|
||||||
describe("cms-content-helper.js", () => {
|
|
||||||
it("Should return data from CMS", () => {
|
it("Should return data from CMS", () => {
|
||||||
// Arrange
|
// Arrange
|
||||||
const cmsMockData = {
|
const cmsMockData = {
|
||||||
Result: [
|
Result: [
|
||||||
{
|
{
|
||||||
Type: "FunnelSubHeaderWidget",
|
Name: "FunnelHeaderWidget",
|
||||||
Model: {
|
Model: {
|
||||||
HeaderText: "Select a year to get started",
|
HeaderText: "Select a year to get started",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
Type: "FunnelSubHeaderWidget",
|
Name: "FunnelSubHeaderWidget",
|
||||||
Model: {
|
Model: {
|
||||||
HeaderText: "Select a model",
|
HeaderText: "Select a model",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
Type: "RadioQuestionWidget",
|
Name: "VehicleYearQuestion",
|
||||||
Model: {
|
Model: {
|
||||||
QuestionText: "What year is your vehicle?",
|
QuestionText: "What year is your vehicle?",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
||||||
|
|
||||||
// Act
|
// Act
|
||||||
fetchCmsContentForPage("testPage").then((response) => {
|
fetchCmsContentForPage("testPage").then((response) => {
|
||||||
// Assert
|
// Assert
|
||||||
expect(response.FunnelSubHeaderWidget[0].HeaderText).toEqual(
|
expect(response.FunnelHeaderWidget.HeaderText).toEqual(
|
||||||
"Select a year to get started"
|
"Select a year to get started"
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
describe("cms-content-helper.js", () => {
|
describe("cms-content-helper.js", () => {
|
||||||
it("Should replace strings for global state", () => {
|
it("Should replace strings for global state", () => {
|
||||||
const cmsMockData = {
|
const cmsMockData = {
|
||||||
Result: [
|
Result: [
|
||||||
{
|
{
|
||||||
Type: "FunnelSubHeaderWidget",
|
Name: "FunnelSubHeaderWidget",
|
||||||
Model: {
|
Model: {
|
||||||
HeaderText: "{globalState:order.vehicle.year}",
|
HeaderText: "{globalState:order.vehicle.year}",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
||||||
|
|
||||||
fetchCmsContentForPage("testPage").then((response) => {
|
fetchCmsContentForPage("testPage").then((response) => {
|
||||||
// Assert
|
// Assert
|
||||||
expect(response.FunnelSubHeaderWidget[0].HeaderText).toEqual(
|
expect(response.FunnelSubHeaderWidget.HeaderText).toEqual("2019");
|
||||||
"2019"
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe("cms-content-helper.js", () => {
|
describe("cms-content-helper.js", () => {
|
||||||
it("Should replace strings for global state, and leave others the same", () => {
|
it("Should replace strings for global state, and leave others the same", () => {
|
||||||
|
|
||||||
const cmsMockData = {
|
const cmsMockData = {
|
||||||
Result: [
|
Result: [
|
||||||
{
|
{
|
||||||
Type: "FunnelSubHeaderWidget",
|
Name: "FunnelSubHeaderWidget",
|
||||||
Model: {
|
Model: {
|
||||||
HeaderText: "{globalState:order.vehicle.year}",
|
HeaderText: "{globalState:order.vehicle.year}",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
Type: "RadioQuestionWidget",
|
Name: "VehicleYearQuestion",
|
||||||
Model: {
|
Model: {
|
||||||
ExampleText: "My widget value!",
|
ExampleText: "My widget value!",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
||||||
|
|
||||||
fetchCmsContentForPage("testPage").then((response) => {
|
fetchCmsContentForPage("testPage").then((response) => {
|
||||||
// Assert
|
// Assert
|
||||||
expect(response.FunnelSubHeaderWidget[0].HeaderText).toEqual("2019");
|
expect(response.FunnelSubHeaderWidget.HeaderText).toEqual("2019");
|
||||||
expect(response.RadioQuestionWidget[0].ExampleText).toEqual("My widget value!");
|
expect(response.VehicleYearQuestion.ExampleText).toEqual(
|
||||||
|
"My widget value!"
|
||||||
|
);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe("cms-content-helper.js", () => {
|
describe("cms-content-helper.js", () => {
|
||||||
it("Should replace strings for global state in nested objects", () => {
|
it("Should replace strings for global state in nested objects", () => {
|
||||||
|
|
||||||
const cmsMockData = {
|
const cmsMockData = {
|
||||||
Result: [
|
Result: [
|
||||||
{
|
{
|
||||||
Type: "FunnelSubHeaderWidget",
|
Name: "FunnelSubHeaderWidget",
|
||||||
Model: {
|
Model: {
|
||||||
HeaderText: "{globalState:order.vehicle.year}",
|
HeaderText: "{globalState:order.vehicle.year}",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
Type: "RadioQuestionWidget",
|
Name: "VehicleMakeQuestion",
|
||||||
Model: {
|
Model: {
|
||||||
OtherObjectInside: {
|
OtherObjectInside: {
|
||||||
ExampleText: "{globalState:order.vehicle.make}",
|
ExampleText: "{globalState:order.vehicle.make}",
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
dispatch.mockImplementation(() => Promise.resolve({ data: cmsMockData }));
|
||||||
|
|
||||||
fetchCmsContentForPage("testPage").then((response) => {
|
fetchCmsContentForPage("testPage").then((response) => {
|
||||||
// Assert
|
// Assert
|
||||||
|
|
||||||
expect(response.FunnelSubHeaderWidget[0].HeaderText).toEqual("2019");
|
expect(response.FunnelSubHeaderWidget.HeaderText).toEqual("2019");
|
||||||
expect(response.RadioQuestionWidget[0].OtherObjectInside.ExampleText).toEqual("Acura");
|
expect(
|
||||||
|
response.VehicleMakeQuestion.OtherObjectInside.ExampleText
|
||||||
|
).toEqual("Acura");
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test.todo("String cannot be mapped to global state");
|
test.todo("String cannot be mapped to global state");
|
||||||
|
|
|
||||||
32
src/helpers/event-bus/event-bus.js
Normal file
32
src/helpers/event-bus/event-bus.js
Normal file
|
|
@ -0,0 +1,32 @@
|
||||||
|
import store from "@/store";
|
||||||
|
import { storeMutations } from "@/constants/store-mutations.js";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
// Adds event to the bus given its category, subcategory, and eventValue;
|
||||||
|
addEventToBus(category, subCategory, eventValue) {
|
||||||
|
store.commit(storeMutations.ADD_EVENT_TO_BUS, {
|
||||||
|
category: category,
|
||||||
|
subCategory: subCategory,
|
||||||
|
eventValue: eventValue,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// Finds event on the bus, removes the item, and returns its value to the caller.
|
||||||
|
readAndPopEventFromBus(category, subCategory) {
|
||||||
|
const event = store.getters.eventBusItem(category, subCategory);
|
||||||
|
|
||||||
|
store.commit(storeMutations.REMOVE_EVENT_FROM_BUS, {
|
||||||
|
category: category,
|
||||||
|
subCategory: subCategory,
|
||||||
|
});
|
||||||
|
|
||||||
|
return event;
|
||||||
|
},
|
||||||
|
|
||||||
|
// Finds the event on the bus and returns its value to the caller, does not remove it.
|
||||||
|
readEventFromBus(category, subCategory) {
|
||||||
|
const event = store.getters.eventBusItem(category, subCategory);
|
||||||
|
|
||||||
|
return event;
|
||||||
|
},
|
||||||
|
};
|
||||||
59
src/helpers/event-bus/event-bus.spec.js
Normal file
59
src/helpers/event-bus/event-bus.spec.js
Normal file
|
|
@ -0,0 +1,59 @@
|
||||||
|
import { globalEvents, globalEventTypes } from "@/constants/events";
|
||||||
|
import eventBus from "@/helpers/event-bus/event-bus";
|
||||||
|
import store from "@/store";
|
||||||
|
|
||||||
|
describe("event-bus.js", () => {
|
||||||
|
let event = {
|
||||||
|
isDismissible: true,
|
||||||
|
messageCopy: "You can get a quote by starting on this page.",
|
||||||
|
messageHeadline: "We're sorry, something went wrong.",
|
||||||
|
type: globalEventTypes.Danger,
|
||||||
|
};
|
||||||
|
|
||||||
|
it("Puts item on bus and then take it off", () => {
|
||||||
|
// Arrange / Act
|
||||||
|
eventBus.addEventToBus(
|
||||||
|
globalEvents.Categories.GLOBAL_ALERT,
|
||||||
|
globalEvents.SubCategories.PAGE_NOT_FOUND,
|
||||||
|
event
|
||||||
|
);
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(
|
||||||
|
store.getters.eventBusItem(
|
||||||
|
globalEvents.Categories.GLOBAL_ALERT,
|
||||||
|
globalEvents.SubCategories.PAGE_NOT_FOUND
|
||||||
|
)
|
||||||
|
).toEqual(event);
|
||||||
|
|
||||||
|
expect(store.state.applicationUser.eventBus.length).toEqual(1);
|
||||||
|
|
||||||
|
// Arrange / Act
|
||||||
|
const eventValue = eventBus.readAndPopEventFromBus(
|
||||||
|
globalEvents.Categories.GLOBAL_ALERT,
|
||||||
|
globalEvents.SubCategories.PAGE_NOT_FOUND
|
||||||
|
);
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(eventValue).toEqual(event);
|
||||||
|
|
||||||
|
expect(store.state.applicationUser.eventBus.length).toEqual(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("Reads event from bus, should have event value.", () => {
|
||||||
|
// Arrange / Act
|
||||||
|
eventBus.addEventToBus(
|
||||||
|
globalEvents.Categories.GLOBAL_ALERT,
|
||||||
|
globalEvents.SubCategories.PAGE_NOT_FOUND,
|
||||||
|
event
|
||||||
|
);
|
||||||
|
|
||||||
|
// Assert
|
||||||
|
expect(
|
||||||
|
eventBus.readEventFromBus(
|
||||||
|
globalEvents.Categories.GLOBAL_ALERT,
|
||||||
|
globalEvents.SubCategories.PAGE_NOT_FOUND
|
||||||
|
)
|
||||||
|
).toEqual(event);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import { storeActions } from "@/constants/store-actions";
|
import { storeActions } from "@/constants/store-actions";
|
||||||
import { storeMutations } from "@/constants/store-mutations.js";
|
import { storeMutations } from "@/constants/store-mutations.js";
|
||||||
import { navigationScenarios } from "@/router/router-constants/navigation-scenarios.js";
|
import { navigationScenarios } from "@/router/router-constants/navigation-scenarios.js";
|
||||||
|
import { vehicleCategories } from "@/constants/vehicle-categories.js";
|
||||||
|
|
||||||
export function getMountOptions(mockData) {
|
export function getMountOptions(mockData) {
|
||||||
// Define our mocks to attached to the 'global' object for Vue/Jest.
|
// Define our mocks to attached to the 'global' object for Vue/Jest.
|
||||||
|
|
@ -23,6 +24,7 @@ export function getMountOptions(mockData) {
|
||||||
mocks.storeActions = storeActions;
|
mocks.storeActions = storeActions;
|
||||||
mocks.storeMutations = storeMutations;
|
mocks.storeMutations = storeMutations;
|
||||||
mocks.navigationScenarios = navigationScenarios;
|
mocks.navigationScenarios = navigationScenarios;
|
||||||
|
mocks.vehicleCategories = vehicleCategories;
|
||||||
|
|
||||||
// Mock $store and $router when accessing this.$store/$router
|
// Mock $store and $router when accessing this.$store/$router
|
||||||
mocks.$store = mockData.store;
|
mocks.$store = mockData.store;
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<div class="container-fluid container-shadow p-2 rounded-3">
|
<div class="container-fluid container-shadow p-2 rounded-3">
|
||||||
<div class="row my-3">
|
<div class="row my-3">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<vehicleBanner ref="vehicleBanner" />
|
<vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage=true />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="row my-4">
|
<div class="row my-4">
|
||||||
|
|
@ -83,12 +83,11 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
|
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
|
||||||
export default {
|
export default {
|
||||||
name: "App",
|
name: "App",
|
||||||
components: {
|
components: {
|
||||||
vehicleBanner
|
vehicleBanner,
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
|
@ -98,7 +97,10 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.$refs.vehicleBanner.initializeComponent({GenericVehicleImage: 'https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3'});
|
this.$refs.vehicleBanner.initializeComponent({
|
||||||
|
GenericVehicleImage:
|
||||||
|
"https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3",
|
||||||
|
});
|
||||||
|
|
||||||
let addressField1 = document.getElementById("autocomplete");
|
let addressField1 = document.getElementById("autocomplete");
|
||||||
let self = this;
|
let self = this;
|
||||||
|
|
@ -111,11 +113,11 @@ export default {
|
||||||
|
|
||||||
// Script is loaded, initialize the autocomplete textbox
|
// Script is loaded, initialize the autocomplete textbox
|
||||||
self.autocomplete = new window.google.maps.places.Autocomplete(
|
self.autocomplete = new window.google.maps.places.Autocomplete(
|
||||||
(self.$refs.autocomplete),
|
self.$refs.autocomplete,
|
||||||
{
|
{
|
||||||
componentRestrictions: { country: ["us"] },
|
componentRestrictions: { country: ["us"] },
|
||||||
fields: ["address_components"],
|
fields: ["address_components"],
|
||||||
types: ['address']
|
types: ["address"],
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
@ -210,12 +212,10 @@ export default {
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
// Failed to fetch script
|
// Failed to fetch script
|
||||||
console.log("Unable to load Google Places API script")
|
console.log("Unable to load Google Places API script");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load diff
381
src/layouts/form-test/form-test.vue
Normal file
381
src/layouts/form-test/form-test.vue
Normal file
|
|
@ -0,0 +1,381 @@
|
||||||
|
<template>
|
||||||
|
<Form
|
||||||
|
:validation-schema="schema"
|
||||||
|
@submit="onSubmit"
|
||||||
|
@invalid-submit="onInvalidSubmit"
|
||||||
|
v-slot="{ values, meta }"
|
||||||
|
class="w-50"
|
||||||
|
>
|
||||||
|
<div class="row g-2 mt-6 mx-4">
|
||||||
|
<h2 class="mx-2 mt-4 mb-0">FORM VALIDATION TEST</h2>
|
||||||
|
<p class="mx-2">
|
||||||
|
NOTE: This page is testing functionality only; styling will not match
|
||||||
|
Figma mocks.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row g-2 mt-6 mx-4">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">
|
||||||
|
How many chips are we repairing? (Required)
|
||||||
|
</h4>
|
||||||
|
<fieldset>
|
||||||
|
<div
|
||||||
|
role="radiogroup"
|
||||||
|
aria-labelledby="demo-group"
|
||||||
|
class="d-flex flex-row p-0"
|
||||||
|
>
|
||||||
|
<h4 class="sr-only" id="demo-group">
|
||||||
|
How many chips are we repairing?
|
||||||
|
</h4>
|
||||||
|
<listButtonHorizontal
|
||||||
|
groupName="demo"
|
||||||
|
aria-required="true"
|
||||||
|
buttonID="1"
|
||||||
|
buttonLabel="1"
|
||||||
|
value="1"
|
||||||
|
buttonLabelSubCopy=""
|
||||||
|
textPosition="text-center"
|
||||||
|
sizeInRem="1"
|
||||||
|
:totalInGroup="3"
|
||||||
|
:positionInGroup="1"
|
||||||
|
screenReaderOnlyText=" opens new window"
|
||||||
|
/>
|
||||||
|
<listButtonHorizontal
|
||||||
|
groupName="demo"
|
||||||
|
aria-required="true"
|
||||||
|
buttonID="2"
|
||||||
|
buttonLabel="2"
|
||||||
|
value="2"
|
||||||
|
buttonLabelSubCopy=""
|
||||||
|
textPosition="text-center"
|
||||||
|
sizeInRem="1"
|
||||||
|
:totalInGroup="3"
|
||||||
|
:positionInGroup="2"
|
||||||
|
screenReaderOnlyText=" opens new window"
|
||||||
|
/>
|
||||||
|
<listButtonHorizontal
|
||||||
|
groupName="demo"
|
||||||
|
aria-required="true"
|
||||||
|
buttonID="3"
|
||||||
|
buttonLabel="3"
|
||||||
|
value="3"
|
||||||
|
buttonLabelSubCopy=""
|
||||||
|
textPosition="text-center"
|
||||||
|
sizeInRem="1"
|
||||||
|
:totalInGroup="3"
|
||||||
|
:positionInGroup="3"
|
||||||
|
screenReaderOnlyText=" opens new window"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
<div class="row px-3 form-test-error">
|
||||||
|
<error-message name="demo"></error-message>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row g-2 mt-6 mx-4">
|
||||||
|
<div class="col">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">
|
||||||
|
Which windshield part needs fixed? (Required)
|
||||||
|
</h4>
|
||||||
|
<fieldset>
|
||||||
|
<legend class="sr-only">Which windshield part needs fixed?</legend>
|
||||||
|
<listButton
|
||||||
|
isMultiSelect
|
||||||
|
buttonID="Single Windshield"
|
||||||
|
buttonLabel="Single Windshield"
|
||||||
|
value="Single Windshield"
|
||||||
|
groupName="demo2"
|
||||||
|
/>
|
||||||
|
<listButton
|
||||||
|
isMultiSelect
|
||||||
|
buttonID="Driver Side"
|
||||||
|
buttonLabel="Driver Side"
|
||||||
|
value="Driver Side"
|
||||||
|
groupName="demo2"
|
||||||
|
/>
|
||||||
|
<listButton
|
||||||
|
isMultiSelect
|
||||||
|
buttonID="Passenger Side"
|
||||||
|
buttonLabel="Passenger Side"
|
||||||
|
value="Passenger Side"
|
||||||
|
groupName="demo2"
|
||||||
|
/>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
<div class="row px-3 form-test-error">
|
||||||
|
<error-message name="demo2"></error-message>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row g-2 mt-6 mx-4">
|
||||||
|
<div class="col">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">demo3: Enter your VIN (Required)</h4>
|
||||||
|
<textInput
|
||||||
|
name="demo3"
|
||||||
|
type="text"
|
||||||
|
label="VIN (Required)"
|
||||||
|
:isRequired="true"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- <div class="row g-2 mt-6 mx-4">
|
||||||
|
<div class="col">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">demo4: Enter some numbers (optional)</h4>
|
||||||
|
<textInput
|
||||||
|
name="demo4"
|
||||||
|
type="text"
|
||||||
|
label="Numbers Only"
|
||||||
|
:isRequired="true"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
|
||||||
|
<div class="row g-2 mt-6 mx-4">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">demo5: Where's your damage? (Required)</h4>
|
||||||
|
<div aria-labelledby="demo5-group" class="d-flex flex-row p-0">
|
||||||
|
<h4 class="sr-only" id="demo5-group">Where's your damage?</h4>
|
||||||
|
<listCard
|
||||||
|
isMultiSelect
|
||||||
|
buttonImage="windshield-damage.svg"
|
||||||
|
buttonLabel="Windshield"
|
||||||
|
value="Windshield"
|
||||||
|
altText=""
|
||||||
|
buttonID="List Card Checkbox a"
|
||||||
|
groupName="demo5"
|
||||||
|
/>
|
||||||
|
<listCard
|
||||||
|
isMultiSelect
|
||||||
|
buttonImage="side-window-damage-left-all.svg"
|
||||||
|
buttonLabel="Side Door"
|
||||||
|
value="Side Door"
|
||||||
|
altText=""
|
||||||
|
buttonID="List Card Checkbox b"
|
||||||
|
groupName="demo5"
|
||||||
|
/>
|
||||||
|
<listCard
|
||||||
|
isMultiSelect
|
||||||
|
buttonImage="back-glass-damage.svg"
|
||||||
|
buttonLabel="Rear Window"
|
||||||
|
value="Rear Window"
|
||||||
|
altText=""
|
||||||
|
buttonID="List Card Checkbox c"
|
||||||
|
groupName="demo5"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row px-3 form-test-error">
|
||||||
|
<error-message name="demo5"></error-message>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row g-2 mt-6 mx-4">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">
|
||||||
|
demo6: What's your windshield damage? (Required if demo5 "Windshield" is
|
||||||
|
selected)
|
||||||
|
</h4>
|
||||||
|
<div
|
||||||
|
role="radiogroup"
|
||||||
|
aria-labelledby="demo6-group"
|
||||||
|
class="d-flex flex-row p-0"
|
||||||
|
>
|
||||||
|
<h4 class="sr-only" id="demo6-group">What's your windshield damage?</h4>
|
||||||
|
<listCard
|
||||||
|
isRadio
|
||||||
|
buttonImage="windshield-damage.svg"
|
||||||
|
buttonLabel="Crack"
|
||||||
|
value="Crack"
|
||||||
|
buttonLabelSubCopy="My damage is larger than six inches."
|
||||||
|
altText=""
|
||||||
|
buttonID="Crack Checkbox a"
|
||||||
|
groupName="demo6"
|
||||||
|
/>
|
||||||
|
<listCard
|
||||||
|
isRadio
|
||||||
|
buttonImage="windshield-damage.svg"
|
||||||
|
buttonLabel="Chip(s)"
|
||||||
|
value="Chip"
|
||||||
|
buttonLabelSubCopy="I have three or fewer chips smaller than six inches."
|
||||||
|
altText=""
|
||||||
|
buttonID="Chip Checkbox b"
|
||||||
|
groupName="demo6"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row px-3 form-test-error">
|
||||||
|
<error-message name="demo6"></error-message>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- <div class="row g-2 mt-6 mx-4">
|
||||||
|
<div class="col">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">Password (Required, enter any string)</h4>
|
||||||
|
<textInput
|
||||||
|
name="password"
|
||||||
|
type="text"
|
||||||
|
label="Password (Required)"
|
||||||
|
:isRequired="true"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row g-2 mt-6 mx-4">
|
||||||
|
<div class="col">
|
||||||
|
<h4 class="mx-2 mt-4 mb-0">Confirm Password (Required, must match above Password field)</h4>
|
||||||
|
<textInput
|
||||||
|
name="passwordConfirmation"
|
||||||
|
type="text"
|
||||||
|
label="Confirm Password (Required)"
|
||||||
|
:isRequired="true"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
|
||||||
|
<div class="row px-3 form-test-error" data-focus-target="demoX">
|
||||||
|
<error-message name="demoX"></error-message>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="g-2 mt-6 mx-4">
|
||||||
|
<button class="mb-6" :class="!meta.valid && 'form-test-invalid'">
|
||||||
|
Get your estimate
|
||||||
|
</button>
|
||||||
|
<p>Current Form Values:</p>
|
||||||
|
<pre>{{ values }}</pre>
|
||||||
|
<p>Is Form Valid? (Meta.valid):</p>
|
||||||
|
<pre>{{ meta.valid }}</pre>
|
||||||
|
</div>
|
||||||
|
</Form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { Form, ErrorMessage } from "vee-validate";
|
||||||
|
import * as Yup from "yup";
|
||||||
|
|
||||||
|
import listCard from "@/ux-components/list-card/list-card";
|
||||||
|
import textInput from "@/common-components/text-input/text-input";
|
||||||
|
import listButton from "@/ux-components/list-button/list-button";
|
||||||
|
import listButtonHorizontal from "@/ux-components/list-button-horizontal/list-button-horizontal";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "App",
|
||||||
|
data() {
|
||||||
|
const errorMessages = {
|
||||||
|
demo: "Please select chip(s)",
|
||||||
|
demo2: "Please select a windshield part",
|
||||||
|
demo3:
|
||||||
|
"You entered an invalid VIN. Please check to make sure that you inserted a 17 digit, alpha-numeric number. VINs do not contain the letters I, O or Q.",
|
||||||
|
demo4: "Invalid Entry. Must enter only numbers, no letters.",
|
||||||
|
demo5: "Please select damage location",
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
schema: Yup.object()
|
||||||
|
.shape({
|
||||||
|
demo: Yup.string().required(errorMessages.demo),
|
||||||
|
demo2: Yup.array()
|
||||||
|
.required(errorMessages.demo2)
|
||||||
|
.min(1, errorMessages.demo2),
|
||||||
|
demo3: Yup.string()
|
||||||
|
.uppercase()
|
||||||
|
.required("Please enter a VIN.")
|
||||||
|
.min(17, errorMessages.demo3)
|
||||||
|
.max(17, errorMessages.demo3)
|
||||||
|
.matches("^[^IOQ]+$", errorMessages.demo3),
|
||||||
|
// demo4: Yup.string().matches('^[0-9]*$', errorMessages.demo4),
|
||||||
|
demo5: Yup.array()
|
||||||
|
.required(errorMessages.demo5)
|
||||||
|
.min(1, errorMessages.demo5),
|
||||||
|
demo6: Yup.string().when("demo5", function (demo5, schema, value) {
|
||||||
|
if (demo5) {
|
||||||
|
const demo5String = demo5.toString();
|
||||||
|
if (demo5String.includes("Windshield")) {
|
||||||
|
// make demo6 required
|
||||||
|
return schema.required(
|
||||||
|
"You must pick an option for Windshield Damage."
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return schema;
|
||||||
|
}
|
||||||
|
return schema;
|
||||||
|
}),
|
||||||
|
demoX: Yup.string().notRequired(),
|
||||||
|
// PASSWORD EXAMPLE, NOT BEING USED NOW
|
||||||
|
// password: Yup.string().min(6).required(),
|
||||||
|
// passwordConfirmation: Yup.string()
|
||||||
|
// .required()
|
||||||
|
// .oneOf([Yup.ref("password")], "Passwords do not match"),
|
||||||
|
})
|
||||||
|
.test(
|
||||||
|
"repair-replace-conflict",
|
||||||
|
null, // need to pass null as error message so it won't get added to list of errors
|
||||||
|
function (value) {
|
||||||
|
// whole form test
|
||||||
|
console.log("ALL FORM VALUES: ", value);
|
||||||
|
|
||||||
|
// test problem scenario... return new error if conditions are true, allow submit if not
|
||||||
|
if (value.demo5 && value.demo6) {
|
||||||
|
const demo5String = value.demo5.toString();
|
||||||
|
console.log("demo5String: ", demo5String);
|
||||||
|
console.log("demo6: ", value.demo6);
|
||||||
|
|
||||||
|
if (
|
||||||
|
demo5String.includes("Windshield") &&
|
||||||
|
value.demo5.length > 1 &&
|
||||||
|
value.demo6 == "Chip"
|
||||||
|
) {
|
||||||
|
return this.createError({
|
||||||
|
name: "demoX",
|
||||||
|
message:
|
||||||
|
"Sorry, at this time we can't schedule a repair and replace at the same time. Please schedule these appointments separately as they are different technicians. Thanks.",
|
||||||
|
path: "demoX",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
),
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
listCard,
|
||||||
|
listButton,
|
||||||
|
listButtonHorizontal,
|
||||||
|
textInput,
|
||||||
|
Form,
|
||||||
|
ErrorMessage,
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onSubmit(values) {
|
||||||
|
window.alert(
|
||||||
|
"Success! Submitted values: " + JSON.stringify(values, null, 2)
|
||||||
|
);
|
||||||
|
console.log("submitted: ", JSON.stringify(values, null, 2));
|
||||||
|
},
|
||||||
|
onInvalidSubmit({ values, errors, results }) {
|
||||||
|
// identify the first error field and put focus on it
|
||||||
|
console.log("values: ", values);
|
||||||
|
console.log("errors: ", errors);
|
||||||
|
console.log("results: ", results);
|
||||||
|
// get errorEls and order by alpha
|
||||||
|
const errorEls = Object.keys(errors).sort();
|
||||||
|
const firstErrorEl = errorEls[0];
|
||||||
|
console.log("firstErrorEl: ", firstErrorEl);
|
||||||
|
if (firstErrorEl) {
|
||||||
|
const qsString = "[data-focus-target='" + firstErrorEl + "']";
|
||||||
|
document.querySelector(qsString).focus();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.form-test-error {
|
||||||
|
color: red;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.form-test-invalid {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -1,3 +0,0 @@
|
||||||
<template>
|
|
||||||
<p>Not Found .... :(</p>
|
|
||||||
</template>
|
|
||||||
|
|
@ -0,0 +1,83 @@
|
||||||
|
import { shallowMount } from "@vue/test-utils";
|
||||||
|
import damageLocationQuestion from "@/layouts/vehicle-damage/damage-location-question/damage-location-question";
|
||||||
|
import { getMountOptions } from "@/helpers/unit-test-helper.js";
|
||||||
|
import store from "@/store";
|
||||||
|
jest.mock("@/store", () => { return {}; }, {virtual: true});
|
||||||
|
|
||||||
|
describe("damage-location-question.vue", () => {
|
||||||
|
test("Selected location option is emitted upon selection.", async () => {
|
||||||
|
|
||||||
|
//Arrange
|
||||||
|
const { wrapper } = setupMocks({ modelValueProp: ["Windshield"] });
|
||||||
|
const locationToSelect = ["Backseat"];
|
||||||
|
|
||||||
|
//Act
|
||||||
|
wrapper.setValue({ modelValue: locationToSelect });
|
||||||
|
await wrapper.vm.$nextTick();
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
expect(wrapper.emitted()["update:modelValue"][0]).toEqual([{modelValue: ["Backseat"]}]);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("damage-location-question.vue", () => {
|
||||||
|
test("Answers to display filtered by data from api.", async () => {
|
||||||
|
|
||||||
|
//Arrange
|
||||||
|
const { wrapper, cmsContent, damageOptions } = setupMocks({ dataFromStoreApi: {
|
||||||
|
driverSideOptions: {
|
||||||
|
availableReplacementOptions: ['Quarter', 'Front']
|
||||||
|
},
|
||||||
|
windshieldOptions: {
|
||||||
|
availableReplacementOptions: ['Single']
|
||||||
|
},
|
||||||
|
backGlassOptions: {
|
||||||
|
availableReplacementOptions: []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//Act
|
||||||
|
damageLocationQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, damageOptions, "car-group");
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
expect(wrapper.vm.answersToDisplay).toStrictEqual([ { Name: 'car-Windshield' }, { Name: 'car-SideDoor' }, {Name: "car-RearWindow"} ])
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function setupMocks({
|
||||||
|
modelValueProp = ["Windshield", "SideDoor"],
|
||||||
|
isMultiSelect = false,
|
||||||
|
groupName = "damageQuestion",
|
||||||
|
cmsQuestionText = "CMS text goes here",
|
||||||
|
cmsAnswers = [{Name: "car-Windshield"}, {Name: "car-SideDoor"}, {Name: "car-RearWindow"}],
|
||||||
|
dataFromStoreApi = [],
|
||||||
|
}) {
|
||||||
|
|
||||||
|
//Mock store
|
||||||
|
store.dispatch = jest.fn(() => dataFromStoreApi);
|
||||||
|
store.getters = { vehicle: {year: 2019, make: 'honda', model: 'civc', style: '2 Door', category: 'CAR'} };
|
||||||
|
const mountOptions = getMountOptions({
|
||||||
|
store: {
|
||||||
|
dispatch: store.dispatch,
|
||||||
|
getters: store.getters,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
//Mock props
|
||||||
|
mountOptions.propsData = {
|
||||||
|
modelValue: modelValueProp,
|
||||||
|
isMultiSelect: isMultiSelect,
|
||||||
|
};
|
||||||
|
|
||||||
|
const wrapper = shallowMount(damageLocationQuestion, mountOptions);
|
||||||
|
|
||||||
|
//Mock CMS content
|
||||||
|
const cmsContent = {
|
||||||
|
groupName: groupName,
|
||||||
|
QuestionText: cmsQuestionText,
|
||||||
|
Answers: cmsAnswers,
|
||||||
|
};
|
||||||
|
const damageOptions = dataFromStoreApi;
|
||||||
|
return { wrapper, cmsContent, damageOptions };
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,69 @@
|
||||||
|
<template>
|
||||||
|
<div class="replace-options-question">
|
||||||
|
<buttonQuestion
|
||||||
|
v-if="answersToDisplay.length > 1"
|
||||||
|
:questionText="questionText"
|
||||||
|
isMultiSelect
|
||||||
|
:answers="answersToDisplay"
|
||||||
|
:groupName="groupName"
|
||||||
|
buttonType="listCard"
|
||||||
|
v-model="selectedValues"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import buttonQuestion from "@/common-components/button-question/button-question";
|
||||||
|
import store from "@/store";
|
||||||
|
|
||||||
|
export default ({
|
||||||
|
name: "damageLocationQuestion",
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
questionText: String,
|
||||||
|
answersFromCms: Array,
|
||||||
|
damageOptions: Object,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
modelValue: Array,
|
||||||
|
groupName: String,
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
initializeComponent(cmsContent, damageOptions){
|
||||||
|
this.questionText = cmsContent.QuestionText;
|
||||||
|
this.answersFromCms = cmsContent.Answers;
|
||||||
|
this.damageOptions = damageOptions;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
selectedValues: {
|
||||||
|
get: function() {
|
||||||
|
return this.modelValue;
|
||||||
|
},
|
||||||
|
set: function(newValue) {
|
||||||
|
this.$emit("update:modelValue", newValue);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
damageOptionsMap(){
|
||||||
|
return {
|
||||||
|
Windshield: true,
|
||||||
|
SideDoor: this.damageOptions.driverSideOptions.availableReplacementOptions || this.damageOptions.passengerSideOptions.availableReplacementOption ? true : false,
|
||||||
|
RearWindow: this.damageOptions.backGlassOptions.availableReplacementOptions ? true : false,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
answersToDisplay(){
|
||||||
|
return Array.isArray(this.answersFromCms)
|
||||||
|
? this.answersFromCms.filter(ans =>
|
||||||
|
{
|
||||||
|
const name = ans.Name.split('-');
|
||||||
|
return name[0].toUpperCase() === store.getters.vehicle.category && this.damageOptionsMap[name[1]];
|
||||||
|
})
|
||||||
|
: [];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
buttonQuestion,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,76 @@
|
||||||
|
import { shallowMount } from "@vue/test-utils";
|
||||||
|
import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question";
|
||||||
|
import { getMountOptions } from "@/helpers/unit-test-helper.js";
|
||||||
|
import store from "@/store";
|
||||||
|
jest.mock("@/store", () => { return {}; }, {virtual: true});
|
||||||
|
|
||||||
|
describe("replace-options-question.vue", () => {
|
||||||
|
test("Selected damage option is emitted upon selection.", async () => {
|
||||||
|
|
||||||
|
//Arrange
|
||||||
|
const { wrapper } = setupMocks({ modelValueProp: ["Windshield"] });
|
||||||
|
const damageToSelect = ["Backseat"];
|
||||||
|
|
||||||
|
//Act
|
||||||
|
wrapper.setValue({ modelValue: damageToSelect });
|
||||||
|
await wrapper.vm.$nextTick();
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
expect(wrapper.emitted()["update:modelValue"][0]).toEqual([{modelValue: ["Backseat"]}]);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("replace-options-question.vue", () => {
|
||||||
|
test("Answers to display filtered by data from api.", async () => {
|
||||||
|
|
||||||
|
//Arrange
|
||||||
|
const { wrapper, cmsContent, replaceOptions } = setupMocks({ dataFromStoreApi: ["Windshield", "FrontDoor"]});
|
||||||
|
|
||||||
|
//Act
|
||||||
|
replaceOptionsQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, replaceOptions, "car-group");
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
expect(wrapper.vm.answersToDisplay).toStrictEqual([ { Name: 'car-Windshield' }, { Name: 'car-FrontDoor' } ])
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function setupMocks({
|
||||||
|
modelValueProp = ["Windshield"],
|
||||||
|
isAvailale = true,
|
||||||
|
isMultiSelect = false,
|
||||||
|
filterByVehicleCategory = false,
|
||||||
|
groupName = "damageQuestion",
|
||||||
|
cmsQuestionText = "CMS text goes here",
|
||||||
|
cmsAnswers = [{Name: "car-Windshield"}, {Name: "car-BackDoor"}, {Name: "car-FrontDoor"}],
|
||||||
|
dataFromStoreApi = [],
|
||||||
|
}) {
|
||||||
|
|
||||||
|
//Mock store
|
||||||
|
store.dispatch = jest.fn(() => dataFromStoreApi);
|
||||||
|
store.getters = { vehicle: {year: 2019, make: 'honda', model: 'civc', style: '2 Door', category: 'CAR'} };
|
||||||
|
const mountOptions = getMountOptions({
|
||||||
|
store: {
|
||||||
|
dispatch: store.dispatch,
|
||||||
|
getters: store.getters,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
//Mock props
|
||||||
|
mountOptions.propsData = {
|
||||||
|
modelValue: modelValueProp,
|
||||||
|
isAvailable: isAvailale,
|
||||||
|
isMultiSelect: isMultiSelect,
|
||||||
|
filterByVehicleCategory: filterByVehicleCategory
|
||||||
|
};
|
||||||
|
|
||||||
|
const wrapper = shallowMount(replaceOptionsQuestion, mountOptions);
|
||||||
|
|
||||||
|
//Mock CMS content
|
||||||
|
const cmsContent = {
|
||||||
|
groupName: groupName,
|
||||||
|
QuestionText: cmsQuestionText,
|
||||||
|
Answers: cmsAnswers,
|
||||||
|
};
|
||||||
|
const replaceOptions = dataFromStoreApi;
|
||||||
|
return { wrapper, cmsContent, replaceOptions };
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,78 @@
|
||||||
|
<template>
|
||||||
|
<transition name="fade">
|
||||||
|
<div class="replace-options-question">
|
||||||
|
<buttonQuestion
|
||||||
|
v-if="isAvailable && answersToDisplay.length > 1"
|
||||||
|
:questionText="questionText"
|
||||||
|
isMultiSelect
|
||||||
|
:answers="answersToDisplay"
|
||||||
|
:groupName="groupName"
|
||||||
|
buttonType="listCard"
|
||||||
|
v-model="selectedValues"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</transition>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import buttonQuestion from "@/common-components/button-question/button-question";
|
||||||
|
import store from "@/store";
|
||||||
|
|
||||||
|
export default ({
|
||||||
|
name: "replaceOptionsQuestion",
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
questionText: String,
|
||||||
|
answersFromCms: Array,
|
||||||
|
replaceOptions: Array,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
isAvailable: Boolean,
|
||||||
|
filterByVehicleCategory: Boolean,
|
||||||
|
groupName: String,
|
||||||
|
modelValue: Array,
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
initializeComponent(cmsContent, replaceOptions){
|
||||||
|
this.questionText = cmsContent.QuestionText;
|
||||||
|
this.answersFromCms = cmsContent.Answers;
|
||||||
|
this.replaceOptions = replaceOptions;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
selectedValues: {
|
||||||
|
get: function() {
|
||||||
|
return this.modelValue;
|
||||||
|
},
|
||||||
|
set: function(newValue) {
|
||||||
|
this.$emit("update:modelValue", newValue);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
answersToDisplay(){
|
||||||
|
return Array.isArray(this.answersFromCms)
|
||||||
|
? this.answersFromCms.filter(ans =>
|
||||||
|
{
|
||||||
|
const name = ans.Name.split('-');
|
||||||
|
return this.filterByVehicleCategory ? name[0].toUpperCase() === store.getters.vehicle.category : name[0].toUpperCase() === store.getters.vehicle.category && this.replaceOptions.includes(name[1])
|
||||||
|
})
|
||||||
|
: [];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
buttonQuestion,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.fade-enter-active,
|
||||||
|
.fade-leave-active {
|
||||||
|
transition: opacity 0.5s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-enter-from,
|
||||||
|
.fade-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
256
src/layouts/vehicle-damage/vehicle-damage.spec.js
Normal file
256
src/layouts/vehicle-damage/vehicle-damage.spec.js
Normal file
|
|
@ -0,0 +1,256 @@
|
||||||
|
// Components
|
||||||
|
import vehicleDamage from "@/layouts/vehicle-damage/vehicle-damage.vue";
|
||||||
|
import funnelHeader from "@/common-components/funnel-header/funnel-header";
|
||||||
|
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
|
||||||
|
import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header";
|
||||||
|
import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question";
|
||||||
|
import damageLocationQuestion from "@/layouts/vehicle-damage/damage-location-question/damage-location-question";
|
||||||
|
|
||||||
|
// Supporting Files
|
||||||
|
import { settleAllPromises } from "@/helpers/layout-helper.js";
|
||||||
|
import baseMixin from "@/mixins/base-mixin";
|
||||||
|
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
|
||||||
|
import { shallowMount } from "@vue/test-utils";
|
||||||
|
import { getMountOptions } from "@/helpers/unit-test-helper.js";
|
||||||
|
import { nextTick } from "vue";
|
||||||
|
import { storeActions } from "@/constants/store-actions";
|
||||||
|
import store from "@/store";
|
||||||
|
|
||||||
|
// Mock our module for promises.
|
||||||
|
jest.mock("@/helpers/layout-helper.js", () => ({
|
||||||
|
settleAllPromises: jest.fn(),
|
||||||
|
}));
|
||||||
|
|
||||||
|
// Mock fetchCmsContentForPage
|
||||||
|
jest.mock("@/helpers/cms-content-helper", () => ({
|
||||||
|
fetchCmsContentForPage: jest.fn(),
|
||||||
|
}));
|
||||||
|
|
||||||
|
// Mock Store
|
||||||
|
jest.mock("@/store", () => ({
|
||||||
|
commit: jest.fn(),
|
||||||
|
dispatch: jest.fn(),
|
||||||
|
getters: {
|
||||||
|
vehicle: {
|
||||||
|
carId: "C00000000",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}));
|
||||||
|
|
||||||
|
describe("vehicle-damage.vue", () => {
|
||||||
|
test("Page header is initailized with api data", async (done) => {
|
||||||
|
//Arrange
|
||||||
|
const pageHeaderWidgetHeaderText = "Select Damage";
|
||||||
|
const { wrapper, apiPromise } = setupMocks({
|
||||||
|
pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText,
|
||||||
|
});
|
||||||
|
|
||||||
|
//Act
|
||||||
|
vehicleDamage.beforeRouteEnter.call(
|
||||||
|
wrapper.vm,
|
||||||
|
{ query: { fmgPage: "vehicle-damage" } },
|
||||||
|
undefined,
|
||||||
|
(c) => c(wrapper.vm)
|
||||||
|
);
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
apiPromise.finally(() => {
|
||||||
|
expect(funnelSubHeader.methods.initializeComponent).toHaveBeenCalledWith(
|
||||||
|
pageHeaderWidgetHeaderText
|
||||||
|
);
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("vehicle-damage.vue", () => {
|
||||||
|
test("Page logo image is initailized with api data", async (done) => {
|
||||||
|
//Arrange
|
||||||
|
const SiteHeaderWidget = {
|
||||||
|
LogoImage:
|
||||||
|
"https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3",
|
||||||
|
};
|
||||||
|
const { wrapper, apiPromise } = setupMocks({
|
||||||
|
SiteHeaderWidget: SiteHeaderWidget,
|
||||||
|
});
|
||||||
|
|
||||||
|
//Act
|
||||||
|
vehicleDamage.beforeRouteEnter.call(
|
||||||
|
wrapper.vm,
|
||||||
|
{ query: { fmgPage: "vehicle-damage" } },
|
||||||
|
undefined,
|
||||||
|
(c) => c(wrapper.vm)
|
||||||
|
);
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
apiPromise.finally(() => {
|
||||||
|
expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith(
|
||||||
|
SiteHeaderWidget
|
||||||
|
);
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("vehicle-damage.vue", () => {
|
||||||
|
test("Vehicle image is initailized with api data", async (done) => {
|
||||||
|
//Arrange
|
||||||
|
const VehicleBannerWidget = {
|
||||||
|
GenericVehicleImage:
|
||||||
|
"https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3",
|
||||||
|
};
|
||||||
|
const { wrapper, apiPromise } = setupMocks({
|
||||||
|
VehicleBannerWidget: VehicleBannerWidget,
|
||||||
|
});
|
||||||
|
|
||||||
|
//Act
|
||||||
|
vehicleDamage.beforeRouteEnter.call(
|
||||||
|
wrapper.vm,
|
||||||
|
{ query: { fmgPage: "vehicle-damage" } },
|
||||||
|
undefined,
|
||||||
|
(c) => c(wrapper.vm)
|
||||||
|
);
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
apiPromise.finally(() => {
|
||||||
|
expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith(
|
||||||
|
VehicleBannerWidget
|
||||||
|
);
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("vehicle-damage.vue", () => {
|
||||||
|
test("CarId set, arePagePrerequisitesValid should be true ", async () => {
|
||||||
|
//Arrange
|
||||||
|
const { wrapper } = setupMocks({});
|
||||||
|
|
||||||
|
//Act
|
||||||
|
vehicleDamage.beforeRouteEnter.call(
|
||||||
|
wrapper.vm,
|
||||||
|
{ query: { fmgPage: "vehicle-damage" } },
|
||||||
|
undefined,
|
||||||
|
(c) => c(wrapper.vm)
|
||||||
|
);
|
||||||
|
|
||||||
|
let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
|
||||||
|
await nextTick();
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
expect(arePagePrerequisitesValid).toBe(true);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe("vehicle-damage.vue", () => {
|
||||||
|
test("Call invalidation, ResetPartsAndDeps should be called", async () => {
|
||||||
|
|
||||||
|
//Arrange
|
||||||
|
const { wrapper } = setupMocks({});
|
||||||
|
|
||||||
|
//Act
|
||||||
|
vehicleDamage.beforeRouteEnter.call(
|
||||||
|
wrapper.vm,
|
||||||
|
{ query: { fmgPage: "vehicle-damage" } },
|
||||||
|
undefined,
|
||||||
|
(c) => c(wrapper.vm)
|
||||||
|
);
|
||||||
|
|
||||||
|
wrapper.vm.resetDependentState();
|
||||||
|
|
||||||
|
//Assert
|
||||||
|
expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_AND_DEPS)
|
||||||
|
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function setupMocks({
|
||||||
|
pageHeaderWidgetHeaderText = {},
|
||||||
|
mountOptionsMockData = {},
|
||||||
|
}) {
|
||||||
|
//Mock api responses
|
||||||
|
baseMixin.methods.dispatchNonBlockingStoreAction = jest.fn();
|
||||||
|
baseMixin.methods.dispatchNonBlockingStoreAction.mockImplementation(() => {
|
||||||
|
return Promise.resolve({
|
||||||
|
driverSideOptions: {
|
||||||
|
availableReplacementOptions: ["Front", "Back", "Side"],
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
const apiResponses = {
|
||||||
|
cmsContent: {
|
||||||
|
FunnelSubHeaderWidget: pageHeaderWidgetHeaderText,
|
||||||
|
VehicleBannerWidget: {
|
||||||
|
GenericVehicleImage:
|
||||||
|
"https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3",
|
||||||
|
},
|
||||||
|
FunnelHeaderWidget: {
|
||||||
|
LogoImage:
|
||||||
|
"https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
damageOptions: {
|
||||||
|
driverSideOptions: {
|
||||||
|
availableReplacementOptions: ["Front", "Back", "Side"],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const apiPromise = Promise.resolve(apiResponses);
|
||||||
|
|
||||||
|
settleAllPromises.mockImplementation(() => apiPromise);
|
||||||
|
fetchCmsContentForPage.mockImplementation(() => Promise.resolve());
|
||||||
|
|
||||||
|
//Mock damage initialize methods
|
||||||
|
funnelHeader.methods = {
|
||||||
|
initializeComponent: jest.fn(),
|
||||||
|
};
|
||||||
|
|
||||||
|
vehicleBanner.methods = {
|
||||||
|
initializeComponent: jest.fn(),
|
||||||
|
};
|
||||||
|
|
||||||
|
funnelSubHeader.methods = {
|
||||||
|
initializeComponent: jest.fn(),
|
||||||
|
};
|
||||||
|
|
||||||
|
const driverSideOptions = replaceOptionsQuestion
|
||||||
|
driverSideOptions.methods = {
|
||||||
|
initializeComponent: jest.fn(),
|
||||||
|
};
|
||||||
|
|
||||||
|
damageLocationQuestion.methods = {
|
||||||
|
initializeComponent: jest.fn(),
|
||||||
|
}
|
||||||
|
|
||||||
|
const mountOptions = getMountOptions(mountOptionsMockData);
|
||||||
|
const wrapper = shallowMount(vehicleDamage, mountOptions);
|
||||||
|
|
||||||
|
const funnelHeaderWrapper = wrapper.findComponent({ name: "funnelHeader" });
|
||||||
|
funnelHeaderWrapper.vm.initializeComponent =
|
||||||
|
funnelHeader.methods.initializeComponent;
|
||||||
|
|
||||||
|
const vehicleBannerWrapper = wrapper.findComponent({ name: "vehicleBanner" });
|
||||||
|
vehicleBannerWrapper.vm.initializeComponent =
|
||||||
|
vehicleBanner.methods.initializeComponent;
|
||||||
|
|
||||||
|
const funnelSubHeaderWrapper = wrapper.findComponent({
|
||||||
|
name: "funnelSubHeader",
|
||||||
|
});
|
||||||
|
funnelSubHeaderWrapper.vm.initializeComponent =
|
||||||
|
funnelSubHeader.methods.initializeComponent;
|
||||||
|
|
||||||
|
const driverSideOptionsWrapper = wrapper.findComponent({
|
||||||
|
name: "replaceOptionsQuestion",
|
||||||
|
});
|
||||||
|
driverSideOptionsWrapper.vm.initializeComponent =
|
||||||
|
replaceOptionsQuestion.methods.initializeComponent;
|
||||||
|
|
||||||
|
const damageLocationQuestionWrapper = wrapper.findComponent({
|
||||||
|
name: "damageLocationQuestion",
|
||||||
|
});
|
||||||
|
damageLocationQuestionWrapper.vm.initializeComponent =
|
||||||
|
damageLocationQuestion.methods.initializeComponent;
|
||||||
|
|
||||||
|
return { wrapper, apiPromise };
|
||||||
|
}
|
||||||
93
src/layouts/vehicle-damage/vehicle-damage.vue
Normal file
93
src/layouts/vehicle-damage/vehicle-damage.vue
Normal file
|
|
@ -0,0 +1,93 @@
|
||||||
|
<template>
|
||||||
|
<div class="container-fluid shadow rounded-3 p-2 position-relative">
|
||||||
|
<funnelHeader ref="funnelHeader" />
|
||||||
|
<vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage=false />
|
||||||
|
<funnelSubHeader ref="funnelSubHeader" />
|
||||||
|
<damageLocationQuestion ref="damageLocation" v-model="selectedDamageLocations" groupName="DamageLocationQuestion" />
|
||||||
|
<replaceOptionsQuestion ref="driverSideOptions" isAvailable v-model="driverSideOptionsData" groupName="DriverSideReplaceOptionsQuestion" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// Components
|
||||||
|
import funnelHeader from "@/common-components/funnel-header/funnel-header";
|
||||||
|
import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
|
||||||
|
import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header";
|
||||||
|
import replaceOptionsQuestion from"@/layouts/vehicle-damage/replace-options-question/replace-options-question";
|
||||||
|
import damageLocationQuestion from"@/layouts/vehicle-damage/damage-location-question/damage-location-question";
|
||||||
|
// Supporting files
|
||||||
|
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
|
||||||
|
import { settleAllPromises } from "@/helpers/layout-helper";
|
||||||
|
import { storeActions } from "@/constants/store-actions";
|
||||||
|
import store from "@/store";
|
||||||
|
import baseMixin from "@/mixins/base-mixin";
|
||||||
|
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "vehicle-damage",
|
||||||
|
async beforeRouteEnter(to, from, next) {
|
||||||
|
// Call APIs
|
||||||
|
const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
|
||||||
|
const damageOptionsPromise =
|
||||||
|
baseMixin.methods.dispatchNonBlockingStoreAction(
|
||||||
|
storeActions.GET_DAMAGE_OPTIONS,
|
||||||
|
{ carId: store.getters.vehicle.carId }
|
||||||
|
);
|
||||||
|
|
||||||
|
// Settle promises and get results
|
||||||
|
const promiseResultMap = [
|
||||||
|
{
|
||||||
|
resultKey: "cmsContent",
|
||||||
|
promise: cmsContentPromise,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
resultKey: "damageOptions",
|
||||||
|
promise: damageOptionsPromise,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const resultMap = await settleAllPromises(promiseResultMap);
|
||||||
|
|
||||||
|
// Call the "next" function to complete the transition to this page.
|
||||||
|
next((vm) => {
|
||||||
|
vm.$refs.funnelHeader.initializeComponent(
|
||||||
|
resultMap.cmsContent.FunnelHeaderWidget
|
||||||
|
);
|
||||||
|
vm.$refs.vehicleBanner.initializeComponent(
|
||||||
|
resultMap.cmsContent.VehicleBannerWidget
|
||||||
|
);
|
||||||
|
vm.$refs.funnelSubHeader.initializeComponent(
|
||||||
|
resultMap.cmsContent.FunnelSubHeaderWidget
|
||||||
|
);
|
||||||
|
vm.$refs.driverSideOptions.initializeComponent(
|
||||||
|
resultMap.cmsContent.DriverSideReplaceOptionsQuestion, resultMap.damageOptions.driverSideOptions.availableReplacementOptions
|
||||||
|
);
|
||||||
|
vm.$refs.damageLocation.initializeComponent(
|
||||||
|
resultMap.cmsContent.DamageLocationQuestion, resultMap.damageOptions
|
||||||
|
);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
selectedDamageLocations: [],
|
||||||
|
driverSideOptionsData: [],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
arePagePrerequisitesValid() {
|
||||||
|
return store.getters.vehicle.carId !== null;
|
||||||
|
},
|
||||||
|
resetDependentState() {
|
||||||
|
// Invokes
|
||||||
|
store.dispatch(storeActions.RESET_PARTS_AND_DEPS);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
funnelHeader,
|
||||||
|
vehicleBanner,
|
||||||
|
funnelSubHeader,
|
||||||
|
replaceOptionsQuestion,
|
||||||
|
damageLocationQuestion,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
@ -2,65 +2,84 @@ import makeQuestion from "@/layouts/vehicle-make/make-question/make-question";
|
||||||
import { shallowMount } from "@vue/test-utils";
|
import { shallowMount } from "@vue/test-utils";
|
||||||
import { getMountOptions } from "@/helpers/unit-test-helper.js";
|
import { getMountOptions } from "@/helpers/unit-test-helper.js";
|
||||||
import store from "@/store";
|
import store from "@/store";
|
||||||
jest.mock("@/store", () => { return {}; }, {virtual: true});
|
jest.mock(
|
||||||
|
"@/store",
|
||||||
|
() => {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
{ virtual: true }
|
||||||
|
);
|
||||||
|
|
||||||
describe("make-question.vue", () => {
|
describe("make-question.vue", () => {
|
||||||
test("Selected make is emitted upon selection.", async () => {
|
test("Selected make is emitted upon selection.", async () => {
|
||||||
|
|
||||||
//Arrange
|
//Arrange
|
||||||
const { wrapper } = setupMocks({ modelValueProp: "honda" });
|
const { wrapper } = setupMocks({ modelValueProp: "honda" });
|
||||||
const makeToSelect = "ford";
|
const makeToSelect = "ford";
|
||||||
|
|
||||||
//Act
|
//Act
|
||||||
wrapper.setData({ selectedMake: makeToSelect });
|
wrapper.setValue({ selectedMake: makeToSelect });
|
||||||
await wrapper.vm.$nextTick();
|
await wrapper.vm.$nextTick();
|
||||||
|
|
||||||
//Assert
|
//Assert
|
||||||
expect(wrapper.emitted()["update:modelValue"][0]).toEqual(["ford"]);
|
expect(wrapper.emitted()["update:modelValue"][0]).toEqual([
|
||||||
|
{ selectedMake: "ford" },
|
||||||
|
]);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe("make-question.vue", () => {
|
describe("make-question.vue", () => {
|
||||||
test("CMS question text is used as radio question text.", async () => {
|
test("CMS question text is used as radio question text.", async () => {
|
||||||
|
|
||||||
//Arrange
|
//Arrange
|
||||||
const { wrapper, cmsContent } = setupMocks({ cmsQuestionText: "What make is your vehicle?" });
|
const { wrapper, cmsContent } = setupMocks({
|
||||||
|
cmsQuestionText: "What make is your vehicle?",
|
||||||
|
});
|
||||||
|
|
||||||
//Act
|
//Act
|
||||||
makeQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, null);
|
makeQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, null);
|
||||||
|
|
||||||
//Assert
|
//Assert
|
||||||
const buttonQuestionComponent = await wrapper.findComponent({ name: "buttonQuestion" });
|
const buttonQuestionComponent = await wrapper.findComponent({
|
||||||
expect(buttonQuestionComponent.attributes("questiontext")).toBe("What make is your vehicle?");
|
name: "buttonQuestion",
|
||||||
|
});
|
||||||
|
expect(buttonQuestionComponent.attributes("questiontext")).toBe(
|
||||||
|
"What make is your vehicle?"
|
||||||
|
);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe("make-question.vue", () => {
|
describe("make-question.vue", () => {
|
||||||
test("Data from store api are used as radio question answers.", async () => {
|
test("Data from store api are used as radio question answers.", async () => {
|
||||||
|
|
||||||
//Arrange
|
//Arrange
|
||||||
const { wrapper, cmsContent } = setupMocks({ dataFromStoreApi: ["honda", "ford", "dodge"] });
|
const { wrapper, cmsContent } = setupMocks({
|
||||||
|
dataFromStoreApi: ["honda", "ford", "dodge"],
|
||||||
|
});
|
||||||
|
|
||||||
//Act
|
//Act
|
||||||
const initialData = makeQuestion.methods.loadInitialData.call(wrapper.vm);
|
const initialData = makeQuestion.methods.loadInitialData.call(wrapper.vm);
|
||||||
makeQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, initialData);
|
makeQuestion.methods.initializeComponent.call(
|
||||||
|
wrapper.vm,
|
||||||
|
cmsContent,
|
||||||
|
initialData
|
||||||
|
);
|
||||||
|
|
||||||
//Assert
|
//Assert
|
||||||
const buttonQuestionComponent = await wrapper.findComponent({ name: "buttonQuestion" });
|
const buttonQuestionComponent = await wrapper.findComponent({
|
||||||
expect(buttonQuestionComponent.attributes("answers")).toBe("honda,ford,dodge");
|
name: "buttonQuestion",
|
||||||
|
});
|
||||||
|
expect(buttonQuestionComponent.attributes("answers")).toBe(
|
||||||
|
"honda,ford,dodge"
|
||||||
|
);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
function setupMocks({
|
function setupMocks({
|
||||||
modelValueProp = "1900",
|
modelValueProp = "1900",
|
||||||
cmsQuestionText = "CMS text goes here",
|
cmsQuestionText = "CMS text goes here",
|
||||||
dataFromStoreApi = [],
|
dataFromStoreApi = [],
|
||||||
}) {
|
}) {
|
||||||
|
|
||||||
//Mock store
|
//Mock store
|
||||||
store.dispatch = jest.fn(() => dataFromStoreApi);
|
store.dispatch = jest.fn(() => dataFromStoreApi);
|
||||||
store.getters = { vehicle: {year: 2019} };
|
store.getters = { vehicle: { year: 2019 } };
|
||||||
const mountOptions = getMountOptions({
|
const mountOptions = getMountOptions({
|
||||||
store: {
|
store: {
|
||||||
dispatch: store.dispatch,
|
dispatch: store.dispatch,
|
||||||
|
|
@ -76,7 +95,7 @@ function setupMocks({
|
||||||
|
|
||||||
//Mock CMS content
|
//Mock CMS content
|
||||||
const cmsContent = {
|
const cmsContent = {
|
||||||
QuestionText: cmsQuestionText
|
QuestionText: cmsQuestionText,
|
||||||
};
|
};
|
||||||
return { wrapper, cmsContent };
|
return { wrapper, cmsContent };
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,14 @@
|
||||||
<template>
|
<template>
|
||||||
<buttonQuestion class="radioQuestion"
|
<buttonQuestion
|
||||||
|
class="radioQuestion"
|
||||||
|
isOverflowScrollable
|
||||||
:questionText="questionText"
|
:questionText="questionText"
|
||||||
:answers="makes"
|
:answers="makes"
|
||||||
groupName="Choose Vehicle Make"
|
groupName="Choose Vehicle Make"
|
||||||
v-model="selectedMake"
|
textPosition="text-start"
|
||||||
|
:loaderEnabled="true"
|
||||||
|
v-model="selectedValueAsArray"
|
||||||
|
isRequired=true
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -19,29 +24,38 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
questionText: null,
|
questionText: null,
|
||||||
selectedMake: null,
|
|
||||||
makes: Array,
|
makes: Array,
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
modelValue: String,
|
modelValue: String,
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
selectedValueAsArray: {
|
||||||
|
get: function() {
|
||||||
|
const modelValueAsArray = this.modelValue ? [this.modelValue] : [];
|
||||||
|
return modelValueAsArray;
|
||||||
|
},
|
||||||
|
set: function(newValue) {
|
||||||
|
const newValueAsScalar = newValue && newValue.length > 0 ? newValue[0] : null;
|
||||||
|
this.$emit("update:modelValue", newValueAsScalar);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
components: {
|
components: {
|
||||||
buttonQuestion,
|
buttonQuestion,
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
loadInitialData() {
|
loadInitialData() {
|
||||||
return baseMixin.methods.dispatchNonBlockingStoreAction(storeActions.GET_VEHICLE_MAKES, {year: store.getters.vehicle.year});
|
return baseMixin.methods.dispatchNonBlockingStoreAction(
|
||||||
|
storeActions.GET_VEHICLE_MAKES,
|
||||||
|
{ year: store.getters.vehicle.year }
|
||||||
|
);
|
||||||
},
|
},
|
||||||
initializeComponent(cmsContent, initialData) {
|
initializeComponent(cmsContent, initialData) {
|
||||||
this.questionText = cmsContent.QuestionText;
|
this.questionText = cmsContent.QuestionText;
|
||||||
this.makes = initialData;
|
this.makes = initialData;
|
||||||
}
|
},
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
selectedMake(val) {
|
|
||||||
this.$emit("update:modelValue", val);
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue