Skip to content

D
dcarfixers_angular
Commit 9be3f7a7 by Tobin
Options

Merge branch 'master' of https://gitlab.techware.co.in/tobin/dcarfixers_angular into tobin

# Conflicts: # src/app/home/dashboard/dashboard.component.html # src/styles.scss
parents af0f06d1 5ba2e708
Showing with 953 additions and 906 deletions
package-lock.json
...@@ -646,6 +646,14 @@ ...@@ -646,6 +646,14 @@
"tslib": "^1.9.0" "tslib": "^1.9.0"
} }
}, },
"@angular/http": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/@angular/http/-/http-7.2.0.tgz",
"integrity": "sha512-CoEwfh9LSpyXUh/077nvy1Hheo6mmIFKOmnyo9V7JaesGJYkYpEIVFYFP1hYg7f8snKHclT3gqfQX+BynNhExQ==",
"requires": {
"tslib": "^1.9.0"
}
},
"@angular/language-service": { "@angular/language-service": {
"version": "7.1.3", "version": "7.1.3",
"resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-7.1.3.tgz", "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-7.1.3.tgz",
...@@ -836,6 +844,14 @@ ...@@ -836,6 +844,14 @@
} }
} }
}, },
"@google/maps": {
"version": "0.5.5",
"resolved": "https://registry.npmjs.org/@google/maps/-/maps-0.5.5.tgz",
"integrity": "sha512-RSZriyE2XViVhXgdEcQaEu3jMYh2A/jS0VahLHXqGO0VfPyEbDac4PAn7/hBJiTavWpxchKfe5OI9inJofFWxA==",
"requires": {
"uuid": ">=2.2.1"
}
},
"@ngtools/webpack": { "@ngtools/webpack": {
"version": "7.1.4", "version": "7.1.4",
"resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-7.1.4.tgz", "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-7.1.4.tgz",
...@@ -6702,6 +6718,19 @@ ...@@ -6702,6 +6718,19 @@
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=", "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
"dev": true "dev": true
}, },
"mt-geo": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/mt-geo/-/mt-geo-1.0.1.tgz",
"integrity": "sha1-7HSEZb5amqKO6fzZUDXIoSAILzo="
},
"mt-latlon": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/mt-latlon/-/mt-latlon-0.1.1.tgz",
"integrity": "sha1-rMKNKZVjm4Vkp0DTzKPoaLILgA4=",
"requires": {
"mt-geo": "1.0.1"
}
},
"multicast-dns": { "multicast-dns": {
"version": "6.2.3", "version": "6.2.3",
"resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.2.3.tgz", "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.2.3.tgz",
...@@ -6765,6 +6794,11 @@ ...@@ -6765,6 +6794,11 @@
"resolved": "https://registry.npmjs.org/ng2-archwizard/-/ng2-archwizard-2.1.0.tgz", "resolved": "https://registry.npmjs.org/ng2-archwizard/-/ng2-archwizard-2.1.0.tgz",
"integrity": "sha1-3queX3IRRizO+oggdmBGPN9eStI=" "integrity": "sha1-3queX3IRRizO+oggdmBGPN9eStI="
}, },
"ng2-file-upload": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/ng2-file-upload/-/ng2-file-upload-1.3.0.tgz",
"integrity": "sha512-Pudxik6LWYsT8hNiEW7RfjgGWAnvfQywxwJYMdt1snTUe+KnlRc/QqPv3QEQW6plXTanuLkYz/TbqilSfSHOsw=="
},
"ngx-carousel": { "ngx-carousel": {
"version": "1.3.5", "version": "1.3.5",
"resolved": "https://registry.npmjs.org/ngx-carousel/-/ngx-carousel-1.3.5.tgz", "resolved": "https://registry.npmjs.org/ngx-carousel/-/ngx-carousel-1.3.5.tgz",
......
package.json
...@@ -17,16 +17,20 @@ ...@@ -17,16 +17,20 @@
"@angular/compiler": "~7.1.0", "@angular/compiler": "~7.1.0",
"@angular/core": "~7.1.0", "@angular/core": "~7.1.0",
"@angular/forms": "~7.1.0", "@angular/forms": "~7.1.0",
"@angular/http": "^7.2.0",
"@angular/platform-browser": "~7.1.0", "@angular/platform-browser": "~7.1.0",
"@angular/platform-browser-dynamic": "~7.1.0", "@angular/platform-browser-dynamic": "~7.1.0",
"@angular/router": "~7.1.0", "@angular/router": "~7.1.0",
"@google/maps": "^0.5.5",
"angular-star-rating": "^4.0.0-beta.3", "angular-star-rating": "^4.0.0-beta.3",
"angular-wizard-form": "^0.4.1", "angular-wizard-form": "^0.4.1",
"bootstrap": "^4.1.3", "bootstrap": "^4.1.3",
"core-js": "^2.5.4", "core-js": "^2.5.4",
"hammerjs": "^2.0.8", "hammerjs": "^2.0.8",
"jquery": "^3.3.1", "jquery": "^3.3.1",
"mt-latlon": "^0.1.1",
"ng2-archwizard": "^2.1.0", "ng2-archwizard": "^2.1.0",
"ng2-file-upload": "^1.3.0",
"ngx-carousel": "^1.3.5", "ngx-carousel": "^1.3.5",
"ngx-google-places-autocomplete": "^2.0.3", "ngx-google-places-autocomplete": "^2.0.3",
"ngx-slick": "^0.2.1", "ngx-slick": "^0.2.1",
......
src/app/app-routing.module.ts
...@@ -6,7 +6,7 @@ const routes: Routes = [ ...@@ -6,7 +6,7 @@ const routes: Routes = [
]; ];
@NgModule({ @NgModule({
imports: [RouterModule.forRoot(routes, { useHash: true })], imports: [RouterModule.forRoot(routes, { useHash: false })],
exports: [RouterModule] exports: [RouterModule]
}) })
export class AppRoutingModule { } export class AppRoutingModule { }
src/app/home/dashboard/dashboard.component.html
...@@ -768,3 +768,17 @@ ...@@ -768,3 +768,17 @@
</div> </div>
<!-- QUOTES-MODAL-ENDS--> <!-- QUOTES-MODAL-ENDS-->
<!-- BOOKING-SUCCESS-MODAL-STARTS -->
<div class="modal" id="success">
<div class="modal-dialog modal-full">
<div class="modal-content login_modal_wrapper">
GDGDG
</div>
</div>
</div>
<!-- BOOKING-SUCCESS-MODAL-ENDS -->
src/app/home/dashboard/dashboard.component.scss
...@@ -111,7 +111,7 @@ ...@@ -111,7 +111,7 @@
} }
} }
} }
.service-align-center{ .service-align-center {
padding-left: 0px !important; padding-left: 0px !important;
text-align: center; text-align: center;
} }
...@@ -152,10 +152,8 @@ ...@@ -152,10 +152,8 @@
// width: calc(100% - 120px); // width: calc(100% - 120px);
width: 100%; width: 100%;
float: left; float: left;
padding-top: 0px; padding-top: 0px;
padding-bottom: 0px; padding-bottom: 0px;
h5 { h5 {
color: #2655bf; color: #2655bf;
font-size: 18px; font-size: 18px;
...@@ -547,811 +545,761 @@ ...@@ -547,811 +545,761 @@
.address_height { .address_height {
height: 65px !important; height: 65px !important;
} }
.login_modal_wrapper { .login_modal_wrapper {
background: url("/assets/images/asset_login_bg.png"); background: url("/assets/images/asset_login_bg.png");
background-position: center; background-position: center;
background-repeat: no-repeat;
position: relative;
overflow: scroll;
.modal_close {
width: 50px;
height: 50px;
border: 1px solid #fff;
position: fixed;
top: 10px;
right: 10px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
z-index: 999;
color: #fff;
text-align: center;
font-size: 30px;
padding: 0px;
font-weight: 700;
cursor: pointer;
}
.login_modal_content {
max-width: 700px;
min-height: 400px;
background: #ffffff;
margin: 0 auto;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
padding: 30px;
padding-top: 50px;
position: relative;
top: 85px;
.login_modal_inner {
width: 90%;
margin: 0 auto;
h3 {
text-align: center;
text-transform: uppercase;
color: #1e1e1e;
font-weight: 600;
padding-bottom: 10px;
}
.facebook_btn {
background-color: #3b5998;
color: #fff;
text-align: center;
width: 100%;
height: 45px;
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border: none;
font-size: 20px;
font-weight: 300;
&:focus {
outline: none;
}
img {
margin-left: 10px;
}
}
h6 {
text-align: center;
width: 100%;
margin: 0px;
padding: 0px;
}
.search {
background: url("/assets/images/asset_search.png");
background-position: right 10px top 5px;
background-repeat: no-repeat;
padding-right: 50px;
}
input {
border: 1px solid #1e1e1e;
height: 40px;
width: 100%;
border-radius: 25px;
padding-left: 15px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
-ms-border-radius: 25px;
-o-border-radius: 25px;
text-align: left;
font-size: 16px;
&::placeholder {
color: #bbbbbb;
}
&:focus {
outline: none;
}
}
select {
border: 1px solid #1e1e1e;
background: url("/assets/images/asset_down_arrow.png");
height: 40px;
width: 100%;
padding-left: 15px;
border-radius: 25px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
-ms-border-radius: 25px;
-o-border-radius: 25px;
text-align: center;
-webkit-appearance: none;
-moz-appearance: none;
font-size: 16px;
cursor: pointer;
background-position: right 10px top 10px;
background-repeat: no-repeat; background-repeat: no-repeat;
&::placeholder { position: relative;
color: #bbbbbb; overflow: scroll;
} .modal_close {
&:focus { width: 50px;
outline: none; height: 50px;
} border: 1px solid #fff;
} position: fixed;
.row { top: 10px;
margin-bottom: 25px; right: 10px;
} border-radius: 50%;
.next_btn { -webkit-border-radius: 50%;
background-image: url("/assets/images/asset_double_right.png"); -moz-border-radius: 50%;
background-position: right 10px top 10px; -ms-border-radius: 50%;
} -o-border-radius: 50%;
.prev_btn { z-index: 999;
background-image: url("/assets/images/asset_double_left.png"); color: #fff;
background-position: left 10px top 10px; text-align: center;
} font-size: 30px;
.log_btn { padding: 0px;
height: 40px; font-weight: 700;
width: 160px;
border-radius: 25px;
color: #fff;
background-color: #2655bf;
border: none;
font-size: 16px;
font-weight: 300;
background-repeat: no-repeat;
background-size: 20px;
&:focus {
outline: none;
}
}
.log_btn_diabled{
cursor: not-allowed;
background: #929292;
}
.wizard_signin {
height: 40px;
width: 48%;
display: inline-block;
border-radius: 25px;
color: #2655bf;
border: 2px solid #2655bf;
background: transparent;
font-size: 16px;
font-weight: 500;
background-repeat: no-repeat;
background-size: 20px;
margin:3px;
&:focus {
outline: none;
}
}
.wizard_quotes {
height: 40px;
width: 48%;
margin:3px;
display: inline-block;
border-radius: 25px;
color: #fff;
border: 2px solid #2655bf;
background: #2655bf;
font-size: 16px;
font-weight: 500;
background-repeat: no-repeat;
background-size: 20px;
&:focus {
outline: none;
}
}
.create_account {
background-image: url("/assets/images/asset_signin.png");
background-repeat: no-repeat;
background-position: right 13px top 7px;
}
p {
text-align: center;
color: #2655bf;
width: 100%;
font-size: 16px;
cursor: pointer;
}
h6 {
text-align: center;
width: 100%;
font-size: 16px;
a {
color: #2655bf;
margin-left: 5px;
margin-right: 5px;
cursor: pointer; cursor: pointer;
} }
} .login_modal_content {
} max-width: 700px;
} min-height: 400px;
} background: #ffffff;
.wizard_inner { margin: 0 auto;
width: 100%; border-radius: 10px;
.add_images { -webkit-border-radius: 10px;
width: 100%; -moz-border-radius: 10px;
ul { -ms-border-radius: 10px;
margin: 0px; -o-border-radius: 10px;
padding: 0px; padding: 30px;
text-align: center; padding-top: 50px;
li {
list-style: none;
width: 80px;
height: 90px;
border: 1px dashed #a8a8a8;
display: inline-block;
text-align: center;
position: relative;
margin: 4px;
span {
position: relative; position: relative;
font-size: 50px; top: 85px;
top: 5px; .login_modal_inner {
} width: 90%;
img { margin: 0 auto;
width: 100%; h3 {
height: 100%; text-align: center;
object-fit: cover; text-transform: uppercase;
object-position: center;
}
input {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
opacity: 0;
height: 120px;
}
}
}
}
.service_methods{
max-height: 200px;
overflow: scroll;
ul{
padding:0px;
margin:0px;
li{
list-style: none;
width: 100%;
color: #060708;
border:1px dashed #929292;
cursor: pointer;
padding: 5px;
margin-bottom: 10px;
padding-left: 15px;
background-image: url("/assets/images/asset_down_time_arrow.png");
background-position: right 5px top 2px;
background-repeat: no-repeat;
background-size: 30px;
}
.service_list {
ul {
padding: 0px;
margin: 0px;
padding-top: 0px;
li {
list-style: none;
display: inline-block;
position: relative;
min-width: 100%;
margin: 0px;
padding: 0px;
border:none;
background-image: none;
margin-bottom: 5px;
#custom_check_button {
margin: 0px;
background-color: #fff;
border-radius: 0px !important;
overflow: auto;
color: #1e1e1e; color: #1e1e1e;
border: 1px solid #e7e7e7; font-weight: 600;
position: relative; padding-bottom: 10px;
height: 30px; }
outline: none; .facebook_btn {
background-color: #3b5998;
color: #fff;
text-align: center;
width: 100%; width: 100%;
height: 45px;
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border: none;
font-size: 20px;
font-weight: 300;
&:focus {
outline: none;
}
img {
margin-left: 10px;
}
} }
#custom_check_button p { h6 {
text-align: center;
width: 100%;
margin: 0px; margin: 0px;
position: absolute; padding: 0px;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
padding: 2px;
color: #1e1e1e;
text-transform: uppercase;
} }
#custom_check_button label { .search {
background: url("/assets/images/asset_search.png");
background-position: right 10px top 5px;
background-repeat: no-repeat;
padding-right: 50px;
}
input {
border: 1px solid #1e1e1e;
height: 40px;
width: 100%; width: 100%;
margin: 0px; border-radius: 25px;
padding-left: 15px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
-ms-border-radius: 25px;
-o-border-radius: 25px;
text-align: left;
font-size: 16px;
&::placeholder {
color: #bbbbbb;
}
&:focus {
outline: none;
}
} }
#custom_check_button label span { select {
border: 1px solid #1e1e1e;
background: url("/assets/images/asset_down_arrow.png");
height: 40px;
width: 100%;
padding-left: 15px;
border-radius: 25px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
-ms-border-radius: 25px;
-o-border-radius: 25px;
text-align: center; text-align: center;
display: block; -webkit-appearance: none;
-moz-appearance: none;
font-size: 16px;
cursor: pointer;
background-position: right 10px top 10px;
background-repeat: no-repeat;
&::placeholder {
color: #bbbbbb;
}
&:focus {
outline: none;
}
} }
#custom_check_button label input { .row {
position: absolute; margin-bottom: 25px;
left: 0px;
bottom: 0px;
right: 0px;
opacity: 0;
} }
#custom_check_button input:checked+p { .next_btn {
background-color: #58b19f; background-image: url("/assets/images/asset_double_right.png");
color: #fff; background-position: right 10px top 10px;
border-radius:0px !important;
margin: 0px;
} }
} .prev_btn {
} background-image: url("/assets/images/asset_double_left.png");
} background-position: left 10px top 10px;
} }
} .log_btn {
height: 40px;
.textarea_input { width: 160px;
width: 100%; border-radius: 25px;
border: 1px solid #1e1e1e; color: #fff;
color: #bfbfbf; background-color: #2655bf;
padding-top: 10px; border: none;
border-radius: 20px; font-size: 16px;
-webkit-border-radius: 20px; font-weight: 300;
-moz-border-radius: 20px; background-repeat: no-repeat;
-ms-border-radius: 20px; background-size: 20px;
-o-border-radius: 20px; &:focus {
text-align: left !important; outline: none;
&:focus {
outline: none;
}
}
.selected_services {
ul {
margin: 0px;
padding: 0px;
li {
list-style: none;
display: inline-block;
padding-left: 15px;
padding-right: 15px;
border: 1px solid #1e1e1e;
border-radius: 25px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
-ms-border-radius: 25px;
-o-border-radius: 25px;
text-align: center;
color: #1e1e1e;
margin: 3px;
a {
margin-left: 10px;
cursor: pointer;
font-weight: 600;
}
}
}
}
}
.quote_service_wrapper {
width: 90%;
background: #f5f5f5;
margin: 0 auto;
min-height: 500px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
padding: 20px;
.quote_header {
width: 100%;
padding: 10px;
h4 {
margin: 0px;
padding: 0px;
color: #1e1e1e;
padding-bottom: 10px;
font-size: 20px;
font-weight: 600;
}
p {
margin: 0px;
padding: 0px;
color: #4e4e4e;
font-weight: 400;
font-size: 15px;
}
}
.quote_schedule_header {
background: #f9f7f7;
border: 1px solid #e8e8e8;
h4 {
margin: 0px;
color: #1e1e1e;
font-size: 18px;
padding: 10px;
}
.quote_arrow {
height: 40px;
width: 40px;
margin: 0px;
padding: 0px;
background: transparent;
border: none;
background-repeat: no-repeat;
background-position: center;
&:focus {
outline: none;
}
}
.quote_arrow.left {
background-image: url("/assets/images/asset_quote_left.png");
}
.quote_arrow.right {
background-image: url("/assets/images/asset_quote_right.png");
}
.schedule_dates {
width: calc(100% - 80px);
height: 35px;
ul {
padding: 0px;
margin: 0px;
li {
list-style: none;
display: inline-block;
width: 50%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height: 40px;
background: #2655bf;
color: #fff;
font-size: 14px;
text-align: center;
padding: 7px;
border: 2px solid #f9f7f7;
}
}
}
}
.quote_schedule_list {
border: 1px solid #e8e8e8;
background: #ffffff;
ul {
margin: 0px;
padding: 0px;
max-height: 500px;
overflow: scroll;
li {
list-style: none;
padding: 10px;
border-bottom: 10px solid #f5f5f5;
.mechanic_profile {
padding: 5px;
.mechanic_profile_inner {
background: #fbfbfb;
padding: 10px;
padding-right: 0px;
.mechanic_photo_wrapper {
float: left;
width: 100px;
.mechanic_photo {
width: 100px;
height: 100px;
background: #bfbfbf;
margin-bottom: 5px;
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
} }
.rating { }
.star-container { .log_btn_diabled {
.star { cursor: not-allowed;
font-size: 16px; background: #929292;
} }
} .wizard_signin {
height: 40px;
width: 48%;
display: inline-block;
border-radius: 25px;
color: #2655bf;
border: 2px solid #2655bf;
background: transparent;
font-size: 16px;
font-weight: 500;
background-repeat: no-repeat;
background-size: 20px;
margin: 3px;
&:focus {
outline: none;
} }
} }
.mechanic_detail { .wizard_quotes {
width: calc(100% - 100px); height: 40px;
float: left; width: 48%;
padding: 10px; margin: 3px;
padding-left: 15px; display: inline-block;
padding-top: 0px; border-radius: 25px;
h4 { color: #fff;
margin: 0px; border: 2px solid #2655bf;
padding: 0px; background: #2655bf;
font-size: 15px; font-size: 16px;
color: #060708; font-weight: 500;
padding-bottom: 5px; background-repeat: no-repeat;
background-size: 20px;
&:focus {
outline: none;
} }
h5 { }
margin: 0px; .create_account {
padding: 0px; background-image: url("/assets/images/asset_signin.png");
font-size: 15px; background-repeat: no-repeat;
background-position: right 13px top 7px;
}
p {
text-align: center;
color: #2655bf;
width: 100%;
font-size: 16px;
cursor: pointer;
}
h6 {
text-align: center;
width: 100%;
font-size: 16px;
a {
color: #2655bf; color: #2655bf;
margin-left: 5px;
margin-right: 5px;
cursor: pointer;
} }
p { }
margin: 0px; }
padding: 0px; }
color: #767676; }
font-size: 16px;
line-height: 20px; .wizard_inner {
padding-top: 5px; width: 100%;
} .add_images {
h6 { width: 100%;
color: #959595; ul {
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
background-image: url("/assets/images/asset_call.png"); text-align: center;
background-repeat: no-repeat; li {
padding: 8px; list-style: none;
background-size: 16px; width: 80px;
padding-left: 30px; height: 90px;
background-position: 5px; border: 1px dashed #a8a8a8;
} display: inline-block;
.view_profile { text-align: center;
border: 1px solid #898989; position: relative;
color: #898989; margin: 4px;
background: transparent; span {
margin: 5px; position: relative;
padding-left: 15px; font-size: 50px;
padding-right: 15px; top: 5px;
border-radius: 20px;
height: 35px;
font-size: 14px;
&:focus {
outline: none;
}
} }
.book_now { img {
float:right; width: 100%;
border: 1px solid #2655bf; height: 100%;
color: #2655bf; object-fit: cover;
background: transparent; object-position: center;
margin: 5px;
padding-left: 15px;
padding-right: 15px;
border-radius: 20px;
height: 35px;
font-size: 14px;
&:focus {
outline: none;
}
} }
.book_now_disabled{ input {
float:right; position: absolute;
border: 1px solid #808080; top: 0px;
color: #808080; left: 0px;
background: transparent; right: 0px;
margin: 5px; bottom: 0px;
padding-left: 15px; opacity: 0;
padding-right: 15px; height: 120px;
border-radius: 20px;
height: 35px;
font-size: 14px;
&:focus {
outline: none;
}
pointer-events: none;
cursor: default;
text-decoration: none;
} }
} }
} }
.offer{ }
.service_methods {
color: #a8a8a8; max-height: 200px;
text-align: justify; overflow: scroll;
font-size: 12px; ul {
.panel-heading{ padding: 0px;
padding: 10px; margin: 0px;
margin-bottom: 5px; li {
list-style: none;
width: 100%;
color: #060708;
border: 1px dashed #929292;
cursor: pointer;
padding: 5px;
margin-bottom: 10px;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; background-image: url("/assets/images/asset_down_time_arrow.png");
background-color: #2655bf; background-position: right 5px top 2px;
background-image: url("/assets/images/asset_double_right.png");
background-position: right 10px top 8px;
background-repeat: no-repeat; background-repeat: no-repeat;
.panel-title{ background-size: 30px;
padding: 0px;
margin:0px;
a{
color: #fff;
font-weight: 300;
font-size: 15px;
}
}
} }
.panel-collapse{ .service_list {
background-color: #f5f5f5; ul {
padding: 0px;
.panel-body{ margin: 0px;
font-size: 15px; padding-top: 0px;
font-weight: 400; li {
.row{ list-style: none;
padding:10px; display: inline-block;
border-bottom: 1px solid #fff; position: relative;
min-width: 100%;
margin: 0px;
padding: 0px;
border: none;
background-image: none;
margin-bottom: 5px;
#custom_check_button {
margin: 0px;
background-color: #fff;
border-radius: 0px !important;
overflow: auto;
color: #1e1e1e;
border: 1px solid #e7e7e7;
position: relative;
height: 30px;
outline: none;
width: 100%;
}
#custom_check_button p {
margin: 0px;
position: absolute;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
padding: 2px;
color: #1e1e1e;
text-transform: uppercase;
}
#custom_check_button label {
width: 100%;
margin: 0px;
}
#custom_check_button label span {
text-align: center;
display: block;
}
#custom_check_button label input {
position: absolute;
left: 0px;
bottom: 0px;
right: 0px;
opacity: 0;
}
#custom_check_button input:checked+p {
background-color: #58b19f;
color: #fff;
border-radius: 0px !important;
margin: 0px;
}
} }
} }
} }
}
} }
.textarea_input {
width: 100%;
border: 1px solid #1e1e1e;
color: #bfbfbf;
padding-top: 10px;
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
text-align: left !important;
&:focus {
outline: none;
}
} }
.scheduletiming_listing { .selected_services {
width: calc(100% - 80px);
margin: 0 auto;
height: 200px;
position: relative;
left: 5px;
ul { ul {
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
width: 50%;
height: 100%;
overflow: scroll;
display: inline-block;
position: relative;
#custom_check_button {
border-radius: 0px !important;
overflow: auto;
position: relative;
outline: none;
color: #908d8d;
-webkit-border-radius: 0px !important;
-moz-border-radius: 0px !important;
-ms-border-radius: 0px !important;
-o-border-radius: 0px !important;
}
#custom_check_button p {
margin: 0px;
position: absolute;
color: #908d8d;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
padding: 5px;
cursor: pointer;
}
#custom_check_button label {
width: 100%;
}
#custom_check_button label span {
text-align: center;
display: block;
}
#custom_check_button label input {
position: absolute;
top: -20px;
}
#custom_check_button input:checked+p {
background-color: #ef5958;
color: #fff;
border-radius: 0px !important;
margin: 0px;
-webkit-border-radius: 0px !important;
-moz-border-radius: 0px !important;
-ms-border-radius: 0px !important;
-o-border-radius: 0px !important;
}
li { li {
width: 100%; list-style: none;
background: #f5f5f5; display: inline-block;
color: #908d8d; padding-left: 15px;
padding-right: 15px;
border: 1px solid #1e1e1e;
border-radius: 25px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
-ms-border-radius: 25px;
-o-border-radius: 25px;
text-align: center; text-align: center;
padding: 7px; color: #1e1e1e;
border: 1px solid #fff; margin: 3px;
cursor: pointer; a {
margin-left: 10px;
cursor: pointer;
font-weight: 600;
}
} }
} }
} }
.scheduletiming_btm_btns { }
width: calc(100% - 80px);
position: relative; .quote_service_wrapper {
left: 5px; width: 90%;
margin: 0 auto; background: #f5f5f5;
.btm_btns { margin: 0 auto;
width: 50%; min-height: 500px;
display: inline-block; border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
padding: 20px;
.quote_header {
width: 100%;
padding: 10px;
h4 {
margin: 0px;
padding: 0px;
color: #1e1e1e;
padding-bottom: 10px;
font-size: 20px;
font-weight: 600;
}
p {
margin: 0px;
padding: 0px;
color: #4e4e4e;
font-weight: 400;
font-size: 15px;
}
}
.quote_schedule_header {
background: #f9f7f7;
border: 1px solid #e8e8e8;
h4 {
margin: 0px;
color: #1e1e1e;
font-size: 18px;
padding: 10px;
}
.quote_arrow {
height: 40px; height: 40px;
text-align: center; width: 40px;
background-image: url("/assets/images/asset_down_time_arrow.png"); margin: 0px;
background-color: #f5f5f5; padding: 0px;
border: 1px solid #fff; background: transparent;
background-position: center; border: none;
background-repeat: no-repeat; background-repeat: no-repeat;
cursor: pointer; background-position: center;
background-size: 25px; &:focus {
outline: none;
}
}
.quote_arrow.left {
background-image: url("/assets/images/asset_quote_left.png");
}
.quote_arrow.right {
background-image: url("/assets/images/asset_quote_right.png");
}
.schedule_dates {
width: calc(100% - 80px);
height: 35px;
ul {
padding: 0px;
margin: 0px;
li {
list-style: none;
display: inline-block;
width: 50%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
height: 40px;
background: #2655bf;
color: #fff;
font-size: 14px;
text-align: center;
padding: 7px;
border: 2px solid #f9f7f7;
}
}
}
}
.quote_schedule_list {
border: 1px solid #e8e8e8;
background: #ffffff;
ul {
margin: 0px;
padding: 0px;
max-height: 500px;
overflow: scroll;
li {
list-style: none;
padding: 10px;
border-bottom: 10px solid #f5f5f5;
.mechanic_profile {
padding: 5px;
.mechanic_profile_inner {
background: #fbfbfb;
padding: 10px;
padding-right: 0px;
.mechanic_photo_wrapper {
float: left;
width: 100px;
.mechanic_photo {
width: 100px;
height: 100px;
background: #bfbfbf;
margin-bottom: 5px;
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
}
.rating {
.star-container {
.star {
font-size: 16px;
}
}
}
}
.mechanic_detail {
width: calc(100% - 100px);
float: left;
padding: 10px;
padding-left: 15px;
padding-top: 0px;
h4 {
margin: 0px;
padding: 0px;
font-size: 15px;
color: #060708;
padding-bottom: 5px;
}
h5 {
margin: 0px;
padding: 0px;
font-size: 15px;
color: #2655bf;
}
p {
margin: 0px;
padding: 0px;
color: #767676;
font-size: 16px;
line-height: 20px;
padding-top: 5px;
}
h6 {
color: #959595;
margin: 0px;
padding: 0px;
background-image: url("/assets/images/asset_call.png");
background-repeat: no-repeat;
padding: 8px;
background-size: 16px;
padding-left: 30px;
background-position: 5px;
}
.view_profile {
border: 1px solid #898989;
color: #898989;
background: transparent;
margin: 5px;
padding-left: 15px;
padding-right: 15px;
border-radius: 20px;
height: 35px;
font-size: 14px;
&:focus {
outline: none;
}
}
.book_now {
float: right;
border: 1px solid #2655bf;
color: #2655bf;
background: transparent;
margin: 5px;
padding-left: 15px;
padding-right: 15px;
border-radius: 20px;
height: 35px;
font-size: 14px;
&:focus {
outline: none;
}
}
.book_now_disabled {
float: right;
border: 1px solid #808080;
color: #808080;
background: transparent;
margin: 5px;
padding-left: 15px;
padding-right: 15px;
border-radius: 20px;
height: 35px;
font-size: 14px;
&:focus {
outline: none;
}
pointer-events: none;
cursor: default;
text-decoration: none;
}
}
}
.offer {
color: #a8a8a8;
text-align: justify;
font-size: 12px;
.panel-heading {
padding: 10px;
margin-bottom: 5px;
padding-left: 15px;
padding-right: 15px;
background-color: #2655bf;
background-image: url("/assets/images/asset_double_right.png");
background-position: right 10px top 8px;
background-repeat: no-repeat;
.panel-title {
padding: 0px;
margin: 0px;
a {
color: #fff;
font-weight: 300;
font-size: 15px;
}
}
}
.panel-collapse {
background-color: #f5f5f5;
.panel-body {
font-size: 15px;
font-weight: 400;
.row {
padding: 10px;
border-bottom: 1px solid #fff;
}
}
}
}
}
.scheduletiming_listing {
width: calc(100% - 80px);
margin: 0 auto;
height: 200px;
position: relative;
left: 5px;
ul {
margin: 0px;
padding: 0px;
width: 50%;
height: 100%;
overflow: scroll;
display: inline-block;
position: relative;
#custom_check_button {
border-radius: 0px !important;
overflow: auto;
position: relative;
outline: none;
color: #908d8d;
-webkit-border-radius: 0px !important;
-moz-border-radius: 0px !important;
-ms-border-radius: 0px !important;
-o-border-radius: 0px !important;
}
#custom_check_button p {
margin: 0px;
position: absolute;
color: #908d8d;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
padding: 5px;
cursor: pointer;
}
#custom_check_button label {
width: 100%;
}
#custom_check_button label span {
text-align: center;
display: block;
}
#custom_check_button label input {
position: absolute;
top: -20px;
}
#custom_check_button input:checked+p {
background-color: #ef5958;
color: #fff;
border-radius: 0px !important;
margin: 0px;
-webkit-border-radius: 0px !important;
-moz-border-radius: 0px !important;
-ms-border-radius: 0px !important;
-o-border-radius: 0px !important;
}
li {
width: 100%;
background: #f5f5f5;
color: #908d8d;
text-align: center;
padding: 7px;
border: 1px solid #fff;
cursor: pointer;
}
}
}
.scheduletiming_btm_btns {
width: calc(100% - 80px);
position: relative;
left: 5px;
margin: 0 auto;
.btm_btns {
width: 50%;
display: inline-block;
height: 40px;
text-align: center;
background-image: url("/assets/images/asset_down_time_arrow.png");
background-color: #f5f5f5;
border: 1px solid #fff;
background-position: center;
background-repeat: no-repeat;
cursor: pointer;
background-size: 25px;
}
}
}
}
}
.service_list {
width: 100%;
padding: 10px;
background: #f9f7f7;
border: 1px solid #e8e8e8;
padding: 10px;
h4 {
margin: 0px;
padding: 0px;
color: #1e1e1e;
padding-bottom: 10px;
font-size: 20px;
font-weight: 600;
}
p {
margin: 0px;
padding: 0px;
color: #4e4e4e;
font-weight: 400;
font-size: 15px;
float: left;
padding-left: 5px;
padding-right: 5px;
} }
} }
.service_map {
width: 100%;
border: 1px solid #e8e8e8;
height: 600px;
margin-top: 10px;
}
} }
}
} agm-map {
.service_list { height: 100%;
width: 100%; }
padding: 10px; \ No newline at end of file
background: #f9f7f7;
border: 1px solid #e8e8e8;
padding: 10px;
h4 {
margin: 0px;
padding: 0px;
color: #1e1e1e;
padding-bottom: 10px;
font-size: 20px;
font-weight: 600;
}
p {
margin: 0px;
padding: 0px;
color: #4e4e4e;
font-weight: 400;
font-size: 15px;
float: left;
padding-left: 5px;
padding-right: 5px;
}
}
.service_map {
width: 100%;
border: 1px solid #e8e8e8;
height: 600px;
margin-top: 10px;
}
}
agm-map {
height: 100%;
}
\ No newline at end of file
src/app/home/index/index.component.html
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<div class="container"> <div class="container">
<h1>Auto service with Warranty<br> & Your interest is Ours.</h1> <h1>Auto service with Warranty<br> & Your interest is Ours.</h1>
<h5>Where is your car?</h5> <h5>Where is your car?</h5>
<div class="search_input_container" [ngClass]="{'input_error': searchLocError}" > <div class="search_input_container" [ngClass]="{'input_error': searchLocError}">
<input #googleLocSearch placeholder="Enter Location" autocorrect="off" autocapitalize="off" spellcheck="off" type="text" (keyup)="searchLocError = false"> <input #googleLocSearch placeholder="Enter Location" autocorrect="off" autocapitalize="off" spellcheck="off" type="text" (keyup)="searchLocError = false">
<button class="get_started_btn" (click)="getVehicleLoc(googleLocSearch.value)">GET STARTED</button> <button class="get_started_btn" (click)="getVehicleLoc(googleLocSearch.value)">GET STARTED</button>
</div> </div>
...@@ -257,24 +257,21 @@ ...@@ -257,24 +257,21 @@
<h3>VEHICLE INFORMATION</h3> <h3>VEHICLE INFORMATION</h3>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<select formControlName="modelYear" <select formControlName="modelYear" [ngClass]="{'input_error': !vehicleDataForm.controls['modelYear'].valid && vehicleDataFormSubmit}">
[ngClass]="{'input_error': !vehicleDataForm.controls['modelYear'].valid && vehicleDataFormSubmit}">
<option value="" class="hide">YEAR</option> <option value="" class="hide">YEAR</option>
<option *ngFor="let date of modelDates">{{date}}</option> <option *ngFor="let date of modelDates">{{date}}</option>
</select> </select>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<select (change)="get_model($event.target.value)" formControlName="maker" <select (change)="get_model($event.target.value)" formControlName="maker" [ngClass]="{'input_error': !vehicleDataForm.controls['maker'].valid && vehicleDataFormSubmit}">
[ngClass]="{'input_error': !vehicleDataForm.controls['maker'].valid && vehicleDataFormSubmit}">
<option value="" class="hide">MAKE</option> <option value="" class="hide">MAKE</option>
<option *ngFor="let car_date of carSearchJsonData; let key = index" value="{{key}}">{{car_date.brand}}</option> <option *ngFor="let car_date of carSearchJsonData; let key = index" value="{{key}}">{{car_date.brand}}</option>
</select> </select>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6" > <div class="col-md-6">
<select formControlName="modelName" <select formControlName="modelName" [ngClass]="{'input_error': !vehicleDataForm.controls['modelName'].valid && vehicleDataFormSubmit}">
[ngClass]="{'input_error': !vehicleDataForm.controls['modelName'].valid && vehicleDataFormSubmit}">
<option value="" class="hide">MODEL</option> <option value="" class="hide">MODEL</option>
<option *ngFor="let car_models of carModel">{{car_models}}</option> <option *ngFor="let car_models of carModel">{{car_models}}</option>
</select> </select>
...@@ -300,7 +297,7 @@ ...@@ -300,7 +297,7 @@
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<button class="log_btn prev_btn floatLeft" type="button" data-dismiss="modal">PREVIOUS</button> <button class="log_btn prev_btn floatLeft" type="button" data-dismiss="modal">PREVIOUS</button>
<button [ngClass]="{'log_btn_diabled':vehicleDataForm.invalid}" type="submit" class="log_btn next_btn floatRight" (click)="jumpToStep1()">NEXT</button> <button [ngClass]="{'log_btn_diabled':vehicleDataForm.invalid}" type="submit" class="log_btn next_btn floatRight" (click)="jumpToStep1()">NEXT</button>
</div> </div>
</div> </div>
</form> </form>
...@@ -348,7 +345,7 @@ ...@@ -348,7 +345,7 @@
</wizard-step> </wizard-step>
<wizard-step stepTitle="Title of step 3"> <wizard-step stepTitle="Title of step 3">
<h3>DESCRIPTION</h3> <h3>DESCRIPTION</h3>
<div class="row"> <div class="row m0">
<div class="col-md-12"> <div class="col-md-12">
<h6 class="pt10 textLeft">Add notes for General Diagnosis (Please provide description in notes section) (optional) *</h6> <h6 class="pt10 textLeft">Add notes for General Diagnosis (Please provide description in notes section) (optional) *</h6>
</div> </div>
...@@ -358,7 +355,7 @@ ...@@ -358,7 +355,7 @@
<textarea class="textarea_input" rows="5" placeholder="Additional Informations you may can gave" [(ngModel)]='optionalDescription'></textarea> <textarea class="textarea_input" rows="5" placeholder="Additional Informations you may can gave" [(ngModel)]='optionalDescription'></textarea>
</div> </div>
</div> </div>
<div class="row"> <div class="row m0">
<h6 class="pt10 textLeft">Add Images (Optional)</h6> <h6 class="pt10 textLeft">Add Images (Optional)</h6>
<!-- Add Images or Videos (Optional) --> <!-- Add Images or Videos (Optional) -->
<hr> <hr>
...@@ -394,7 +391,7 @@ ...@@ -394,7 +391,7 @@
</div> </div>
</div> </div>
</wizard-step> </wizard-step>
<wizard-step stepTitle="Title of step 4"> <wizard-step stepTitle="Title of step 4">
<h3>SUMMARY</h3> <h3>SUMMARY</h3>
<div class="row"> <div class="row">
...@@ -468,7 +465,7 @@ ...@@ -468,7 +465,7 @@
<li>{{ dateSection[0] | date:'MMM dd-MM-yyyy' }}</li> <li>{{ dateSection[0] | date:'MMM dd-MM-yyyy' }}</li>
<li>{{ dateSection[1] | date:'MMM dd-MM-yyyy' }}</li> <li>{{ dateSection[1] | date:'MMM dd-MM-yyyy' }}</li>
</ul> </ul>
</div> </div>
<button [ngClass]="{'invisible': !showRightArrow}" class="quote_arrow right floatRight" (click)="next($event)"></button> <button [ngClass]="{'invisible': !showRightArrow}" class="quote_arrow right floatRight" (click)="next($event)"></button>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
...@@ -497,8 +494,7 @@ ...@@ -497,8 +494,7 @@
<p>{{mechanic.address}}<br>{{mechanic.city+' , '+mechanic.state}}</p> <p>{{mechanic.address}}<br>{{mechanic.city+' , '+mechanic.state}}</p>
<h6>{{mechanic.phone}}</h6> <h6>{{mechanic.phone}}</h6>
</ng-template> </ng-template>
<button (click)="scheduleNow(mechanic.mechanic_id,mechanic.estimate)" <button (click)="scheduleNow(mechanic.mechanic_id,mechanic.estimate)" [ngClass]="{'book_now':scheduleDateInit == true && scheduleMechanic == mechanic.mechanic_id,
[ngClass]="{'book_now':scheduleDateInit == true && scheduleMechanic == mechanic.mechanic_id,
'book_now_disabled':scheduleDateInit == false || (scheduleDateInit == true && scheduleMechanic != mechanic.mechanic_id)}"> 'book_now_disabled':scheduleDateInit == false || (scheduleDateInit == true && scheduleMechanic != mechanic.mechanic_id)}">
{{loginDetails ? 'Book now' : 'Login and Continue' }} {{loginDetails ? 'Book now' : 'Login and Continue' }}
</button> </button>
...@@ -509,11 +505,10 @@ ...@@ -509,11 +505,10 @@
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<h4 class="panel-title"> <h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#estimate_{{mechanic.mechanic_id}}"> <a data-toggle="collapse" data-parent="#accordion" href="#estimate_{{mechanic.mechanic_id}}">
<div class="row"> <div class="row">
<div class="col-md-8">Estimated Price</div> <div class="col-md-7 col-sm-7 col-xs-7">Estimated Price</div>
<div class="col-md-1"></div> <div class="col-md-5 col-sm-5 col-xs-5 textRight"><strong>{{mechanic.estimate}}</strong></div>
<div class="col-md-2 textRight"><strong>{{mechanic.estimate}}</strong></div>
</div> </div>
</a> </a>
</h4> </h4>
...@@ -521,9 +516,9 @@ ...@@ -521,9 +516,9 @@
<div id="estimate_{{mechanic.mechanic_id}}" class="panel-collapse collapse in"> <div id="estimate_{{mechanic.mechanic_id}}" class="panel-collapse collapse in">
<div class="panel-body" *ngFor="let sub_issues of mechanic.sub_issues"> <div class="panel-body" *ngFor="let sub_issues of mechanic.sub_issues">
<div class="row"> <div class="row">
<div class="col-md-8">{{sub_issues.issue_category}}</div> <div class="col-md-7 col-sm-7 col-xs-7">{{sub_issues.issue_category}}</div>
<div class="col-md-1">:</div> <div class="col-md-1 col-sm-1 col-xs-1">:</div>
<div class="col-md-3 textRight"><strong>{{sub_issues.service_fee}}</strong></div> <div class="col-md-4 col-sm-4 col-xs-4 textRight"><strong>{{sub_issues.service_fee}}</strong></div>
</div> </div>
</div> </div>
</div> </div>
...@@ -569,7 +564,7 @@ ...@@ -569,7 +564,7 @@
<h4>Services</h4> <h4>Services</h4>
<div *ngFor="let selIssue of selectedIssues; let key = index"> <div *ngFor="let selIssue of selectedIssues; let key = index">
<p *ngIf="key != 0">|</p> <p *ngIf="key != 0">|</p>
<p>{{selIssue.issue_category}}</p> <p>{{selIssue.issue_category}}</p>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
<p>Estimated Price : <strong>{{estimatedPrice}}</strong></p> <p>Estimated Price : <strong>{{estimatedPrice}}</strong></p>
...@@ -577,11 +572,7 @@ ...@@ -577,11 +572,7 @@
</div> </div>
<div class="service_map"> <div class="service_map">
<agm-map #gm [latitude]="lat" [longitude]="lng"> <agm-map #gm [latitude]="lat" [longitude]="lng">
<agm-marker *ngFor="let mechanicLoc of mechanicData" <agm-marker *ngFor="let mechanicLoc of mechanicData" [latitude]="mechanicLoc.location_lat" [longitude]="mechanicLoc.location_lat" (mouseOver)="onMouseOver(infoWindow,gm)" (mouseOut)="onMouseOut(gm)">
[latitude]="mechanicLoc.location_lat"
[longitude]="mechanicLoc.location_lat"
(mouseOver)="onMouseOver(infoWindow,gm)"
(mouseOut)="onMouseOut(gm)">
<agm-info-window [disableAutoPan]="false" #infoWindow> <agm-info-window [disableAutoPan]="false" #infoWindow>
<div>{{mechanicLoc.display_name}}</div> <div>{{mechanicLoc.display_name}}</div>
</agm-info-window> </agm-info-window>
...@@ -596,4 +587,4 @@ ...@@ -596,4 +587,4 @@
</div> </div>
</div> </div>
<!-- QUOTES-MODAL-ENDS--> <!-- QUOTES-MODAL-ENDS-->
\ No newline at end of file
src/app/home/index/index.component.scss
...@@ -397,6 +397,7 @@ ...@@ -397,6 +397,7 @@
width: 100%; width: 100%;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
padding-bottom: 10px;
} }
.search { .search {
background: url("/assets/images/asset_search.png"); background: url("/assets/images/asset_search.png");
...@@ -474,7 +475,7 @@ ...@@ -474,7 +475,7 @@
outline: none; outline: none;
} }
} }
.log_btn_diabled{ .log_btn_diabled {
cursor: not-allowed; cursor: not-allowed;
background: #929292; background: #929292;
} }
...@@ -490,7 +491,7 @@ ...@@ -490,7 +491,7 @@
font-weight: 500; font-weight: 500;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 20px; background-size: 20px;
margin:3px; margin: 3px;
&:focus { &:focus {
outline: none; outline: none;
} }
...@@ -498,7 +499,7 @@ ...@@ -498,7 +499,7 @@
.wizard_quotes { .wizard_quotes {
height: 40px; height: 40px;
width: 48%; width: 48%;
margin:3px; margin: 3px;
display: inline-block; display: inline-block;
border-radius: 25px; border-radius: 25px;
color: #fff; color: #fff;
...@@ -547,6 +548,7 @@ ...@@ -547,6 +548,7 @@
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
text-align: center; text-align: center;
padding-bottom: 30px;
li { li {
list-style: none; list-style: none;
width: 80px; width: 80px;
...@@ -574,22 +576,23 @@ ...@@ -574,22 +576,23 @@
right: 0px; right: 0px;
bottom: 0px; bottom: 0px;
opacity: 0; opacity: 0;
height: 120px; height: 90px;
padding: 0px;
} }
} }
} }
} }
.service_methods{ .service_methods {
max-height: 200px; max-height: 200px;
overflow: scroll; overflow: scroll;
ul{ ul {
padding:0px; padding: 0px;
margin:0px; margin: 0px;
li{ li {
list-style: none; list-style: none;
width: 100%; width: 100%;
color: #060708; color: #060708;
border:1px dashed #929292; border: 1px dashed #929292;
cursor: pointer; cursor: pointer;
padding: 5px; padding: 5px;
margin-bottom: 10px; margin-bottom: 10px;
...@@ -598,6 +601,7 @@ ...@@ -598,6 +601,7 @@
background-position: right 5px top 2px; background-position: right 5px top 2px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 30px; background-size: 30px;
padding-right: 35px;
} }
.service_list { .service_list {
ul { ul {
...@@ -611,7 +615,7 @@ ...@@ -611,7 +615,7 @@
min-width: 100%; min-width: 100%;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
border:none; border: none;
background-image: none; background-image: none;
margin-bottom: 5px; margin-bottom: 5px;
#custom_check_button { #custom_check_button {
...@@ -655,7 +659,7 @@ ...@@ -655,7 +659,7 @@
#custom_check_button input:checked+p { #custom_check_button input:checked+p {
background-color: #58b19f; background-color: #58b19f;
color: #fff; color: #fff;
border-radius:0px !important; border-radius: 0px !important;
margin: 0px; margin: 0px;
} }
} }
...@@ -663,7 +667,6 @@ ...@@ -663,7 +667,6 @@
} }
} }
} }
.textarea_input { .textarea_input {
width: 100%; width: 100%;
border: 1px solid #1e1e1e; border: 1px solid #1e1e1e;
...@@ -883,7 +886,7 @@ ...@@ -883,7 +886,7 @@
} }
} }
.book_now { .book_now {
float:right; float: right;
border: 1px solid #2655bf; border: 1px solid #2655bf;
color: #2655bf; color: #2655bf;
background: transparent; background: transparent;
...@@ -897,8 +900,8 @@ ...@@ -897,8 +900,8 @@
outline: none; outline: none;
} }
} }
.book_now_disabled{ .book_now_disabled {
float:right; float: right;
border: 1px solid #808080; border: 1px solid #808080;
color: #808080; color: #808080;
background: transparent; background: transparent;
...@@ -917,48 +920,40 @@ ...@@ -917,48 +920,40 @@
} }
} }
} }
.offer{ .offer {
color: #a8a8a8; color: #a8a8a8;
text-align: justify; text-align: justify;
font-size: 12px; font-size: 12px;
.panel-heading{ .panel-heading {
padding: 10px; padding: 10px;
margin-bottom: 5px; margin-bottom: 5px;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
background-color: #2655bf; background-color: #2655bf;
background-image: url("/assets/images/asset_double_right.png");
background-position: right 10px top 8px; background-position: right 10px top 8px;
background-repeat: no-repeat; background-repeat: no-repeat;
.panel-title{ .panel-title {
padding: 0px; padding: 0px;
margin:0px; margin: 0px;
a{ a {
color: #fff; color: #fff;
font-weight: 300; font-weight: 300;
font-size: 15px; font-size: 15px;
} }
} }
} }
.panel-collapse{ .panel-collapse {
background-color: #f5f5f5; background-color: #f5f5f5;
.panel-body {
.panel-body{
font-size: 15px; font-size: 15px;
font-weight: 400; font-weight: 400;
.row{ .row {
padding:10px; padding: 10px;
border-bottom: 1px solid #fff; border-bottom: 1px solid #fff;
} }
} }
} }
}
}
} }
.scheduletiming_listing { .scheduletiming_listing {
width: calc(100% - 80px); width: calc(100% - 80px);
...@@ -975,90 +970,48 @@ ...@@ -975,90 +970,48 @@
display: inline-block; display: inline-block;
position: relative; position: relative;
#custom_check_button { #custom_check_button {
border-radius: 0px !important;
border-radius: 0px !important;
overflow: auto; overflow: auto;
position: relative; position: relative;
outline: none; outline: none;
color: #908d8d; color: #908d8d;
-webkit-border-radius: 0px !important;
-webkit-border-radius: 0px !important; -moz-border-radius: 0px !important;
-ms-border-radius: 0px !important;
-moz-border-radius: 0px !important; -o-border-radius: 0px !important;
}
-ms-border-radius: 0px !important; #custom_check_button p {
-o-border-radius: 0px !important;
}
#custom_check_button p {
margin: 0px; margin: 0px;
position: absolute; position: absolute;
color: #908d8d; color: #908d8d;
left: 0px; left: 0px;
right: 0px; right: 0px;
top: 0px; top: 0px;
bottom: 0px; bottom: 0px;
padding: 5px; padding: 5px;
cursor: pointer; cursor: pointer;
}
} #custom_check_button label {
#custom_check_button label {
width: 100%; width: 100%;
}
} #custom_check_button label span {
#custom_check_button label span {
text-align: center; text-align: center;
display: block; display: block;
}
} #custom_check_button label input {
#custom_check_button label input {
position: absolute; position: absolute;
top: -20px; top: -20px;
}
} #custom_check_button input:checked+p {
#custom_check_button input:checked+p {
background-color: #ef5958; background-color: #ef5958;
color: #fff; color: #fff;
border-radius: 0px !important;
border-radius: 0px !important;
margin: 0px; margin: 0px;
-webkit-border-radius: 0px !important;
-webkit-border-radius: 0px !important; -moz-border-radius: 0px !important;
-ms-border-radius: 0px !important;
-moz-border-radius: 0px !important; -o-border-radius: 0px !important;
}
-ms-border-radius: 0px !important;
-o-border-radius: 0px !important;
}
li { li {
width: 100%; width: 100%;
background: #f5f5f5; background: #f5f5f5;
...@@ -1127,4 +1080,4 @@ ...@@ -1127,4 +1080,4 @@
agm-map { agm-map {
height: 100%; height: 100%;
} }
\ No newline at end of file
src/app/provider/web.service.ts
...@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core'; ...@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http'; import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
import { map, catchError } from 'rxjs/operators'; import { map, catchError } from 'rxjs/operators';
import { apiConfig, serverApiDev } from '../../environments/server.config'; import { apiConfig } from '../../environments/server.config';
const httpOptions = { const httpOptions = {
headers: new HttpHeaders({ headers: new HttpHeaders({
...@@ -51,9 +51,6 @@ export class WebService { ...@@ -51,9 +51,6 @@ export class WebService {
localStorage.removeItem(data); localStorage.removeItem(data);
localStorage.clear(); localStorage.clear();
} }
online_service(url: string ) {
return this.http.post(`${serverApiDev + url}`, null).pipe(map((response: any) => response));
}
get_stored_json(json_file: string) { get_stored_json(json_file: string) {
return this.http.get("assets/json_data/" + json_file); return this.http.get("assets/json_data/" + json_file);
} }
......
src/assets/css/responsive.scss
...@@ -36,6 +36,48 @@ ...@@ -36,6 +36,48 @@
/* 01. Smartphones (portrait and landscape) ----------- */ /* 01. Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { @media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
.navbar {
padding: 20px;
background: #2655bf !important;
.container-fluid {
max-width: 100% !important;
.navbar-nav {
li {
a {
padding: 15px !important;
}
}
}
}
}
.leftRs {
display: none !important;
}
.rightRs {
display: none !important;
}
.service_map {
display: none;
}
.login_modal_wrapper {
.modal_close {
// display: none !important;
color:#333 !important;
}
}
.main_wrapper {
.title_banner_overlay {
// padding-top: 120px;
// padding-bottom: 30px;
.title_banner {
h1 {
font-size: 24px;
line-height: 35px;
font-weight: 400 !important;
}
}
}
}
.search_input_container { .search_input_container {
width: 100% !important; width: 100% !important;
} }
...@@ -52,9 +94,13 @@ ...@@ -52,9 +94,13 @@
} }
.modal-body{ .modal-body{
padding:0px !important; padding:5px !important;
.vehicle_input_select{
margin-bottom: 10px;
}
} }
.wizard_quotes{ .wizard_quotes{
width:100% !important; width:100% !important;
} }
...@@ -93,6 +139,51 @@ ...@@ -93,6 +139,51 @@
} }
} }
} }
.testimonial_div {
padding: 0px !important;
.container-fluid {
max-width: 100% !important;
}
}
.login_modal_content {
padding: 15px !important;
padding-top: 40px !important;
top: 0px !important;
h3 {
padding-bottom: 25px !important;
}
.login_modal_inner {
select {
margin-bottom: 15px;
}
input {
margin-bottom: 15px;
}
}
}
.log_btn {
width: 135px !important;
}
.wizard_quotes {
width: 80% !important;
}
.quote_service_wrapper {
width: 100% !important;
.mechanic_detail {
.book_now {
width: 100% !important;
}
.book_now_disabled {
width: 100% !important;
}
}
}
.login_modal_inner {
width: 100% !important;
}
.scheduletiming_listing {
width: 100% !important;
}
} }
......
src/environments/server.config.ts
export const apiConfig = 'http://localhost/dcarfixers/Webservices/'; let apiConfigUrl,imageStorageUrl;
export const ImageStorage = 'http://localhost/dcarfixers/';
export const serverApiDev = 'http://devapp.ticketgoose.com/bookbustickets/rest/json/2.0/'; // // Localhost
// apiConfigUrl = 'http://localhost/dcarfixers/Webservices/';
// imageStorageUrl = 'http://localhost/dcarfixers/';
// // Techlabz
// apiConfigUrl = 'http://techlabz.in/dcarfixers/Webservices/';
// imageStorageUrl = 'http://techlabz.in/dcarfixers/';
// carfixxers.com
apiConfigUrl = 'https://carfixxers.com/admin/Webservices/';
imageStorageUrl = 'https://carfixxers.com/admin/';
export const apiConfig = apiConfigUrl;
export const ImageStorage = imageStorageUrl;
\ No newline at end of file
src/styles.scss
...@@ -531,4 +531,4 @@ section.module.parallax { ...@@ -531,4 +531,4 @@ section.module.parallax {
padding-bottom: 30px !important; padding-bottom: 30px !important;
font-weight: 400 !important; font-weight: 400 !important;
} }
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment