jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Created vehicleSelectAttributes.scss and moved style to global file.

Browse source
This commit is contained in:
Bryan 2021-11-05 14:12:11 -04:00
parent 086ddcc786
commit 9d85b39d7c
4 changed files with 63 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
src/layouts/selectYear/selectYear.vue
View file

@ -58,68 +58,3 @@ export default {
},
};
</script>
<style lang="scss">
// SelectCar styles
.select-car {
height: 100vh;
.select-car-form {
background: $white;
height: 100%;
form {
height: calc(100% - 230px);
overflow-y: scroll;
overflow-x: hidden;
}
.car_list, .current_car_info-text, .needed_car_info-text {
flex-shrink: 0;
width: 100%;
position: relative;
transition: transform .3s;
}
}
.current_car_info {
position: relative;
min-height: 2.5rem;
.current_car_info-text {
position: absolute;
}
}
}
.slide-enter-from {
opacity: 0;
transform: translateX(30vw);
}
.slide-enter-active, .slide-leave-active {
transition: all .4s;
}
.slide-leave-to {
opacity: 0;
transform: translateX(-30vw);
}
.slide_reverse-enter-from {
opacity: 0;
transform: translateX(-30vw);
}
.slide_reverse-enter-active, .slide_reverse-leave-active {
transition: all .4s;
}
.slide_reverse-leave-to {
opacity: 0;
transform: translateX(30vw);
}
.fade-enter-from, .fade-leave-to {
opacity: 0;
}
.fade-enter-active, .fade-leave-active {
transition: all .5s ease;
}
</style>

61
src/styles/vehicleSelectAttributes.scss Normal file
View file

@ -0,0 +1,61 @@
.select-car {
height: 100vh;
.select-car-form {
background: $white;
height: 100%;
form {
height: calc(100% - 230px);
overflow-y: scroll;
overflow-x: hidden;
}
.car_list, .current_car_info-text, .needed_car_info-text {
flex-shrink: 0;
width: 100%;
position: relative;
transition: transform .3s;
}
}
.current_car_info {
position: relative;
min-height: 2.5rem;
.current_car_info-text {
position: absolute;
}
}
}
.slide-enter-from {
opacity: 0;
transform: translateX(30vw);
}
.slide-enter-active, .slide-leave-active {
transition: all .4s;
}
.slide-leave-to {
opacity: 0;
transform: translateX(-30vw);
}
.slide_reverse-enter-from {
opacity: 0;
transform: translateX(-30vw);
}
.slide_reverse-enter-active, .slide_reverse-leave-active {
transition: all .4s;
}
.slide_reverse-leave-to {
opacity: 0;
transform: translateX(30vw);
}
.fade-enter-from, .fade-leave-to {
opacity: 0;
}
.fade-enter-active, .fade-leave-active {
transition: all .5s ease;
}

1
vue.config.js
View file

@ -25,6 +25,7 @@ module.exports = {
@import "@/styles/commonStyles.scss";
@import "@/styles/commonButtonStyles.scss";
@import "@/styles/commonTypographyStyles.scss";
@import "@/styles/vehicleSelectAttributes.scss";
`
}
}

1
vue.release.config.js
View file

@ -15,6 +15,7 @@ module.exports = {
@import "@/styles/commonStyles.scss";
@import "@/styles/commonButtonStyles.scss";
@import "@/styles/commonTypographyStyles.scss";
@import "@/styles/vehicleSelectAttributes.scss";
`
}
}