Skip to content

C
Codeinfotech
Commit d4f85cfb by abraham
Options

Merge branch 'abraham' into 'master'

Abraham See merge request !3
parents 1deec49d 30f6352e
Showing with 470 additions and 253 deletions
src/app/body/aboutus/aboutus.component.html
...@@ -67,19 +67,19 @@ ...@@ -67,19 +67,19 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-md-3"> <div class="col-md-3">
<h3>300+</h3> <h3><span class="count">300</span>+</h3>
<h5>Active Clients</h5> <h5>Active Clients</h5>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<h3>5000+</h3> <h3><span class="count">5000</span>+</h3>
<h5>Sales</h5> <h5>Sales</h5>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<h3>35+</h3> <h3><span class="count">35</span>+</h3>
<h5>Products</h5> <h5>Products</h5>
</div> </div>
<div class="col-md-3"> <div class="col-md-3">
<h3>80%+</h3> <h3><span class="count">80</span>%</h3>
<h5>Satisfied Clients</h5> <h5>Satisfied Clients</h5>
</div> </div>
</div> </div>
......
src/app/body/aboutus/aboutus.component.scss
...@@ -186,7 +186,7 @@ ...@@ -186,7 +186,7 @@
h5{ h5{
text-align: center !important; text-align: center !important;
object-fit: contain; object-fit: contain;
font-family: Myriad Pro; font-family: Roboto;
font-size: 27.5px; font-size: 27.5px;
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
......
src/app/body/aboutus/aboutus.component.ts
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import * as $ from 'jquery';
@Component({ @Component({
selector: 'app-aboutus', selector: 'app-aboutus',
templateUrl: './aboutus.component.html', templateUrl: './aboutus.component.html',
...@@ -7,9 +7,22 @@ import { Component, OnInit } from '@angular/core'; ...@@ -7,9 +7,22 @@ import { Component, OnInit } from '@angular/core';
}) })
export class AboutusComponent implements OnInit { export class AboutusComponent implements OnInit {
constructor() { } constructor() {
}
ngOnInit() { ngOnInit() {
$('.count').each(function () {
$(this).prop('Counter',0).animate({
Counter: $(this).text()
}, {
duration: 12000,
easing: 'swing',
step: function (now) {
$(this).text(Math.ceil(now));
}
});
});
} }
} }
src/app/body/landingpage/landingpage.component.html
...@@ -4,59 +4,85 @@ ...@@ -4,59 +4,85 @@
<ngx-slick-carousel class="carousel" <ngx-slick-carousel class="carousel"
#slickModal="slick-carousel" #slickModal="slick-carousel"
[config]="firstConfig"> [config]="firstConfig">
<div ngxSlickItem class="row"> <div ngxSlickItem class="slick_main">
<div class="col-md-5"> <div class="row">
<div class="left_side"> <div class="col-md-5">
<span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span> <div class="left_side">
is simply dummy text <span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p> is simply dummy text
<div class="get_info" href="#"> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p>
Get info <div class="get_info" href="#">
<img src="../../../assets/img/asset_white_arrow.png" alt="arrow"> Get info
</div> <img src="../../../assets/img/asset_white_arrow.png" alt="arrow">
</div>
</div>
</div> </div>
</div> <div class="col-md-7">
<div class="col-md-7"> <div class="right_side">
<div class="right_side"> <img src="../../../assets/img/asset_banner_img.png">
<img src="../../../assets/img/asset_banner_img.png"> </div>
</div> </div>
</div> </div>
</div> </div>
<div ngxSlickItem class="row"> <div ngxSlickItem class="slick_main">
<div class="col-md-5"> <div class="row">
<div class="left_side"> <div class="col-md-5">
<span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span> <div class="left_side">
is simply dummy text <span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p> is simply dummy text
<div class="get_info" href="#"> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p>
Get info <div class="get_info" href="#">
<img src="../../../assets/img/asset_white_arrow.png" alt="arrow"> Get info
</div> <img src="../../../assets/img/asset_white_arrow.png" alt="arrow">
</div> </div>
</div> </div>
<div class="col-md-7"> </div>
<div class="right_side"> <div class="col-md-7">
<img src="../../../assets/img/asset_banner_img.png"> <div class="right_side">
</div> <img src="../../../assets/img/asset_banner_img.png">
</div> </div>
</div>
</div>
</div> </div>
<div ngxSlickItem class="row"> <div ngxSlickItem class="slick_main">
<div class="col-md-5"> <div class="row">
<div class="left_side"> <div class="col-md-5">
<span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span> <div class="left_side">
is simply dummy text <span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p> is simply dummy text
<div class="get_info" href="#"> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p>
Get info <div class="get_info" href="#">
<img src="../../../assets/img/asset_white_arrow.png" alt="arrow"> Get info
</div> <img src="../../../assets/img/asset_white_arrow.png" alt="arrow">
</div> </div>
</div> </div>
<div class="col-md-7"> </div>
<div class="right_side"> <div class="col-md-7">
<img src="../../../assets/img/asset_banner_img.png"> <div class="right_side">
</div> <img src="../../../assets/img/asset_banner_img.png">
</div> </div>
</div>
</div>
</div>
<div ngxSlickItem class="slick_main">
<div class="row">
<div class="col-md-5">
<div class="left_side">
<span class="lorem">Lorem</span><span class="ipsum"> Ipsum </span>
is simply dummy text
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the</p>
<div class="get_info" href="#">
Get info
<img src="../../../assets/img/asset_white_arrow.png" alt="arrow">
</div>
</div>
</div>
<div class="col-md-7">
<div class="right_side">
<img src="../../../assets/img/asset_banner_img.png">
</div>
</div>
</div>
</div> </div>
</ngx-slick-carousel> </ngx-slick-carousel>
</div> </div>
...@@ -205,65 +231,195 @@ ...@@ -205,65 +231,195 @@
<hr> <hr>
</div> </div>
<div class="rating_review_box"> <div class="rating_review_box">
<div class="rating_review_box_one"> <ngx-slick-carousel class="carousel"
<div class="row"> #slickModal="slick-carousel"
<div class="rating_head"> [config]="ratingConfig">
<div class="rating_star"> <div ngxSlickItem class="rating_slide">
<fieldset class="rating"> <div class="rating_review_box_one">
<input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label> <div class="row">
<input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label> <div class="rating_head">
<input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label> <div class="rating_star">
<input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label> <fieldset class="rating">
<input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label> <input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label>
<input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label> <input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
<input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label> <input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label>
<input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label> <input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label>
<input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label> <input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label>
<input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label> <input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
</fieldset> <input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label>
<input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label>
<input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label>
<input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
</fieldset>
</div>
<div class="for-design-quality">
<div class="for_textstyle">for</div> Design Quality
</div>
<div class="kochi_taxi">by kochitaxi</div>
</div>
</div>
<div class="clear"></div>
<div class="row rating_body">
<div class="rating_content">
I love this application.its very easy to manage.
</div>
</div>
</div>
<div class="rating_review_box_one">
<div class="row">
<div class="rating_head">
<div class="rating_star">
<fieldset class="rating">
<input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label>
<input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
<input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label>
<input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label>
<input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label>
<input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
<input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label>
<input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label>
<input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label>
<input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
</fieldset>
</div>
<div class="for-design-quality">
<div class="for_textstyle">for</div> Design Quality
</div>
<div class="kochi_taxi">by kochitaxi</div>
</div>
</div> </div>
<div class="for-design-quality"> <div class="clear"></div>
<div class="for_textstyle">for</div> Design Quality <div class="row rating_body">
<div class="rating_content">
I love this application.its very easy to manage.
</div> </div>
<div class="kochi_taxi">by kochitaxi</div>
</div> </div>
</div> </div>
<div class="clear"></div>
<div class="row rating_body">
<div class="rating_content">
I love this application.its very easy to manage.
</div> </div>
</div> <div ngxSlickItem class="rating_slide">
</div> <div class="rating_review_box_one">
<div class="rating_review_box_one"> <div class="row">
<div class="row"> <div class="rating_head">
<div class="rating_head"> <div class="rating_star">
<div class="rating_star"> <fieldset class="rating">
<fieldset class="rating"> <input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label>
<input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label> <input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
<input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label> <input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label>
<input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label> <input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label>
<input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label> <input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label>
<input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label> <input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
<input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label> <input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label>
<input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label> <input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label>
<input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label> <input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label>
<input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label> <input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
<input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label> </fieldset>
</fieldset> </div>
<div class="for-design-quality">
<div class="for_textstyle">for</div> Design Quality
</div>
<div class="kochi_taxi">by kochitaxi</div>
</div>
</div>
<div class="clear"></div>
<div class="row rating_body">
<div class="rating_content">
I love this application.its very easy to manage.
</div> </div>
<div class="for-design-quality"> </div>
<div class="for_textstyle">for</div> Design Quality </div>
<div class="rating_review_box_one">
<div class="row">
<div class="rating_head">
<div class="rating_star">
<fieldset class="rating">
<input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label>
<input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
<input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label>
<input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label>
<input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label>
<input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
<input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label>
<input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label>
<input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label>
<input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
</fieldset>
</div>
<div class="for-design-quality">
<div class="for_textstyle">for</div> Design Quality
</div>
<div class="kochi_taxi">by kochitaxi</div>
</div>
</div>
<div class="clear"></div>
<div class="row rating_body">
<div class="rating_content">
I love this application.its very easy to manage.
</div> </div>
<div class="kochi_taxi">by kochitaxi</div>
</div> </div>
</div>
</div> </div>
<div class="clear"></div> <div ngxSlickItem class="rating_slide">
<div class="row rating_body"> <div class="rating_review_box_one">
<div class="rating_content"> <div class="row">
I love this application.its very easy to manage. <div class="rating_head">
<div class="rating_star">
<fieldset class="rating">
<input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label>
<input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
<input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label>
<input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label>
<input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label>
<input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
<input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label>
<input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label>
<input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label>
<input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
</fieldset>
</div>
<div class="for-design-quality">
<div class="for_textstyle">for</div> Design Quality
</div>
<div class="kochi_taxi">by kochitaxi</div>
</div>
</div>
<div class="clear"></div>
<div class="row rating_body">
<div class="rating_content">
I love this application.its very easy to manage.
</div>
</div>
</div>
<div class="rating_review_box_one">
<div class="row">
<div class="rating_head">
<div class="rating_star">
<fieldset class="rating">
<input type="radio" id="star5" name="rating" value="5" /><label class = "full" for="star5" title="Awesome - 5 stars"></label>
<input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
<input type="radio" id="star4" name="rating" value="4" /><label class = "full" for="star4" title="Pretty good - 4 stars"></label>
<input type="radio" id="star3half" name="rating" value="3 and a half" /><label class="half" for="star3half" title="Meh - 3.5 stars"></label>
<input type="radio" id="star3" name="rating" value="3" /><label class = "full" for="star3" title="Meh - 3 stars"></label>
<input type="radio" id="star2half" name="rating" value="2 and a half" /><label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
<input type="radio" id="star2" name="rating" value="2" /><label class = "full" for="star2" title="Kinda bad - 2 stars"></label>
<input type="radio" id="star1half" name="rating" value="1 and a half" /><label class="half" for="star1half" title="Meh - 1.5 stars"></label>
<input type="radio" id="star1" name="rating" value="1" /><label class = "full" for="star1" title="Sucks big time - 1 star"></label>
<input type="radio" id="starhalf" name="rating" value="half" /><label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
</fieldset>
</div>
<div class="for-design-quality">
<div class="for_textstyle">for</div> Design Quality
</div>
<div class="kochi_taxi">by kochitaxi</div>
</div>
</div>
<div class="clear"></div>
<div class="row rating_body">
<div class="rating_content">
I love this application.its very easy to manage.
</div>
</div>
</div>
</div> </div>
</div> </ngx-slick-carousel>
</div>
</div> </div>
</div> </div>
\ No newline at end of file
src/app/body/landingpage/landingpage.component.scss
...@@ -48,73 +48,76 @@ ...@@ -48,73 +48,76 @@
.map_contents{ .map_contents{
padding-top: 300px; padding-top: 300px;
padding-bottom: 250px; padding-bottom: 250px;
.row{ .slick_main{
.col-md-5{ .row{
display: flex; .col-md-5{
justify-content: space-evenly; display: flex;
flex-direction:column; justify-content: space-evenly;
.left_side{ flex-direction:column;
object-fit: contain; .left_side{
font-family: Roboto;
font-size: 44.5px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.16;
letter-spacing: normal;
text-align: left;
color: #404041;
.lorem{
font-size: 67.5px;
font-weight: 900;
color: #8cc342;
}
.ipsum{
font-size: 67.5px;
font-weight: 900;
}
p{
margin-top: 20px;
object-fit: contain; object-fit: contain;
font-family: Roboto; font-family: Roboto;
font-size: 16px; font-size: 44.5px;
font-weight: 300; font-weight: normal;
font-style: normal; font-style: normal;
font-stretch: normal; font-stretch: normal;
line-height: 1.81; line-height: 1.16;
letter-spacing: normal; letter-spacing: normal;
text-align: left; text-align: left;
color: #404041; color: #404041;
} .lorem{
.get_info{ font-size: 67.5px;
width: fit-content; font-weight: 900;
background-color: rgb(92,141,24); color: #8cc342;
padding: 11px 14px 12px 18px; }
object-fit: contain; .ipsum{
font-family: Roboto; font-size: 67.5px;
font-size: 24px; font-weight: 900;
font-weight: 900; }
font-style: normal; p{
font-stretch: normal; margin-top: 20px;
line-height: 0.77; object-fit: contain;
letter-spacing: normal; font-family: Roboto;
text-align: left; font-size: 16px;
color: #ffffff; font-weight: 300;
img{ font-style: normal;
padding-left: 3px; font-stretch: normal;
line-height: 1.81;
letter-spacing: normal;
text-align: left;
color: #404041;
}
.get_info{
width: fit-content;
background-color: rgb(92,141,24);
padding: 11px 14px 12px 18px;
object-fit: contain;
font-family: Roboto;
font-size: 24px;
font-weight: 900;
font-style: normal;
font-stretch: normal;
line-height: 0.77;
letter-spacing: normal;
text-align: left;
color: #ffffff;
img{
padding-left: 3px;
display: inline;
}
} }
} }
} }
} .col-md-7{
.col-md-7{ .right_side{
.right_side{ max-width: 600px;
max-width: 600px; img{
img{ height: 100%;
height: 100%; width: 100%;
width: 100%; }
} }
} }
} }
} }
} }
...@@ -326,74 +329,78 @@ hr{ ...@@ -326,74 +329,78 @@ hr{
margin: 0 auto; margin: 0 auto;
margin-bottom: 75px; margin-bottom: 75px;
padding-top: 36px; padding-top: 36px;
.rating_review_box_one{ ngx-slick-carousel{
margin: 23px 16px 24px 16px; .rating_slide{
.row{ .rating_review_box_one{
width: 100%; margin: 23px 16px 24px 16px;
margin-left: 0px; .row{
margin-right: 0px; width: 100%;
.rating_head{ margin-left: 0px;
background-color: rgb(225, 225, 225); margin-right: 0px;
width: 100%; .rating_head{
text-align: left; background-color: rgb(225, 225, 225);
.rating_star{
margin: 0px 23px 0px 20px;
display: inline-block;
label{
margin-bottom: 0px;
}
img{
width: 100%; width: 100%;
text-align: left;
.rating_star{
margin: 0px 23px 0px 20px;
display: inline-block;
label{
margin-bottom: 0px;
}
img{
width: 100%;
}
}
.for-design-quality{
display: inline-block;
padding: 5px 0px 0px 0px;
vertical-align: top;
object-fit: contain;
font-family: Roboto;
font-size: 21px;
font-weight: bold;
font-style: normal;
font-stretch: normal;
letter-spacing: normal;
text-align: left;
color: #696969;
.for_textstyle{
font-weight: normal;
display: inline;
}
}
.kochi_taxi{
padding: 5px 33px 0px 0px;
vertical-align: top;
float: right;
object-fit: contain;
font-family: Roboto;
font-size: 21px;
font-weight: 500;
font-style: normal;
font-stretch: normal;
letter-spacing: normal;
text-align: left;
color: #656565;
}
} }
} }
.for-design-quality{ .rating_body{
display: inline-block; border: 2px solid rgb(225, 225, 225);
padding: 5px 0px 0px 0px; .rating_content{
vertical-align: top; object-fit: contain;
object-fit: contain; font-family: Roboto;
font-family: Roboto; font-size: 21px;
font-size: 21px;
font-weight: bold;
font-style: normal;
font-stretch: normal;
letter-spacing: normal;
text-align: left;
color: #696969;
.for_textstyle{
font-weight: normal; font-weight: normal;
display: inline; font-style: normal;
font-stretch: normal;
line-height: 0.83;
letter-spacing: normal;
text-align: left;
color: #656565;
margin: 48px 0px 40px 30px;
} }
} }
.kochi_taxi{
padding: 5px 33px 0px 0px;
vertical-align: top;
float: right;
object-fit: contain;
font-family: Roboto;
font-size: 21px;
font-weight: 500;
font-style: normal;
font-stretch: normal;
letter-spacing: normal;
text-align: left;
color: #656565;
}
}
}
.rating_body{
border: 2px solid rgb(225, 225, 225);
.rating_content{
object-fit: contain;
font-family: Roboto;
font-size: 21px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 0.83;
letter-spacing: normal;
text-align: left;
color: #656565;
margin: 48px 0px 40px 30px;
} }
} }
} }
......
src/app/body/landingpage/landingpage.component.ts
...@@ -11,5 +11,6 @@ export class LandingpageComponent implements OnInit { ...@@ -11,5 +11,6 @@ export class LandingpageComponent implements OnInit {
ngOnInit() { ngOnInit() {
} }
slideConfig = {"slidesToShow": 1, "slidesToScroll": 1,"dots":true,"arrow":false, responsive:[{breakpoint:480,settings:{slidesToShow:1}}]}; firstConfig = {"slidesToShow": 1, "slidesToScroll": 1,"arrows": false,"dots":true,"autoplay":true,"autoplaySpeed":2000};
ratingConfig = {"slidesToShow": 1, "slidesToScroll": 1,"arrows": true,"autoplay":true,"autoplaySpeed":2000,responsive:[{breakpoint:480,settings:{arrows:false}}]};
} }
src/app/header/header.component.scss
.nav_color{ .nav_color{
background-color: red; background-color: #ffff;
} }
nav{ nav{
position: fixed; position: fixed;
width: 100%; width: 100%;
z-index: 10; z-index: 10;
.logo{ .logo{
max-width: 380px;
max-height: 78px;
img{ img{
width: 100%; width: 80%;
height: 100%; height: 100%;
} }
} }
......
src/assets/responsive.scss
...@@ -40,16 +40,22 @@ ...@@ -40,16 +40,22 @@
nav{ nav{
.logo{ .logo{
max-width: 250px !important; max-width: 250px !important;
img{
width: 100% !important;
}
} }
.navbar-collapse{ .navbar-collapse{
margin-left: 0px !important;
ul{ ul{
flex-direction: row !important;
li{ li{
width: 75px !important;
a{ a{
text-align: left !important; text-align: center !important;
} }
} }
.icon_box{ .icon_box{
margin-bottom: 10px !important; display: none !important;
} }
} }
} }
...@@ -140,6 +146,9 @@ h2{ ...@@ -140,6 +146,9 @@ h2{
width: 110px !important; width: 110px !important;
height: 100px !important; height: 100px !important;
} }
h4{
font-size: 18px !important;
}
} }
} }
} }
...@@ -150,33 +159,38 @@ h2{ ...@@ -150,33 +159,38 @@ h2{
} }
.rating_review_box{ .rating_review_box{
padding-top: 20px !important; padding-top: 20px !important;
.rating_review_box_one{ ngx-slick-carousel{
.row{ .rating_slide{
.rating_head{ .rating_review_box_one{
.rating_star{ .row{
margin: 0px 0px 0px 4px !important; .rating_head{
line-height: 1.5 !important; .rating_star{
} margin: 0px 0px 0px 4px !important;
.for-design-quality{ line-height: 1.5 !important;
padding: 5px 16px 0px 0px !important; }
float: right !important; .for-design-quality{
font-size: 19px !important; padding: 5px 16px 0px 0px !important;
line-height: 1.5 !important; float: right !important;
font-size: 19px !important;
line-height: 1.5 !important;
}
.kochi_taxi{
padding: 0px 0px 0px 0px !important;
font-size: 19px !important;
text-align: center !important;
float: none !important;
}
}
} }
.kochi_taxi{ .rating_body{
padding: 0px 0px 0px 0px !important; .rating_content{
font-size: 19px !important; font-size: 18px !important;
text-align: center !important; margin: 25px 15px 25px 15px !important;
float: none !important; line-height: 1.5 !important;
}
} }
} }
} }
.rating_body{
.rating_content{
font-size: 18px !important;
margin: 25px 15px 25px 15px !important;
}
}
} }
} }
} }
......
src/styles.scss
...@@ -3,4 +3,30 @@ ...@@ -3,4 +3,30 @@
@import url("http://allfont.net/allfont.css?fonts=franklin-gothic-demi-cond"); @import url("http://allfont.net/allfont.css?fonts=franklin-gothic-demi-cond");
.clear{ .clear{
clear: both; clear: both;
}
.rating_review_box{
ngx-slick-carousel{
.slick-prev{
left: -40px;
height: auto;
width: auto;
&:before{
background-color: #000;
border: 1px solid #000;
border-radius: 50%;
font-size: 30px;
}
}
.slick-next{
right: -40px;
height: auto;
width: auto;
&:before{
background-color: #000;
border: 1px solid #000;
border-radius: 50%;
font-size: 30px;
}
}
}
} }
\ 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