Skip to content

C
Codeinfotech
Commit 30f6352e by abraham
Options

Merge branch 'master' into abraham

:w Lines starting with '#' will be ignored, and an empty message aborts
parents 6dd62f73 1deec49d
Showing with 894 additions and 24 deletions
src/app/app.component.html
<app-header></app-header>
<router-outlet></router-outlet>
<app-footer></app-footer>
src/app/app.module.ts
......@@ -5,12 +5,14 @@ import { AngularFontAwesomeModule } from 'angular-font-awesome';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HeaderComponent } from './header/header.component';
import {FooterComponent} from './footer/footer.component';
import { from } from 'rxjs';
@NgModule({
declarations: [
AppComponent,
HeaderComponent
HeaderComponent,
FooterComponent
],
imports: [
BrowserModule,
......
src/app/body/body-routing.module.ts
......@@ -2,6 +2,9 @@ import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LandingpageComponent } from './landingpage/landingpage.component';
import { AboutusComponent } from './aboutus/aboutus.component';
import {ContactComponent} from './contact/contact.component';
import {ProductsComponent} from './products/products.component';
import { from } from 'rxjs';
const ModuleRoutes: Routes = [
{
path:'landing',component: LandingpageComponent
......@@ -9,6 +12,12 @@ const ModuleRoutes: Routes = [
},
{
path:'about',component: AboutusComponent
},
{
path:'products',component:ProductsComponent
},
{
path:'contact',component:ContactComponent
}
];
export const moduleRouting: ModuleWithProviders = RouterModule.forChild(ModuleRoutes)
\ No newline at end of file
src/app/body/body.module.ts
......@@ -4,10 +4,15 @@ import { LandingpageComponent } from './landingpage/landingpage.component';
import{ moduleRouting } from './body-routing.module';
import { from } from 'rxjs';
import { AboutusComponent } from './aboutus/aboutus.component';
import { ContactComponent} from './contact/contact.component';
import {ProductsComponent} from './products/products.component';
import { SlickCarouselModule } from 'ngx-slick-carousel';
@NgModule({
declarations: [LandingpageComponent, AboutusComponent],
declarations: [LandingpageComponent, AboutusComponent,ProductsComponent,ContactComponent],
imports: [
CommonModule,
moduleRouting,
......
src/app/body/contact/contact.component.html 0 → 100644
<div class="cnt">
<div class="container">
<div class="head-cnt">
<h3>CONTACT<b> US</b></h3>
<hr>
<p> Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<div class="cnt-det">
<input type="text" class="txt-left" placeholder=" First Name">
<input type="text" class="txt-right" placeholder=" Second Name"><br>
<input type="email" class="txt-left" placeholder=" Email ID">
<input type="text" class="txt-right" placeholder=" Phone Number">
<select class="form-control" id="sel1">
<option >I am interested</option>
<option></option>
<option></option>
<option></option>
</select>
<textarea class="mess-txt" placeholder=" Type Your Message"></textarea>
</div>
<div class="btn"><button class="send-mail">SEND</button></div>
</div>
</div>
src/app/body/contact/contact.component.scss 0 → 100644
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap');
*{
font-family: 'Roboto', sans-serif;
}
.cnt{
text-align: center;
height: auto;
width:auto;
margin-bottom: 50px;
padding-top: 100px;
.head-cnt h3{
color: #171717;
font-size: 48px;
font-weight: 800;
text-align: center;
}
.head-cnt b{
color: #67af05;
font-weight: 800;
}
.head-cnt p{
font-size: 20px;
color:#464646;
text-align: center;
font-weight: 500;
}
.head-cnt hr{
width: 56px;
// height: 15px;
border-top: 9px solid rgb(140,195,60);
}
.cnt-det {
text-align: center;
outline: none;
input{
width:300px;
height: 45px;
line-break: 1;
text-align: left;
margin-bottom: 15px;
font-size: 18px;
background: rgb(238, 238, 238);
border: 1px solid rgb(238, 238, 238);
color: #3d3e3d;
outline:none;
padding-left: 15px;
}
input::placeholder{
color: rgba(61, 62, 61, 0.28);
}
.txt-left{
margin-right: 10px;
}
.txt-right{
margin-left: 10px;
}
select{
outline: none;
option{
color: rgba(61, 62, 61, 0.28);
}
}
.form-control{
width: 621px;
background: rgb(238, 238, 238);
border: 1px solid rgb(238, 238, 238);
color: #757575;
margin: 0 auto;
text-align: left;
font-size: 18px;
height: 45px;
margin-bottom: 15px;
outline:none;
padding-left: 15px;
}
textarea::placeholder{
color: rgba(61, 62, 61, 0.28);
}
textarea{
width:621px;
height: 150px;
color:#3d3e3d;
font-size: 18px;
background: rgb(238, 238, 238);
border: 1px solid rgb(238, 238, 238);
text-align: left;
outline:none;
resize: none;
padding-left: 15px;
}
}
.send-mail{
background: rgb(93,151,16);
border:1px solid;
width: 130px;
height: 40px;
font-size: 18px;
color:#ffffff;
outline: none;
}
}
\ No newline at end of file
src/app/body/contact/contact.component.spec.ts 0 → 100644
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ContactComponent } from './contact.component';
describe('ContactComponent', () => {
let component: ContactComponent;
let fixture: ComponentFixture<ContactComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ContactComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ContactComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/body/contact/contact.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-contact',
templateUrl: './contact.component.html',
styleUrls: ['./contact.component.scss']
})
export class ContactComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/body/products/products.component.scss 0 → 100644
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap');
*{
font-family: 'Roboto', sans-serif;
}
.pro-main{
padding-top: 100px;
text-align: center;
height: auto;
width:auto;
margin-bottom: 50px;
.banner-color{
background-color: rgb(241, 241, 241);
// width:100%;
}
.ban-sun{
background: url("../../../assets/img/asset_map.png");
background-repeat: no-repeat;
background-size: 65%;
background-repeat: no-repeat;
background-position: center;
}
.sun-det{
padding-top: 99px;
// width:960px;
height:401px ;
}
.sun-det h3{
color: #171717;
font-size: 48px;
font-weight: 800;
}
.sun-det b{
color: #67af05;
font-weight: 800;
}
.sun-det hr{
width: 56px;
// height: 15px;
margin-top: 0px;
border-top: 9px solid rgb(140,195,60);
}
.sun-det p{
font-size: 20px;
color:#464646;
margin-top: 20px;
font-weight: 500;
}
.decl p{
font-size: 15px;
font-weight: 500;
margin-top: 25px;
}
/***************************************************************************************************************/
.products-det{
// text-align: center;
.nav{
padding-left:467px;
}
.nav-tabs{
border-bottom: none;
.nav-link{
padding: 5px 20px 5px 20px;
color: #6e6e6e;
object-fit: contain;
font-family: Roboto;
font-size: 16px;
font-weight: 300;
font-style: normal;
font-stretch: normal;
letter-spacing: normal;
text-align: left;
margin-top: 25px;
}
.active{
background-color: #7db532;
border-radius: 0px;
color: #ffffff;
}
}
.alval{
width: 100%;
.row{
margin-bottom: 13px;
margin-right: 0px;
margin-left: 0px;
}
.col-md-6{
padding-left: 0px;
padding-right: 0px;
}
.img-cls{
width:70%;
margin-left: 167px;
}
.img-cls img{
width:100%;
height: 100%;
}
.txt-cls{
width: 70%;
height: 100%;
text-align:justify;
background: rgb(240,240,240);
padding: 30px;
.logo-im{
width:30%;
}
p{
font-size: 15px;
color: rgba(112, 112, 112, 0.92);
}
}
.txt-cls img{
width: 50%;
// height: 100%;
}
.img-cls-l{
width:70%;
height: 100%;
}
.img-cls-l img{
width:100%;
height: 100%;
}
.txt-cls-l{
width: 70%;
height: 100%;
text-align: left;
background: rgb(240,240,240);
padding: 30px;
margin-left: 167px;
p{
font-size: 15px;
color: rgba(112, 112, 112, 0.92);
}
}
.txt-cls-l img{
width: 50%;
// height: 100%;
}
.btn-mor button{
color:#ffff;
width: 100px;
height: 40px;
text-align: center;
font-size: 13px;
}
.btn-cab{
background: rgb(216,122,40);
border: 1px solid rgb(216,122,40);
}
.btn-doc{
background: rgb(160,31,98);
border: 1px solid rgb(160,31,98);
}
.btn-mom{
background: rgb(201,47,146);
border: 1px solid rgb(201,47,146);
}
.btn-fpay{
background: rgb(66,177,155);
border: 1px solid rgb(66,177,155);
}
}
}
}
src/app/body/products/products.component.spec.ts 0 → 100644
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ProductsComponent } from './products.component';
describe('ProductsComponent', () => {
let component: ProductsComponent;
let fixture: ComponentFixture<ProductsComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ProductsComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ProductsComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/body/products/products.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-products',
templateUrl: './products.component.html',
styleUrls: ['./products.component.scss']
})
export class ProductsComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/footer/footer.component.html 0 → 100644
<div class="foot-codeinfo">
<div class="container">
<div class="row">
<!-------------About--------------------->
<div class="col-md-4">
<div class="margins">
<h5>About Us</h5>
<p>Efficient elegant designed mobile templates for startups, developers, entrepreneurs & mores.</p>
</div>
</div>
<!--------------------------------our products------------------------------------------->
<div class="col-md-2">
<h5>Our Products</h5>
<li><a href="#!">Home InspireUI</a></li>
<li><a href="#!">SpotUI</a></li>
<li><a href="products"> Our products</a></li>
<li><a href="#!">Appstore (iOS)</a></li>
<!---- <li><a href="#!">Google Play (Android)</a></li>-->
</div>
<div class="margins-pro"></div>
<!---------------------------need help----------------------------------------------------------->
<div class="col-md-2">
<h5>Need Help</h5>
<li><a href="#!">Service</a></li>
<li><a href="#!">Terms of Service</a></li>
<li><a href="#!"> Privacy Policy</a></li>
<li><a href="#!">Blogs</a></li>
<!---- <li><a href="#!">Google Play (Android)</a></li>-->
</div>
<!---------------------------Get in Touch---------------------------------------------------------------->
<div class="col-md-4">
<h5>Get In Touch</h5>
<input type="text" class="txt-name" placeholder=" Name">
<input type="email" class="in-em" placeholder=" Email ID">
<textarea class="txt-mess" placeholder=" Message"></textarea>
<div class="btn-cnnt"><button type="button" class="send-btn">SEND</button></div>
</div>
</div>
</div>
</div>
src/app/footer/footer.component.scss 0 → 100644
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap');
*{
font-family: 'Roboto', sans-serif;
}
/************************footer main classs**********************************/
.foot-codeinfo{
width: auto;
height: auto;
background-color:rgb(28, 33,37);
color:#ffff;
.row{
width: auto;
}
.margins{
border-right: 1px solid #636c72;
height: 220px;
}
.col-md-4{
margin: 0 auto;
max-width: 313px;
margin-top: 36px;
margin-bottom: 20px;
text-align: left;
input{
width: 212px;
height: 32px;
background-color: #333;
border:1px solid #333;
margin-bottom: 6px;
font-size: 14px;
}
.txt-mess{
width: 212px;
background-color: #333;
border:1px solid #333;
height: 76px;
font-size: 14px;
color:#636c72;
outline:none;
resize: none;
}
button{
height: 30px;
width: 88px;
color:#fff;
background-color:rgb(110, 165, 37);
border: 1px solid rgb(110, 165, 37);
font-size: 14px;
}
h5{
font-size: 19px;
font-weight: bold;
cursor: pointer;
}
p{
font-size: 14px;
}
}
.col-md-2{
margin: 0 auto;
margin-top: 36px;
border-right: 1px solid #636c72;
height: 220px;
margin-left:20px;
text-align: left;
h5{
font-size: 19px;
font-weight: bold;
cursor: pointer;
}
li{
list-style: none;
text-align: left;
}
a{
text-decoration: none;
color:#fff;
font-size: 14px;
}
}
}
src/app/footer/footer.component.spec.ts 0 → 100644
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { FooterComponent } from './footer.component';
describe('FooterComponent', () => {
let component: FooterComponent;
let fixture: ComponentFixture<FooterComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ FooterComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(FooterComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/footer/footer.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-footer',
templateUrl: './footer.component.html',
styleUrls: ['./footer.component.scss']
})
export class FooterComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/header/header.component.html
......@@ -13,10 +13,10 @@
<a class="Text-Style nav-link" href="about">About us</a>
</li>
<li class="nav-item">
<a class="Text-Style nav-link" href="#">Products</a>
<a class="Text-Style nav-link" href="products">Products</a>
</li>
<li class="nav-item">
<a class="Text-Style nav-link" href="#">Contact us</a>
<a class="Text-Style nav-link" href="contact">Contact us</a>
</li>
<div class="icon_box"><img class="icon_facebook" src="../../assets/img/[email protected]"></div>
<div class="icon_box"><img class="icon_twitter" src="../../assets/img/[email protected]"></div>
......
src/assets/responsive.scss
......@@ -220,6 +220,119 @@ h2{
}
}
}
/******************contact**************************/
.cnt{
.send-mail{
width: 86px !important;
height: 34px !important;
font-size: 15px !important;
}
.cnt-det{
input{
width: 150px !important;
height: 25px !important;
margin-bottom: 10px !important;
}
.txt-left{
margin-right: 0px !important;
}
.form-control{
width:311px !important;
height: 35px !important;
}
.mess-txt{
width: 311px !important;
height: 75px !important;
margin-bottom: 0px !important;
}
}
.head-cnt{
p {
font-size: 17px !important;
}
}
}
/*************footer************/
.foot-codeinfo{
.row{
margin-left: 0px !important;
margin-right: 0px !important;
}
.col-md-4
{
margin-bottom: 5px !important;
margin-left:36px !important;
.margins{
border-right: 0 !important;
height: auto !important;
p{
font-size: 15px !important;
}
}
h5{
font-size: 19px !important;
}
}
.col-md-2{
margin-left: 36px !important;
border-right: 0px !important;
height: auto !important;
margin-top: 20px !important;
h5{
font-size: 19px !important;
}
a{
font-size: 15px !important;
}
}
}
/****************product*******************************/
.pro-main{
padding-top: 75px !important;
.ban-sun{
.sun-det{
h3{
font-size: 39px !important;
}
}
}
.products-det{
.decl{
p{
font-size: 18px !important;
}
}
.nav{
padding-left:86px !important;
}
.alval{
.img-cls {
width: 100% !important;
margin-left: 0 !important;
height: 100% !important;
}
.txt-cls{
width: 100% !important;
height: 100% !important;
}
.txt-cls-l{
width: 100% !important;
margin-left:0 !important;
}
.img-cls-l{
width:100% !important;
height: 100% !important;
}
}
}
}
}
......@@ -284,6 +397,65 @@ h2{
}
}
}
.foot-codeinfo{
.col-md-4{
max-width: 220px !important;
input{
width: 150px !important;
height: 22px !important;
}
textarea{
width: 150px !important;
height: 50px !important;
}
button{
height: 26px !important;
width: 59px !important;
}
}
}
.pro-main{
padding-top: 75px !important;
.decl{
p{
font-size: 19px !important;
}
}
.products-det{
.nav{
padding-left:256px !important;
}
.alval{
.img-cls {
width: 100% !important;
margin-left: 0 !important;
height: 100% !important;
}
.txt-cls{
width: 100% !important;
height: 100% !important;
p{
font-size: 18px !important;
}
}
.txt-cls-l{
width: 100% !important;
margin-left:0 !important;
p{
font-size: 18px !important;
}
}
.img-cls-l{
width:100% !important;
height: 100% !important;
}
}
}
}
}
/* 05.0 iPads (landscape) ----------- */
......@@ -355,7 +527,21 @@ h2{
/* 15.0 Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {}
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {
.cnt{
.head-cnt{
p{
font-size: 18px !important;
}
}
}
.foot-codeinfo{
.col-md-4{
margin-left:25px !important;
}
}
}
@media (max-width: 480px) {}
......
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