Skip to content

C
Codeinfotech
Commit 7bc8d8ff by abraham
Options

12-07-2019

parent e9591824
Showing with 112 additions and 31 deletions
angular.json
......@@ -30,12 +30,15 @@
"src/styles.scss",
"src/assets/responsive.scss",
"node_modules/bootstrap/dist/css/bootstrap.css",
"node_modules/slick-carousel/slick/slick.scss",
"node_modules/slick-carousel/slick/slick-theme.scss",
"node_modules/font-awesome/css/font-awesome.css"
],
"scripts": [
"node_modules/jquery/dist/jquery.js",
"node_modules/jquery/dist/jquery.min.js",
"node_modules/bootstrap/dist/js/bootstrap.js"
"node_modules/bootstrap/dist/js/bootstrap.js",
"node_modules/slick-carousel/slick/slick.min.js"
],
"es5BrowserSupport": true
},
......
package-lock.json
......@@ -121,14 +121,6 @@
"rxjs": "6.3.3"
}
},
"@angular/animations": {
"version": "7.2.15",
"resolved": "https://registry.npmjs.org/@angular/animations/-/animations-7.2.15.tgz",
"integrity": "sha512-8oBt3HLgd2+kyJHUgsd7OzKCCss67t2sch15XNoIWlOLfxclqU+EfFE6t/vCzpT8/+lpZS6LU9ZrTnb+UBj5jg==",
"requires": {
"tslib": "^1.9.0"
}
},
"@angular/cli": {
"version": "7.3.9",
"resolved": "https://registry.npmjs.org/@angular/cli/-/cli-7.3.9.tgz",
......@@ -6393,6 +6385,14 @@
"integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==",
"dev": true
},
"ngx-slick-carousel": {
"version": "0.4.4",
"resolved": "https://registry.npmjs.org/ngx-slick-carousel/-/ngx-slick-carousel-0.4.4.tgz",
"integrity": "sha512-z/cu8CL7LlUaqtImxC595V644efgjHTdQ9+u3AqL/igQYSELRryENGVH0jyPZuJSpSNvi52I2HGeifPsEd7bkg==",
"requires": {
"tslib": "^1.9.0"
}
},
"nice-try": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
......@@ -8407,6 +8407,11 @@
"integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=",
"dev": true
},
"slick-carousel": {
"version": "1.8.1",
"resolved": "https://registry.npmjs.org/slick-carousel/-/slick-carousel-1.8.1.tgz",
"integrity": "sha512-XB9Ftrf2EEKfzoQXt3Nitrt/IPbT+f1fgqBdoxO3W/+JYvtEOW6EgxnWfr9GH6nmULv7Y2tPmEX3koxThVmebA=="
},
"smart-buffer": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/smart-buffer/-/smart-buffer-4.0.2.tgz",
......
package.json
......@@ -11,7 +11,6 @@
},
"private": true,
"dependencies": {
"@angular/animations": "~7.2.0",
"@angular/common": "~7.2.0",
"@angular/compiler": "~7.2.0",
"@angular/core": "~7.2.0",
......@@ -24,7 +23,9 @@
"core-js": "^2.5.4",
"font-awesome": "^4.7.0",
"jquery": "^3.4.1",
"ngx-slick-carousel": "^0.4.4",
"rxjs": "~6.3.3",
"slick-carousel": "^1.8.1",
"tslib": "^1.9.0",
"zone.js": "~0.8.26"
},
......
src/app/body/body.module.ts
......@@ -4,12 +4,14 @@ import { LandingpageComponent } from './landingpage/landingpage.component';
import{ moduleRouting } from './body-routing.module';
import { from } from 'rxjs';
import { AboutusComponent } from './aboutus/aboutus.component';
import { SlickCarouselModule } from 'ngx-slick-carousel';
@NgModule({
declarations: [LandingpageComponent, AboutusComponent],
imports: [
CommonModule,
moduleRouting
moduleRouting,
SlickCarouselModule
]
})
export class BodyModule { }
src/app/body/landingpage/landingpage.component.html
<div class="backgnd_grey">
<div class="map_overlay">
<div class="container map_contents">
<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>
<ngx-slick-carousel class="carousel"
#slickModal="slick-carousel"
[config]="firstConfig">
<div ngxSlickItem 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 class="col-md-7">
<div class="right_side">
<img src="../../../assets/img/asset_banner_img.png">
</div>
</div>
<div class="col-md-7">
<div class="right_side">
<img src="../../../assets/img/asset_banner_img.png">
</div>
</div>
</div>
<div ngxSlickItem 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 ngxSlickItem 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>
</ngx-slick-carousel>
</div>
</div>
</div>
......
src/app/body/landingpage/landingpage.component.ts
......@@ -11,5 +11,5 @@ export class LandingpageComponent implements OnInit {
ngOnInit() {
}
slideConfig = {"slidesToShow": 1, "slidesToScroll": 1,"dots":true,"arrow":false, responsive:[{breakpoint:480,settings:{slidesToShow:1}}]};
}
src/app/header/header.component.scss
.nav_color{
background-color: red;
}
nav{
position: fixed;
width: 100%;
......
src/app/header/header.component.ts
import { Component, OnInit } from '@angular/core';
import * as $ from 'jquery';
declare const window: any;
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.scss']
})
export class HeaderComponent implements OnInit {
constructor() {
constructor() { }
$(window).scroll(function(){
var custom = $('.navbar'),
scroll = $(window).scrollTop();
console.log(scroll);
if(scroll > 1) custom.addClass("nav_color");
else custom.removeClass("nav_color");
});
}
ngOnInit() {
}
......
src/assets/responsive.scss
......@@ -154,16 +154,27 @@ h2{
.row{
.rating_head{
.rating_star{
margin: 0px 10px 0px 10px !important;
margin: 0px 0px 0px 4px !important;
line-height: 1.5 !important;
}
.for-design-quality{
padding: 5px 16px 0px 0px !important;
float: right !important;
font-size: 19px !important;
line-height: 1.5 !important;
}
.kochi_taxi{
padding: 0px 10px 0px 0px !important;
padding: 0px 0px 0px 0px !important;
font-size: 19px !important;
text-align: center !important;
float: none !important;
}
}
}
.rating_body{
.rating_content{
margin: 35px 15px 35px 15px !important;
font-size: 18px !important;
margin: 25px 15px 25px 15px !important;
}
}
}
......
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