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

Adding new styling

Browse source
This commit is contained in:
Max 2021-11-05 16:29:44 -04:00
parent 8b540b722b
commit ed32135565
1 changed files with 46 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

87
src/styles/commonComponentStyles/ymmsCommonStyles.scss
View file

@ -1,61 +1,66 @@
.vehicle-select-attributes {
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;
}
// SelectCar styles
.select-car {
height: calc(100vh - 1rem);
.car_list {
position: absolute;
height: calc(100% - 1rem);
width: calc(100% - 1rem);
overflow-y: scroll;
overflow-x: hidden;
}
.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 {
.back-button {
margin-left: 5px;
img {
width: 20px;
}
}
}
.slide-enter-from {
opacity: 0;
transform: translateX(30vw);
}
.slide-enter-active, .slide-leave-active {
}
.slide-enter-active, .slide-leave-active {
transition: all .4s;
}
.slide-leave-to {
}
.slide-leave-to {
opacity: 0;
transform: translateX(-30vw);
}
.slide_reverse-enter-from {
}
.slide_reverse-enter-from {
opacity: 0;
transform: translateX(-30vw);
}
.slide_reverse-enter-active, .slide_reverse-leave-active {
}
.slide_reverse-enter-active, .slide_reverse-leave-active {
transition: all .4s;
}
.slide_reverse-leave-to {
}
.slide_reverse-leave-to {
opacity: 0;
transform: translateX(30vw);
}
.fade-enter-from, .fade-leave-to {
}
.fade-enter-from, .fade-leave-to {
opacity: 0;
}
.fade-enter-active, .fade-leave-active {
}
.fade-enter-active, .fade-leave-active {
transition: all .5s ease;
}
}