Commit e9591824 by abrahamtom

intial

parents
# Editor configuration, see https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true
[*.md]
max_line_length = off
trim_trailing_whitespace = false
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
/dist
/tmp
/out-tsc
# Only exists if Bazel was run
/bazel-out
# dependencies
/node_modules
# profiling files
chrome-profiler-events.json
speed-measure-plugin.json
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*
# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
# System Files
.DS_Store
Thumbs.db
# Codeinfotec
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.9.
## Development server
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
## Code scaffolding
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
## Build
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
## Running unit tests
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
## Running end-to-end tests
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
## Further help
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"codeinfotec": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"style": "scss"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/codeinfotec",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss",
"src/assets/responsive.scss",
"node_modules/bootstrap/dist/css/bootstrap.css",
"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"
],
"es5BrowserSupport": true
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "codeinfotec:build"
},
"configurations": {
"production": {
"browserTarget": "codeinfotec:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "codeinfotec:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js",
"styles": [
"src/styles.scss"
],
"scripts": [],
"assets": [
"src/favicon.ico",
"src/assets"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
},
"codeinfotec-e2e": {
"root": "e2e/",
"projectType": "application",
"prefix": "",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "codeinfotec:serve"
},
"configurations": {
"production": {
"devServerTarget": "codeinfotec:serve:production"
}
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": "e2e/tsconfig.e2e.json",
"exclude": [
"**/node_modules/**"
]
}
}
}
}
},
"defaultProject": "codeinfotec"
}
\ No newline at end of file
// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts
const { SpecReporter } = require('jasmine-spec-reporter');
exports.config = {
allScriptsTimeout: 11000,
specs: [
'./src/**/*.e2e-spec.ts'
],
capabilities: {
'browserName': 'chrome'
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
onPrepare() {
require('ts-node').register({
project: require('path').join(__dirname, './tsconfig.e2e.json')
});
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
}
};
\ No newline at end of file
import { AppPage } from './app.po';
import { browser, logging } from 'protractor';
describe('workspace-project App', () => {
let page: AppPage;
beforeEach(() => {
page = new AppPage();
});
it('should display welcome message', () => {
page.navigateTo();
expect(page.getTitleText()).toEqual('Welcome to codeinfotec!');
});
afterEach(async () => {
// Assert that there are no errors emitted from the browser
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
expect(logs).not.toContain(jasmine.objectContaining({
level: logging.Level.SEVERE,
} as logging.Entry));
});
});
import { browser, by, element } from 'protractor';
export class AppPage {
navigateTo() {
return browser.get(browser.baseUrl) as Promise<any>;
}
getTitleText() {
return element(by.css('app-root h1')).getText() as Promise<string>;
}
}
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"module": "commonjs",
"target": "es5",
"types": [
"jasmine",
"jasminewd2",
"node"
]
}
}
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"name": "codeinfotec",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~7.2.0",
"@angular/common": "~7.2.0",
"@angular/compiler": "~7.2.0",
"@angular/core": "~7.2.0",
"@angular/forms": "~7.2.0",
"@angular/platform-browser": "~7.2.0",
"@angular/platform-browser-dynamic": "~7.2.0",
"@angular/router": "~7.2.0",
"angular-font-awesome": "^3.1.2",
"bootstrap": "^4.3.1",
"core-js": "^2.5.4",
"font-awesome": "^4.7.0",
"jquery": "^3.4.1",
"rxjs": "~6.3.3",
"tslib": "^1.9.0",
"zone.js": "~0.8.26"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.13.0",
"@angular/cli": "~7.3.9",
"@angular/compiler-cli": "~7.2.0",
"@angular/language-service": "~7.2.0",
"@types/node": "~8.9.4",
"@types/jasmine": "~2.8.8",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "~4.5.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~3.2.2"
}
}
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const routes: Routes = [
{
path: '', redirectTo: 'landing', pathMatch: 'full'
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
<app-header></app-header>
<router-outlet></router-outlet>
import { TestBed, async } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';
describe('AppComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
RouterTestingModule
],
declarations: [
AppComponent
],
}).compileComponents();
}));
it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.debugElement.componentInstance;
expect(app).toBeTruthy();
});
it(`should have as title 'codeinfotec'`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.debugElement.componentInstance;
expect(app.title).toEqual('codeinfotec');
});
it('should render title in a h1 tag', () => {
const fixture = TestBed.createComponent(AppComponent);
fixture.detectChanges();
const compiled = fixture.debugElement.nativeElement;
expect(compiled.querySelector('h1').textContent).toContain('Welcome to codeinfotec!');
});
});
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
title = 'codeinfotec';
}
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import{ BodyModule } from './body/body.module';
import { AngularFontAwesomeModule } from 'angular-font-awesome';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HeaderComponent } from './header/header.component';
import { from } from 'rxjs';
@NgModule({
declarations: [
AppComponent,
HeaderComponent
],
imports: [
BrowserModule,
AppRoutingModule,
AngularFontAwesomeModule,
BodyModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
<div class="about">
<div class="map_overlay">
<h2><div class="h2_style">WHAT IS </div>CODEINFOTEC ?</h2>
<hr>
<h5>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</h5>
<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 and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
<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 and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.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 and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publis.</p>
</div>
<div class="our_process">
<div class="our_process_bg">
<h3>Our Process</h3>
<hr>
<div class="container">
<div class="row">
<div class="col">
<div class="our_process_img">
<img src="../../../assets/img/circle_one.png">
</div>
<div class="our_process_contents">
<div class="process_line"></div>
<h4 class="discover_color">Discover</h4>
<p>Many aspects need to be taken into consideration when website is created. It involves a good understanding of brand value, company details, targeted audience and many more</p>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="our_process_img">
<img src="../../../assets/img/circle_two.png">
</div>
<div class="our_process_contents">
<div class="process_line"></div>
<h4 class="concept_color">Concept</h4>
<p>We apply what we know about your business against research to help define our first steps forward as well as highlight potential opportunities with the new design.</p>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="our_process_img">
<img src="../../../assets/img/circle_three.png">
</div>
<div class="our_process_contents">
<div class="process_line"></div>
<h4 class="design_color">Design</h4>
<p>Now we have an understanding of all the elements, we will start working closely with you to develop your chosen design and create further pages</p>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="our_process_img">
<img src="../../../assets/img/circle_four.png">
</div>
<div class="our_process_contents">
<h4 class="build_color">Build</h4>
<p>Once You approve the final design for your website,we move towards the next step and our developers get started with the coding</p>
</div>
</div>
</div>
</div>
<div class="clear"></div>
</div>
</div>
<div class="anim_background">
<div class="anim_background_overlay">
<div class="container">
<div class="row">
<div class="col-md-3">
<h3>300+</h3>
<h5>Active Clients</h5>
</div>
<div class="col-md-3">
<h3>5000+</h3>
<h5>Sales</h5>
</div>
<div class="col-md-3">
<h3>35+</h3>
<h5>Products</h5>
</div>
<div class="col-md-3">
<h3>80%+</h3>
<h5>Satisfied Clients</h5>
</div>
</div>
</div>
</div>
</div>
<div class="our_values">
<h3>Our Values</h3>
<hr>
<div class="container">
<div class="row">
<div class="col-md-5">
<div class="value_col">
<div class="value_img">
<img src="../../../assets/img/[email protected]" alt="hand">
</div>
<h6>EXCELLENCE</h6>
<p>Every successful business focuses on excellence. We expect the highest level of service for our clients and we expect our clients to share this value in their businesses. Our partnership with you is a reflection on us, and vice versa.</p>
</div>
</div>
<div class="col-md-5">
<div class="value_col">
<div class="value_img">
<img src="../../../assets/img/bulb.png" alt="bulb">
</div>
<h6>CREATIVITY</h6>
<p>Every successful business focuses on excellence. We expect the highest level of service for our clients and we expect our clients to share this value in their businesses. Our partnership with you is a reflection on us, and vice versa.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-5">
<div class="value_col">
<div class="value_img">
<img src="../../../assets/img/[email protected]" alt="hand">
</div>
<h6>INTEGRATION</h6>
<p>Every successful business focuses on excellence. We expect the highest level of service for our clients and we expect our clients to share this value in their businesses. Our partnership with you is a reflection on us, and vice versa.</p>
</div>
</div>
<div class="col-md-5">
<div class="value_col">
<div class="value_img">
<img src="../../../assets/img/bulb.png" alt="bulb">
</div>
<h6>INTEGRITY</h6>
<p>Every successful business focuses on excellence. We expect the highest level of service for our clients and we expect our clients to share this value in their businesses. Our partnership with you is a reflection on us, and vice versa.</p>
</div>
</div>
</div>
</div>
</div>
</div>
.about{
padding-top: 150px;
.map_overlay{
margin: 0 auto;
background-size: 100%;
background-repeat: no-repeat;
max-width: 1319px;
background-image: url("../../../assets//img/map_about.png");
padding-bottom: 85px;
h2{
padding-top: 72px;
object-fit: contain;
font-family: Roboto;
font-size: 48px;
font-weight: 900;
font-style: normal;
font-stretch: normal;
line-height: 1.04;
letter-spacing: normal;
text-align: center;
color: #171717;
}
.h2_style{
color: #67af05;
display: inline;
}
hr{
border: 5px solid rgb(125,181,50);
width: 57px;
background-color: rgb(125,181,50);
}
h5{
margin-top: 30px;
object-fit: contain;
font-family: Roboto;
font-size: 22px;
font-weight: 500;
font-style: normal;
font-stretch: normal;
line-height: 2.59;
letter-spacing: normal;
text-align: center;
color: #464646;
}
p{
max-width: 1116px;
object-fit: contain;
font-family: Roboto;
font-size: 15px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.8;
margin: 0 auto;
letter-spacing: normal;
text-align: center;
color: #464646;
margin-bottom: 0px;
}
}
.our_process{
background-image: url("../../../assets/img/[email protected]");
background-repeat: no-repeat;
background-size: 100%;
text-align: center;
.our_process_bg{
background-color: rgba(244, 244, 244,.6);
padding-bottom: 40px;
h3{
object-fit: contain;
font-family: Roboto;
font-size: 40px;
font-weight: bold;
font-style: normal;
font-stretch: normal;
line-height: 0.68;
letter-spacing: normal;
text-align: center;
color: #171717;
padding-top: 50px;
}
hr{
border: 3px solid rgb(125,181,50);
width: 47px;
background-color: rgb(125,181,50);
}
.container{
.row{
.col{
padding-top: 50px;
text-align: left;
.our_process_img{
margin-right: 40px;
width: auto;
height: 80px;
vertical-align: top;
float: left;
img{
height: 100%;
width: 100%;
}
}
.our_process_contents{
float: left;
width: calc(100% - 125px);
position: relative;
height: 100%;
.process_line{
position: absolute;
border-left: 2px solid #000000;
height: inherit;
top: 50px;
left:-80px;
z-index: -1;
}
h4{
text-align: left !important;
object-fit: contain;
font-family: Roboto;
font-size: 22px;
font-weight: 500;
font-style: normal;
font-stretch: normal;
line-height: 1.23;
letter-spacing: normal;
text-align: center;
}
.discover_color{
color: #d20710;
}
.concept_color{
color: #059cce;
}
.design_color{
color: #ea890b;
}
.build_color{
color: #1ab121;
}
p{
object-fit: contain;
font-family: Roboto;
font-size: 18px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.5;
letter-spacing: normal;
text-align: justify;
color: #464646;
}
}
}
}
}
}
}
.anim_background{
background:url("../../../assets/img/asset_background.png");
background-repeat: no-repeat;
background-size: 100%;
background-attachment: fixed;
.anim_background_overlay{
background-color: rgb(23, 29, 33);
filter: opacity(.9);
.container{
.row{
padding-top: 80px;
padding-bottom: 80px;
.col-md-3{
border-right: 1px solid ;
border-color: #777676;
h3{
text-align: center !important;
object-fit: contain;
font-family: Roboto;
font-size: 64px;
font-weight: 300;
font-style: normal;
font-stretch: normal;
line-height: 0.74;
letter-spacing: normal;
text-align: left;
color: #ffffff;
}
h5{
text-align: center !important;
object-fit: contain;
font-family: Myriad Pro;
font-size: 27.5px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.73;
letter-spacing: normal;
text-align: left;
color: #ffffff;
}
}
}
}
}
}
.our_values{
text-align: center;
h3{
object-fit: contain;
font-family: Roboto;
font-size: 40px;
font-weight: bold;
font-style: normal;
font-stretch: normal;
line-height: 0.68;
letter-spacing: normal;
text-align: center;
color: #171717;
padding-top: 50px;
}
hr{
border: 3px solid rgb(125,181,50);
width: 47px;
background-color: rgb(125,181,50);
}
.container{
margin-top: 50px;
.row{
justify-content: space-around;
.col-md-5{
.value_col{
.value_img{
height: 90px;
width: 90px;
img{
height: 100%;
width: auto;
}
}
h6{
padding-top: 25px;
object-fit: contain;
font-family: Roboto;
font-size: 22px;
font-weight: 500;
font-style: normal;
font-stretch: normal;
line-height: 1.23;
letter-spacing: normal;
text-align: left;
color: #000000;
}
p{
padding-top: 25px;
object-fit: contain;
font-family: Roboto;
font-size: 15px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.8;
letter-spacing: normal;
text-align: justify;
color: #000000;
}
}
}
}
}
}
}
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { AboutusComponent } from './aboutus.component';
describe('AboutusComponent', () => {
let component: AboutusComponent;
let fixture: ComponentFixture<AboutusComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AboutusComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AboutusComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-aboutus',
templateUrl: './aboutus.component.html',
styleUrls: ['./aboutus.component.scss']
})
export class AboutusComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LandingpageComponent } from './landingpage/landingpage.component';
import { AboutusComponent } from './aboutus/aboutus.component';
const ModuleRoutes: Routes = [
{
path:'landing',component: LandingpageComponent
},
{
path:'about',component: AboutusComponent
}
];
export const moduleRouting: ModuleWithProviders = RouterModule.forChild(ModuleRoutes)
\ No newline at end of file
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { LandingpageComponent } from './landingpage/landingpage.component';
import{ moduleRouting } from './body-routing.module';
import { from } from 'rxjs';
import { AboutusComponent } from './aboutus/aboutus.component';
@NgModule({
declarations: [LandingpageComponent, AboutusComponent],
imports: [
CommonModule,
moduleRouting
]
})
export class BodyModule { }
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { LandingpageComponent } from './landingpage.component';
describe('LandingpageComponent', () => {
let component: LandingpageComponent;
let fixture: ComponentFixture<LandingpageComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ LandingpageComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(LandingpageComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-landingpage',
templateUrl: './landingpage.component.html',
styleUrls: ['./landingpage.component.scss']
})
export class LandingpageComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
<nav class="navbar navbar-expand-sm">
<div class="container">
<div class="logo" href="#"><img src="../../assets/img/vector-smart-object.png"></div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
<span class="navbar-toggler-icon"><i class="fa fa-bars"></i></span>
</button>
<div class="collapse navbar-collapse" id="collapsibleNavbar">
<ul class="navbar-nav">
<li class="nav-item">
<a class="Text-Style nav-link" href="#">Home</a>
</li>
<li class="nav-item">
<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>
</li>
<li class="nav-item">
<a class="Text-Style nav-link" href="#">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>
<div class="icon_box"><img class="icon_google" src="../../assets/img/[email protected]"></div>
</ul>
</div>
</div>
</nav>
\ No newline at end of file
nav{
position: fixed;
width: 100%;
z-index: 10;
.logo{
max-width: 380px;
max-height: 78px;
img{
width: 100%;
height: 100%;
}
}
.navbar-collapse{
margin-left: 160px;
ul{
li{
width: 101px;
height: 41px;
a{
width: 100%;
height: 100%;
text-align: center;
}
&:hover{
border: 2px solid rgb(125,181,50);
}
}
.icon_box{
height: 43px;
width: 43px;
border: 2px solid rgb(125,181,50);
text-align: center;
margin-left: 5px;
img{
max-width: 100%;
max-height: 100%;
}
.icon_facebook{
width: 10px;
margin: 10px;
height: 21px;
}
.icon_twitter{
width: 25px;
height: 21px;
margin: 8px;
}
.icon_google{
width: 20px;
height: 21px;
margin: 9px;
}
}
}
}
}
.Text-Style {
font-family: Roboto;
font-size: 15px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
letter-spacing: normal;
text-align: left;
color: #404041;
}
\ No newline at end of file
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { HeaderComponent } from './header.component';
describe('HeaderComponent', () => {
let component: HeaderComponent;
let fixture: ComponentFixture<HeaderComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ HeaderComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(HeaderComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.scss']
})
export class HeaderComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
/*
Site Name:
URI: http:
Description: This is the responsive css for
Version: 2.0
Author: Amal-Techware Solution
Author URI:
Tags:
---------------------------
CUSTOM STYLES
---------------------------
TABLE OF CONTENTS
---------------------------
01.0 Smartphones (portrait and landscape)
02.0 Smartphones (landscape)
03.0 Smartphones (portrait)
04.0 iPads (portrait and landscape)
05.0 iPads (landscape)
06.0 iPads (portrait)
07.0 Desktops and laptops
08.0 Large screens
09.0 iPhone 4
10.0 iPhone 5
11.0 iPhone 6
12.0 iPhone 6+
13.0 Samsung Galaxy S3
14.0 Samsung Galaxy S4
15.0 Samsung Galaxy S5
*/
/* 01. Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
//navbar scss
nav{
.logo{
max-width: 250px !important;
}
.navbar-collapse{
ul{
li{
a{
text-align: left !important;
}
}
.icon_box{
margin-bottom: 10px !important;
}
}
}
}
// landing page scss
.backgnd_grey{
.map_overlay{
.map_contents{
padding-top: 100px !important;
padding-bottom: 50px !important;
.row{
.col-md-5{
.left_side{
font-size: 28px !important;
.lorem{
font-size: 50px !important;
}
.ipsum{
font-size: 50px !important;
}
}
}
.col-md-7{
.right_side{
max-width: 400px !important;
}
}
}
}
}
}
.our_products{
margin-bottom: 50px !important;
.prod_overlay{
padding-top: 40px !important;
}
.pill_margin{
margin-top: 40px !important;
}
.container{
.nav-pills{
.nav-item{
.nav-link{
padding: 5px 25px 5px 25px !important;
}
}
}
.tab-content{
.tab-pane{
.row{
.col{
display: contents !important;
.prod_img{
height: 300px !important;
padding-top: 10px !important;
}
.prod_hover{
.prod_hover_overlay{
margin: 20px 20px 20px 20px !important;
img{
height: 50px !important;
}
h6{
margin-top: 0px !important;
}
p{
margin-top: 0px !important;
}
}
}
}
}
}
}
}
}
h2{
font-size: 35px !important;
}
.why_codein_overlay{
.code_overlay{
padding-top: 40px !important;
}
.icon_container{
.row{
.col{
.image_icon{
width: 110px !important;
height: 100px !important;
}
}
}
}
}
.rating_review{
.rating_overlay{
padding-top: 40px !important;
}
.rating_review_box{
padding-top: 20px !important;
.rating_review_box_one{
.row{
.rating_head{
.rating_star{
margin: 0px 10px 0px 10px !important;
}
.kochi_taxi{
padding: 0px 10px 0px 0px !important;
}
}
}
.rating_body{
.rating_content{
margin: 35px 15px 35px 15px !important;
}
}
}
}
}
//scss for aboutus
.about{
padding-top: 50px !important;
.map_overlay{
padding-left: 10px !important;
padding-right: 10px !important;
padding-bottom: 40px !important;
h5{
line-height: 1.5 !important;
}
p{
text-align: justify !important;
}
}
}
.anim_background{
.anim_background_overlay{
.container{
.row{
.col-md-3{
padding-top: 30px !important;
}
}
}
}
}
}
/* 02.0 Smartphones (landscape) ----------- */
@media only screen and (min-width: 321px) {}
/* 03.0 Smartphones (portrait) ----------- */
@media only screen and (max-width: 320px) {}
/* 04.0 iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
//scss for nav
nav{
.logo{
max-width: 250px !important;
}
.navbar-collapse{
margin-left: 0px !important;
}
}
//scss for landing
.backgnd_grey{
.map_overlay{
.map_contents{
padding-top: 180px !important;
padding-bottom: 150px !important;
}
}
}
.our_products{
.container{
.tab-content{
.tab-pane{
.row{
.col{
padding: 8px !important;
.prod_img{
width: 680px !important;
height: 100% !important;
}
.prod_hover{
.prod_hover_overlay{
img{
height: 60px !important;
}
h6{
font-size: 32px !important;
}
p{
font-size: 18px !important;
}
}
}
}
}
}
}
}
}
}
/* 05.0 iPads (landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {}
/* 06.0 iPads (portrait) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {}
/* 07.0 Desktops and laptops ----------- */
/* LOW RESOLUTION ----------- */
@media only screen and (min-width: 900px) and (max-device-width: 1249px) {
}
@media only screen and (min-width: 1250px) and (max-device-width: 1359px) {
}
@media only screen and (min-width: 1360px) and (max-device-width: 1399px) {
}
@media only screen and (min-width: 1400px) and (max-device-width: 1600px) {
}
/* 08.0 Large screens ----------- */
@media only screen and (min-width: 1824px) {}
/* 09.0 iPhone 4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {}
/* 10.0 iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {}
/* 11.0 iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {}
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {}
/* 12.0 iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {}
/* 13.0 Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2) {}
/* 14.0 Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3) {}
/* 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 (max-width: 480px) {}
@media only screen and (min-width: 1000px) {}
\ No newline at end of file
# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
#
# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11
\ No newline at end of file
export const environment = {
production: true
};
// This file can be replaced during build by using the `fileReplacements` array.
// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
// The list of file replacements can be found in `angular.json`.
export const environment = {
production: false
};
/*
* For easier debugging in development mode, you can import the following file
* to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
*
* This import should be commented out in production mode because it will have a negative impact
* on performance if an error is thrown.
*/
// import 'zone.js/dist/zone-error'; // Included with Angular CLI.
File added
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Codeinfotec</title>
<base href="/">
<script src="https://kit.fontawesome.com/d37b6e51ed.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, '../coverage/codeinfotec'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
restartOnFileChange: true
});
};
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
/**
* This file includes polyfills needed by Angular and is loaded before the app.
* You can add your own extra polyfills to this file.
*
* This file is divided into 2 sections:
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
* file.
*
* The current setup is for so-called "evergreen" browsers; the last versions of browsers that
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
*
* Learn more in https://angular.io/guide/browser-support
*/
/***************************************************************************************************
* BROWSER POLYFILLS
*/
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
// import 'classlist.js'; // Run `npm install --save classlist.js`.
/**
* Web Animations `@angular/platform-browser/animations`
* Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
* Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
*/
// import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/**
* By default, zone.js will patch all possible macroTask and DomEvents
* user can disable parts of macroTask/DomEvents patch by setting following flags
* because those flags need to be set before `zone.js` being loaded, and webpack
* will put import in the top of bundle, so user need to create a separate file
* in this directory (for example: zone-flags.ts), and put the following flags
* into that file, and then add the following code before importing zone.js.
* import './zone-flags.ts';
*
* The flags allowed in zone-flags.ts are listed here.
*
* The following flags will work for all browsers.
*
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
* (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
*
* (window as any).__Zone_enable_cross_context_check = true;
*
*/
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
*/
/* You can add global styles to this file, and also import other style files */
@import url("https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap");
@import url("http://allfont.net/allfont.css?fonts=franklin-gothic-demi-cond");
.clear{
clear: both;
}
\ No newline at end of file
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';
declare const require: any;
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
);
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.
context.keys().map(context);
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"types": []
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/spec",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts",
"polyfills.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}
{
"extends": "../tslint.json",
"rules": {
"directive-selector": [
true,
"attribute",
"app",
"camelCase"
],
"component-selector": [
true,
"element",
"app",
"kebab-case"
]
}
}
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "es2015",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2018",
"dom"
]
}
}
{
"extends": "tslint:recommended",
"rulesDirectory": [
"codelyzer"
],
"rules": {
"array-type": false,
"arrow-parens": false,
"deprecation": {
"severity": "warn"
},
"import-blacklist": [
true,
"rxjs/Rx"
],
"interface-name": false,
"max-classes-per-file": false,
"max-line-length": [
true,
140
],
"member-access": false,
"member-ordering": [
true,
{
"order": [
"static-field",
"instance-field",
"static-method",
"instance-method"
]
}
],
"no-consecutive-blank-lines": false,
"no-console": [
true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-empty": false,
"no-inferrable-types": [
true,
"ignore-params"
],
"no-non-null-assertion": true,
"no-redundant-jsdoc": true,
"no-switch-case-fall-through": true,
"no-use-before-declare": true,
"no-var-requires": false,
"object-literal-key-quotes": [
true,
"as-needed"
],
"object-literal-sort-keys": false,
"ordered-imports": false,
"quotemark": [
true,
"single"
],
"trailing-comma": false,
"no-output-on-prefix": true,
"use-input-property-decorator": true,
"use-output-property-decorator": true,
"use-host-property-decorator": true,
"no-input-rename": true,
"no-output-rename": true,
"use-life-cycle-interface": true,
"use-pipe-transform-interface": true,
"component-class-suffix": true,
"directive-class-suffix": true
}
}
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