Commit c851f1bd by Aksa98

aksa initial push 7-12-2019

parent e9591824
......@@ -1071,6 +1071,7 @@
"resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz",
"integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==",
"dev": true,
"optional": true,
"requires": {
"delegates": "^1.0.0",
"readable-stream": "^2.0.6"
......@@ -2287,7 +2288,8 @@
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
"integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
"dev": true
"dev": true,
"optional": true
},
"constants-browserify": {
"version": "1.0.0",
......@@ -2686,7 +2688,8 @@
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
"integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=",
"dev": true
"dev": true,
"optional": true
},
"depd": {
"version": "1.1.2",
......@@ -3636,7 +3639,8 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"aproba": {
"version": "1.2.0",
......@@ -3657,12 +3661,14 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
......@@ -3677,17 +3683,20 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"core-util-is": {
"version": "1.0.2",
......@@ -3804,7 +3813,8 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"ini": {
"version": "1.3.5",
......@@ -3816,6 +3826,7 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
......@@ -3830,6 +3841,7 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
......@@ -3837,12 +3849,14 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
......@@ -3861,6 +3875,7 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
......@@ -3941,7 +3956,8 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
......@@ -3953,6 +3969,7 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
......@@ -4038,7 +4055,8 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"safer-buffer": {
"version": "2.1.2",
......@@ -4074,6 +4092,7 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
......@@ -4093,6 +4112,7 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
......@@ -4136,12 +4156,14 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"dev": true
"dev": true,
"optional": true
}
}
},
......@@ -4150,6 +4172,7 @@
"resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.12.tgz",
"integrity": "sha512-WvJ193OHa0GHPEL+AycEJgxvBEwyfRkN1vhjca23OaPVMCaLCXTd5qAu82AjTcgP1UJmytkOKb63Ypde7raDIg==",
"dev": true,
"optional": true,
"requires": {
"graceful-fs": "^4.1.2",
"inherits": "~2.0.0",
......@@ -4162,6 +4185,7 @@
"resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
"integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
"dev": true,
"optional": true,
"requires": {
"aproba": "^1.0.3",
"console-control-strings": "^1.0.0",
......@@ -4199,7 +4223,8 @@
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
"integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
"dev": true
"dev": true,
"optional": true
},
"get-stream": {
"version": "3.0.0",
......@@ -4379,7 +4404,8 @@
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
"integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk=",
"dev": true
"dev": true,
"optional": true
},
"has-value": {
"version": "1.0.0",
......@@ -5118,7 +5144,8 @@
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
"integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
"dev": true
"dev": true,
"optional": true
},
"is-windows": {
"version": "1.0.2",
......@@ -5751,6 +5778,7 @@
"resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
"integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
"dev": true,
"optional": true,
"requires": {
"graceful-fs": "^4.1.2",
"parse-json": "^2.2.0",
......@@ -5763,7 +5791,8 @@
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
"dev": true
"dev": true,
"optional": true
}
}
},
......@@ -6036,7 +6065,8 @@
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
"integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
"dev": true
"dev": true,
"optional": true
},
"map-visit": {
"version": "1.0.0",
......@@ -6671,6 +6701,7 @@
"resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
"integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
"dev": true,
"optional": true,
"requires": {
"are-we-there-yet": "~1.1.2",
"console-control-strings": "~1.1.0",
......@@ -7706,6 +7737,7 @@
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
"integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
"dev": true,
"optional": true,
"requires": {
"load-json-file": "^1.0.0",
"normalize-package-data": "^2.3.2",
......@@ -7717,6 +7749,7 @@
"resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
"integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
"dev": true,
"optional": true,
"requires": {
"graceful-fs": "^4.1.2",
"pify": "^2.0.0",
......@@ -7727,7 +7760,8 @@
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
"integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
"dev": true
"dev": true,
"optional": true
}
}
},
......@@ -7736,6 +7770,7 @@
"resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
"integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
"dev": true,
"optional": true,
"requires": {
"find-up": "^1.0.0",
"read-pkg": "^1.0.0"
......@@ -7746,6 +7781,7 @@
"resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
"integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
"dev": true,
"optional": true,
"requires": {
"path-exists": "^2.0.0",
"pinkie-promise": "^2.0.0"
......@@ -7756,6 +7792,7 @@
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
"integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
"dev": true,
"optional": true,
"requires": {
"pinkie-promise": "^2.0.0"
}
......@@ -9079,6 +9116,7 @@
"resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
"integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
"dev": true,
"optional": true,
"requires": {
"is-utf8": "^0.2.0"
}
......@@ -10418,6 +10456,7 @@
"resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
"integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==",
"dev": true,
"optional": true,
"requires": {
"string-width": "^1.0.2 || 2"
}
......
<app-header></app-header>
<router-outlet></router-outlet>
<app-footer></app-footer>
......@@ -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,
......
......@@ -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
......@@ -4,9 +4,11 @@ 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';
@NgModule({
declarations: [LandingpageComponent, AboutusComponent],
declarations: [LandingpageComponent, AboutusComponent,ProductsComponent,ContactComponent],
imports: [
CommonModule,
moduleRouting
......
<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>
@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
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();
});
});
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() {
}
}
<div class="pro-main">
<div class="banner-color">
<div class="container">
<div class="ban-sun">
<div class="sun-det">
<h3>The Sun has <b>Risen</b></h3>
<hr>
<p>Opt For Technically Advanced And High-End Products</p>
<div class="decl">
<p>Obtaining effectual, technological solutions from Techware Solution will make your life
easier. We provide a flexible and wide range of products and services helping your
business objectives and expectation into its peak..</p>
</div>
</div>
</div>
</div>
</div>
<!---------------------------pro Tab---------------------------------->
<div class="products-det">
<div class="container">
<div class="row">
<div class="col-md-12 ">
<nav>
<div class="nav nav-tabs " id="nav-tab" role="tablist">
<a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="nav-alla" aria-selected="true">All</a>
<a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="nav-web" aria-selected="false">Web</a>
<a class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact" role="tab" aria-controls="nav-app" aria-selected="false">App</a>
</div>
</nav>
<div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
<div class="alval">
<div class="row">
<div class="col-md-6 ">
<div class="img-cls">
<img src="../../../assets/img/asset_poster_one.png">
</div>
</div>
<div class="col-md-6 ">
<div class="txt-cls">
<img class="logo-im" src="../../../assets/img/cabok-log.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-cab">VIEW MORE</button></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="txt-cls-l">
<img src="../../../assets/img/bokdoc-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-doc">VIEW MORE</button></div>
</div>
</div>
<div class="col-md-6 ">
<div class="img-cls-l">
<img src="../../../assets/img/asset_poster_two.png">
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="img-cls">
<img src="../../../assets/img/asset_poster_four.png">
</div>
</div>
<div class="col-md-6 ">
<div class="txt-cls">
<img src="../../../assets/img/mom-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-mom">VIEW MORE</button></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="txt-cls-l">
<img src="../../../assets/img/finepay-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-fpay">VIEW MORE</button></div>
</div>
</div>
<div class="col-md-6 im-txt">
<div class="img-cls-l">
<img src="../../../assets/img/finepay.png">
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">
<div class="alval">
<div class="row">
<div class="col-md-6 ">
<div class="img-cls">
<img src="../../../assets/img/asset_poster_one.png">
</div>
</div>
<div class="col-md-6 ">
<div class="txt-cls">
<img class="logo-im" src="../../../assets/img/cabok-log.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-cab">VIEW MORE</button></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="txt-cls-l">
<img src="../../../assets/img/bokdoc-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-doc">VIEW MORE</button></div>
</div>
</div>
<div class="col-md-6 ">
<div class="img-cls-l">
<img src="../../../assets/img/asset_poster_two.png">
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="img-cls">
<img src="../../../assets/img/asset_poster_four.png">
</div>
</div>
<div class="col-md-6 ">
<div class="txt-cls">
<img src="../../../assets/imsg/mom-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-mom">VIEW MORE</button></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="txt-cls-l">
<img src="../../../assets/img/finepay-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-fpay">VIEW MORE</button></div>
</div>
</div>
<div class="col-md-6 im-txt">
<div class="img-cls-l">
<img src="../../../assets/img/finepay.png">
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
<div class="alval">
<div class="row">
<div class="col-md-6 ">
<div class="img-cls">
<img src="../../../assets/img/asset_poster_one.png">
</div>
</div>
<div class="col-md-6 ">
<div class="txt-cls">
<img class="logo-im" src="../../../assets/img/cabok-log.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-cab">VIEW MORE</button></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="txt-cls-l">
<img src="../../../assets/img/bokdoc-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-doc">VIEW MORE</button></div>
</div>
</div>
<div class="col-md-6 ">
<div class="img-cls-l">
<img src="../../../assets/img/asset_poster_two.png">
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="img-cls">
<img src="../../../assets/img/asset_poster_four.png">
</div>
</div>
<div class="col-md-6 ">
<div class="txt-cls">
<img src="../../../assets/img/mom-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-mom">VIEW MORE</button></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 ">
<div class="txt-cls-l">
<img src="../../../assets/img/finepay-logo.png">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the
1500s, when an unknown printer took a galley of type </p>
<div class="btn-mor"><button class="btn-fpay">VIEW MORE</button></div>
</div>
</div>
<div class="col-md-6 im-txt">
<div class="img-cls-l">
<img src="../../../assets/img/finepay.png">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
@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);
}
}
}
}
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();
});
});
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() {
}
}
<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>
@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;
}
}
}
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();
});
});
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() {
}
}
......@@ -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>
......
......@@ -195,6 +195,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;
}
}
}
}
}
......@@ -259,6 +372,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) ----------- */
......@@ -330,7 +502,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