This is an automated email from the ASF dual-hosted git repository. myrle pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/fineract-cn-group-finance.git
commit 7cd970ae7047cf4117c047cb03019441fa308c2c Author: pembemiriam <pembe.mir...@skylabase.com> AuthorDate: Tue Mar 27 08:56:15 2018 +0100 first commit --- package-lock.json | 26 +++++++++++++++++ package.json | 6 +++- src/app/app.component.html | 21 +------------- src/app/app.component.ts | 2 +- src/app/app.module.ts | 9 ++++-- src/app/login/login.component.css | 52 ++++++++++++++++++++++++++++++++++ src/app/login/login.component.html | 37 ++++++++++++++++++++++++ src/app/login/login.component.spec.ts | 25 ++++++++++++++++ src/app/login/login.component.ts | 18 ++++++++++++ src/assets/Background.png | Bin 0 -> 11398 bytes src/assets/fineract.png | Bin 0 -> 7105 bytes src/index.html | 1 + src/main.ts | 2 +- src/styles.css | 1 + 14 files changed, 175 insertions(+), 25 deletions(-) diff --git a/package-lock.json b/package-lock.json index 505bfb5..9afe49c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -68,6 +68,14 @@ "tslib": "1.9.0" } }, + "@angular/cdk": { + "version": "5.2.4", + "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-5.2.4.tgz", + "integrity": "sha1-wKQpqHENj+2xV/VG4hy0nUM19/c=", + "requires": { + "tslib": "1.9.0" + } + }, "@angular/cli": { "version": "1.7.3", "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-1.7.3.tgz", @@ -201,6 +209,14 @@ "integrity": "sha512-aaLnGpW9NBDkG0JYqUeGc+al1Jd1CY9yrs3mew53x5nByetQbIdZwpYm1hnSTw7LBEZBxfHTMw5EZD2YYTDmJw==", "dev": true }, + "@angular/material": { + "version": "5.2.4", + "resolved": "https://registry.npmjs.org/@angular/material/-/material-5.2.4.tgz", + "integrity": "sha1-noI3mDJCg9I+qDkVb6xby3NEPVU=", + "requires": { + "tslib": "1.9.0" + } + }, "@angular/platform-browser": { "version": "5.2.9", "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-5.2.9.tgz", @@ -4769,6 +4785,11 @@ "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=", "dev": true }, + "hammerjs": { + "version": "2.0.8", + "resolved": "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz", + "integrity": "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE=" + }, "handle-thing": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz", @@ -6783,6 +6804,11 @@ "object-visit": "1.0.1" } }, + "material-design-icons": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/material-design-icons/-/material-design-icons-3.0.1.tgz", + "integrity": "sha1-mnHEh0chjrylHlGmbaaCA4zct78=" + }, "md5.js": { "version": "1.3.4", "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.4.tgz", diff --git a/package.json b/package.json index b3235d3..d33309e 100644 --- a/package.json +++ b/package.json @@ -12,16 +12,20 @@ }, "private": true, "dependencies": { - "@angular/animations": "^5.2.0", + "@angular/animations": "^5.2.9", + "@angular/cdk": "^5.2.4", "@angular/common": "^5.2.0", "@angular/compiler": "^5.2.0", "@angular/core": "^5.2.0", "@angular/forms": "^5.2.0", "@angular/http": "^5.2.0", + "@angular/material": "^5.2.4", "@angular/platform-browser": "^5.2.0", "@angular/platform-browser-dynamic": "^5.2.0", "@angular/router": "^5.2.0", "core-js": "^2.4.1", + "hammerjs": "^2.0.8", + "material-design-icons": "^3.0.1", "rxjs": "^5.5.6", "zone.js": "^0.8.19" }, diff --git a/src/app/app.component.html b/src/app/app.component.html index fa2706a..6fcb6f0 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,20 +1 @@ -<!--The content below is only a placeholder and can be replaced.--> -<div style="text-align:center"> - <h1> - Welcome to {{ title }}! - </h1> - <img width="300" alt="Angular Logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTg [...] -</div> -<h2>Here are some links to help you start: </h2> -<ul> - <li> - <h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2> - </li> - <li> - <h2><a target="_blank" rel="noopener" href="https://github.com/angular/angular-cli/wiki">CLI Documentation</a></h2> - </li> - <li> - <h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2> - </li> -</ul> - +<app-login></app-login> \ No newline at end of file diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 7b0f672..cb3f820 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -6,5 +6,5 @@ import { Component } from '@angular/core'; styleUrls: ['./app.component.css'] }) export class AppComponent { - title = 'app'; + } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 926975a..d96765b 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,16 +1,21 @@ import { BrowserModule } from '@angular/platform-browser'; +import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; +import {MatButtonModule, MatCheckboxModule, MatInputModule, MatIconModule, MatFormFieldModule} from '@angular/material'; + import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; +import {LoginComponent} from './login/login.component' @NgModule({ declarations: [ - AppComponent + AppComponent,LoginComponent ], imports: [ - BrowserModule + BrowserModule,MatButtonModule, MatCheckboxModule, MatInputModule, MatIconModule, + MatFormFieldModule ], providers: [], bootstrap: [AppComponent] diff --git a/src/app/login/login.component.css b/src/app/login/login.component.css new file mode 100644 index 0000000..5c291d8 --- /dev/null +++ b/src/app/login/login.component.css @@ -0,0 +1,52 @@ +.greetings{ + color:white; + margin-left:50px; + font-size:30px; + margin-bottom:1%; +} +.login-div{ + background-color: white; + border-radius: 5px; + width:40%; + +} +.main-background{ + + flex: 1; + width: 100%; + height:100%; + min-width: 100%; + position:fixed; +} +.image-div,.login-div{ + display: flex; + display: inline-block; + flex-direction: row; + vertical-align: top; + + +} +.image-div{ + margin-top:5%; +} + +.app-input{ + padding:10%; + + +} +.btn{ + margin-left: 10%; + margin-right: 10%; + width:70%; +} +.welcome,.language{ + display:flex; + display: inline-block; + flex-direction: row; + + +} +.language{ + margin-left: 10%; +} \ No newline at end of file diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html new file mode 100644 index 0000000..f10ae70 --- /dev/null +++ b/src/app/login/login.component.html @@ -0,0 +1,37 @@ +<div class="main-background" style="background-image:url('assets/Background.png');"> + <div style="margin-top:10%; margin-left:10%;"> + <div class="welcome"> + <span class="greetings">Welcome To Apache Fineract CN</span> + </div> + <div class="language"> + <span>Change language</span> + </div> + </div> + <div style="margin-left:10%;"> + <div class="image-div"> + <img src="assets/fineract.png" class="image"> + </div> +<div class="login-div mat-elevation-z2"> + <mat-icon class="app-input">business</mat-icon> + <mat-form-field> + <input matInput placeholder="Tenant" class="app-input"> +</mat-form-field> + <br> + <mat-icon class="app-input">person</mat-icon> + <mat-form-field> + <input matInput placeholder="Username" class="app-input"> + </mat-form-field> + <br> + <mat-icon class="app-input">https</mat-icon> + <mat-form-field> + <input matInput placeholder="Password" class="app-input"> + </mat-form-field> + <p> + <button mat-raised-button color="primary" type="submit" class="btn">Sign In</button> + </p> +</div> +</div> + + + +</div> diff --git a/src/app/login/login.component.spec.ts b/src/app/login/login.component.spec.ts new file mode 100644 index 0000000..d6d85a8 --- /dev/null +++ b/src/app/login/login.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { LoginComponent } from './login.component'; + +describe('LoginComponent', () => { + let component: LoginComponent; + let fixture: ComponentFixture<LoginComponent>; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ LoginComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(LoginComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts new file mode 100644 index 0000000..bcaaa45 --- /dev/null +++ b/src/app/login/login.component.ts @@ -0,0 +1,18 @@ +import { Component, OnInit } from '@angular/core'; +import { FormGroup, FormBuilder, Validators } from '@angular/forms'; +import {Router } from '@angular/router' + + +@Component({ + selector: 'app-login', + templateUrl: './login.component.html', + styleUrls: ['./login.component.css'] +}) +export class LoginComponent implements OnInit { + + constructor(){} + + ngOnInit() { + } + +} diff --git a/src/assets/Background.png b/src/assets/Background.png new file mode 100644 index 0000000..0405bb1 Binary files /dev/null and b/src/assets/Background.png differ diff --git a/src/assets/fineract.png b/src/assets/fineract.png new file mode 100644 index 0000000..85e8e66 Binary files /dev/null and b/src/assets/fineract.png differ diff --git a/src/index.html b/src/index.html index 80c80db..e63daa5 100644 --- a/src/index.html +++ b/src/index.html @@ -7,6 +7,7 @@ <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico"> + <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> </head> <body> <app-root></app-root> diff --git a/src/main.ts b/src/main.ts index 91ec6da..4220bc8 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,6 +1,6 @@ import { enableProdMode } from '@angular/core'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; - +import 'hammerjs'; import { AppModule } from './app/app.module'; import { environment } from './environments/environment'; diff --git a/src/styles.css b/src/styles.css index 90d4ee0..5f69d4f 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1 +1,2 @@ /* You can add global styles to this file, and also import other style files */ +@import "~@angular/material/prebuilt-themes/indigo-pink.css";