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

Merge pull request #38 from Safelite/brm-misc-updates

Browse source 
Code cleanup after restructure.
This commit is contained in:
bmauger 2021-11-04 15:50:15 -04:00 committed by GitHub
commit e5ac935964
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 80 additions and 90 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/assets/img/icons/button-spinner-green.svg → src/assets/img/icons/button-spinner-blue.svg
View file

@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" xml:space="preserve">
<path d="M2.1 16C2.1 8.3 8.3 2.1 16 2.1c3.8 0 7.2 1.5 9.7 4l1.4-1.4C24.3 1.9 20.3.1 16 .1 7.2.1.1 7.3.1 16.1l2-.1c0 .1 0 0 0 0z" fill="#73e5b9"/>
<path d="M2.1 16C2.1 8.3 8.3 2.1 16 2.1c3.8 0 7.2 1.5 9.7 4l1.4-1.4C24.3 1.9 20.3.1 16 .1 7.2.1.1 7.3.1 16.1l2-.1c0 .1 0 0 0 0z" fill="#167CAC"/>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 237 B

After

Width:  |  Height:  |  Size: 237 B

61
src/assets/scss/components/_SelectCar.scss
View file

@ -1,61 +0,0 @@
.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;
}

6
src/assets/scss/components/_navbar.scss
View file

@ -1,6 +0,0 @@
.navbar {
.logo {
width: 114px;
height: auto;
}
}

6
src/assets/scss/components/_vehicle-image.scss
View file

@ -1,6 +0,0 @@
.vehicle-image {
padding: 6px;
&.blur {
filter: blur(6px);
}
}

81
src/styles/commonStyles.scss
View file

@ -103,14 +103,14 @@ caption {
}
}
}
}
&:disabled {
background: $gray-100 !important;
background: linear-gradient(270deg, $gray-100 0%, $gray-100 100%) !important;
color: $gray !important;
height: 48px;
border: none;
border-radius: $border-radius-lg;
&:disabled {
background: $gray-100 !important;
background: linear-gradient(270deg, $gray-100 0%, $gray-100 100%) !important;
color: $gray !important;
height: 48px;
border: none;
border-radius: $border-radius-lg;
}
}
&.list-button {
position: relative;
@ -127,7 +127,7 @@ caption {
&.button-loader {
padding: 0 40px 0 12px;
&:after {
content: url(../../assets/img/icons/button-spinner-green.svg);
content: url(../../assets/img/icons/button-spinner-blue.svg);
position: absolute;
right: 14px;
width: 16px;
@ -143,3 +143,66 @@ caption {
}
}
}
// 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;
}

10
src/styles/uxStyles.scss → src/styles/uxVariables.scss
View file

@ -115,11 +115,11 @@ $font-family-code: $font-family-monospace;
$font-size-base: 1rem; // Assumes the browser default, typically `16px`
//Font weight
$font-weight-lighter: lighter !default;
$font-weight-light: 300 !default;
$font-weight-normal: 400 !default;
$font-weight-bold: 500 !default;
$font-weight-bolder: bolder !default;
$font-weight-lighter: lighter;
$font-weight-light: 300;
$font-weight-normal: 400;
$font-weight-bold: 500;
$font-weight-bolder: bolder;
//Headings
$h1-font-size: $font-size-base * 3;

2
vue.config.js
View file

@ -18,7 +18,7 @@ module.exports = {
sass: { // Load Order Matters!!!
prependData: `
@import "./node_modules/bootstrap/scss/functions";
@import "@/styles/uxStyles.scss";
@import "@/styles/uxVariables.scss";
@import "./node_modules/bootstrap/scss/variables";
@import "./node_modules/bootstrap/scss/mixins";
@import "./node_modules/bootstrap/scss/bootstrap";

2
vue.release.config.js
View file

@ -8,7 +8,7 @@ module.exports = {
sass: { // Load Order Matters!!!
prependData: `
@import "./node_modules/bootstrap/scss/functions";
@import "@/styles/uxStyles.scss";
@import "@/styles/uxVariables.scss";
@import "./node_modules/bootstrap/scss/variables";
@import "./node_modules/bootstrap/scss/mixins";
@import "./node_modules/bootstrap/scss/bootstrap";