From f1768cb25a89eda98370680d2376cb63b0d3407f Mon Sep 17 00:00:00 2001 From: Madeline Helmstadter Date: Tue, 31 Oct 2017 18:16:12 -0400 Subject: [PATCH 1/4] added and incorporated basic presentation components --- src/app/app.component.html | 8 ++---- src/app/app.module.ts | 11 ++++++-- src/app/common/common.module.ts | 11 +++++--- .../basic-button/basic-button.component.html | 1 + .../basic-button/basic-button.component.scss | 0 .../basic-button.component.spec.ts | 25 +++++++++++++++++++ .../basic-button/basic-button.component.ts | 17 +++++++++++++ .../check-box/check-box.component.html | 4 +-- .../check-box/check-box.component.ts | 2 ++ .../raised-button.component.html | 1 + .../raised-button.component.scss | 0 .../raised-button.component.spec.ts | 25 +++++++++++++++++++ .../raised-button/raised-button.component.ts | 17 +++++++++++++ .../text-box/text-box.component.html | 6 ++++- .../text-box/text-box.component.ts | 4 +-- .../toolbar/toolbar.component.html | 3 +++ .../toolbar/toolbar.component.scss | 0 .../toolbar/toolbar.component.spec.ts | 25 +++++++++++++++++++ .../presentation/toolbar/toolbar.component.ts | 17 +++++++++++++ .../smart/login/login.component.html | 13 ++++++---- .../smart/login/login.component.scss | 1 + src/index.html | 1 + 22 files changed, 168 insertions(+), 24 deletions(-) create mode 100644 src/app/common/components/presentation/basic-button/basic-button.component.html create mode 100644 src/app/common/components/presentation/basic-button/basic-button.component.scss create mode 100644 src/app/common/components/presentation/basic-button/basic-button.component.spec.ts create mode 100644 src/app/common/components/presentation/basic-button/basic-button.component.ts create mode 100644 src/app/common/components/presentation/raised-button/raised-button.component.html create mode 100644 src/app/common/components/presentation/raised-button/raised-button.component.scss create mode 100644 src/app/common/components/presentation/raised-button/raised-button.component.spec.ts create mode 100644 src/app/common/components/presentation/raised-button/raised-button.component.ts create mode 100644 src/app/common/components/presentation/toolbar/toolbar.component.html create mode 100644 src/app/common/components/presentation/toolbar/toolbar.component.scss create mode 100644 src/app/common/components/presentation/toolbar/toolbar.component.spec.ts create mode 100644 src/app/common/components/presentation/toolbar/toolbar.component.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index f9c41fa..cb139f7 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,8 +1,4 @@ - +
-

- {{title}}!! -

-
- + \ No newline at end of file diff --git a/src/app/app.module.ts b/src/app/app.module.ts index cb77428..0e86102 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,7 +5,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { FeCommonModule } from './common/common.module'; import { AppComponent } from './app.component'; -import { MatButtonModule, MatCheckboxModule} from '@angular/material'; +import { MatToolbarModule} from '@angular/material'; @NgModule({ declarations: [ @@ -14,7 +14,14 @@ import { MatButtonModule, MatCheckboxModule} from '@angular/material'; imports: [ BrowserModule, BrowserAnimationsModule, - FeCommonModule + FeCommonModule, + MatToolbarModule + ], + exports: [ + BrowserModule, + BrowserAnimationsModule, + FeCommonModule, + MatToolbarModule ], providers: [], bootstrap: [AppComponent] diff --git a/src/app/common/common.module.ts b/src/app/common/common.module.ts index aea001f..e2ad54a 100644 --- a/src/app/common/common.module.ts +++ b/src/app/common/common.module.ts @@ -3,13 +3,16 @@ import { CommonModule } from '@angular/common'; import { TextBoxComponent } from './components/presentation/text-box/text-box.component'; import { LoginComponent } from './components/smart/login/login.component'; import { CheckBoxComponent } from './components/presentation/check-box/check-box.component'; +import { ToolbarComponent } from './components/presentation/toolbar/toolbar.component'; +import { RaisedButtonComponent } from './components/presentation/raised-button/raised-button.component'; +import { BasicButtonComponent } from './components/presentation/basic-button/basic-button.component'; +import { MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatIconModule} from '@angular/material'; @NgModule({ imports: [ - CommonModule + CommonModule, MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatIconModule ], - declarations: [TextBoxComponent, LoginComponent, CheckBoxComponent], - exports: [ - LoginComponent, TextBoxComponent, CheckBoxComponent] + declarations: [TextBoxComponent, LoginComponent, CheckBoxComponent, ToolbarComponent, RaisedButtonComponent, BasicButtonComponent], + exports: [LoginComponent, TextBoxComponent, CheckBoxComponent, ToolbarComponent, RaisedButtonComponent, MatFormFieldModule], }) export class FeCommonModule { } diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.html b/src/app/common/components/presentation/basic-button/basic-button.component.html new file mode 100644 index 0000000..68b77c7 --- /dev/null +++ b/src/app/common/components/presentation/basic-button/basic-button.component.html @@ -0,0 +1 @@ + diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.scss b/src/app/common/components/presentation/basic-button/basic-button.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.spec.ts b/src/app/common/components/presentation/basic-button/basic-button.component.spec.ts new file mode 100644 index 0000000..f0e01fc --- /dev/null +++ b/src/app/common/components/presentation/basic-button/basic-button.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { BasicButtonComponent } from './basic-button.component'; + +describe('BasicButtonComponent', () => { + let component: BasicButtonComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ BasicButtonComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(BasicButtonComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.ts b/src/app/common/components/presentation/basic-button/basic-button.component.ts new file mode 100644 index 0000000..077492b --- /dev/null +++ b/src/app/common/components/presentation/basic-button/basic-button.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-basic-button', + templateUrl: './basic-button.component.html', + styleUrls: ['./basic-button.component.scss'] +}) +export class BasicButtonComponent implements OnInit { + + label = 'Register' + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/common/components/presentation/check-box/check-box.component.html b/src/app/common/components/presentation/check-box/check-box.component.html index 88744b2..00ae1fc 100644 --- a/src/app/common/components/presentation/check-box/check-box.component.html +++ b/src/app/common/components/presentation/check-box/check-box.component.html @@ -1,3 +1 @@ -

- DRIVER-CHECKBOX -

+{{label}} diff --git a/src/app/common/components/presentation/check-box/check-box.component.ts b/src/app/common/components/presentation/check-box/check-box.component.ts index 775dd54..7f6fd81 100644 --- a/src/app/common/components/presentation/check-box/check-box.component.ts +++ b/src/app/common/components/presentation/check-box/check-box.component.ts @@ -7,6 +7,8 @@ import { Component, OnInit } from '@angular/core'; }) export class CheckBoxComponent implements OnInit { + label = 'Remember my credentials' + constructor() { } ngOnInit() { diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.html b/src/app/common/components/presentation/raised-button/raised-button.component.html new file mode 100644 index 0000000..e28cacd --- /dev/null +++ b/src/app/common/components/presentation/raised-button/raised-button.component.html @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.scss b/src/app/common/components/presentation/raised-button/raised-button.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.spec.ts b/src/app/common/components/presentation/raised-button/raised-button.component.spec.ts new file mode 100644 index 0000000..ab4dfdb --- /dev/null +++ b/src/app/common/components/presentation/raised-button/raised-button.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { RaisedButtonComponent } from './raised-button.component'; + +describe('RaisedButtonComponent', () => { + let component: RaisedButtonComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ RaisedButtonComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(RaisedButtonComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.ts b/src/app/common/components/presentation/raised-button/raised-button.component.ts new file mode 100644 index 0000000..f62f136 --- /dev/null +++ b/src/app/common/components/presentation/raised-button/raised-button.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-raised-button', + templateUrl: './raised-button.component.html', + styleUrls: ['./raised-button.component.scss'] +}) +export class RaisedButtonComponent implements OnInit { + + label = 'Sign In' + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/common/components/presentation/text-box/text-box.component.html b/src/app/common/components/presentation/text-box/text-box.component.html index 73b7c6e..019d119 100644 --- a/src/app/common/components/presentation/text-box/text-box.component.html +++ b/src/app/common/components/presentation/text-box/text-box.component.html @@ -1 +1,5 @@ - +
+ + + +
diff --git a/src/app/common/components/presentation/text-box/text-box.component.ts b/src/app/common/components/presentation/text-box/text-box.component.ts index 2787aab..acefd89 100644 --- a/src/app/common/components/presentation/text-box/text-box.component.ts +++ b/src/app/common/components/presentation/text-box/text-box.component.ts @@ -11,8 +11,6 @@ export class TextBoxComponent implements OnInit { private value: string constructor() { } - ngOnInit() { - this.value = 'hello' - } + ngOnInit() {} } diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.html b/src/app/common/components/presentation/toolbar/toolbar.component.html new file mode 100644 index 0000000..aaaa78a --- /dev/null +++ b/src/app/common/components/presentation/toolbar/toolbar.component.html @@ -0,0 +1,3 @@ + + {{title}} + \ No newline at end of file diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.scss b/src/app/common/components/presentation/toolbar/toolbar.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.spec.ts b/src/app/common/components/presentation/toolbar/toolbar.component.spec.ts new file mode 100644 index 0000000..c71bb5a --- /dev/null +++ b/src/app/common/components/presentation/toolbar/toolbar.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ToolbarComponent } from './toolbar.component'; + +describe('ToolbarComponent', () => { + let component: ToolbarComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ToolbarComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ToolbarComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should be created', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.ts b/src/app/common/components/presentation/toolbar/toolbar.component.ts new file mode 100644 index 0000000..c2e690c --- /dev/null +++ b/src/app/common/components/presentation/toolbar/toolbar.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-toolbar', + templateUrl: './toolbar.component.html', + styleUrls: ['./toolbar.component.scss'] +}) +export class ToolbarComponent implements OnInit { + + title = 'UltiCar' + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/common/components/smart/login/login.component.html b/src/app/common/components/smart/login/login.component.html index 8227ee5..b933cc0 100644 --- a/src/app/common/components/smart/login/login.component.html +++ b/src/app/common/components/smart/login/login.component.html @@ -1,5 +1,8 @@ -
-
- - - +
+
+home + + +
+ + \ No newline at end of file diff --git a/src/app/common/components/smart/login/login.component.scss b/src/app/common/components/smart/login/login.component.scss index e69de29..e090c0a 100644 --- a/src/app/common/components/smart/login/login.component.scss +++ b/src/app/common/components/smart/login/login.component.scss @@ -0,0 +1 @@ +.mat-icon { font-size: 48px} \ No newline at end of file diff --git a/src/index.html b/src/index.html index 2f99d19..5eddda7 100644 --- a/src/index.html +++ b/src/index.html @@ -8,6 +8,7 @@ + From 719457337ca4c4a74101bfa98b2c80f1aa986894 Mon Sep 17 00:00:00 2001 From: Madeline Helmstadter Date: Tue, 7 Nov 2017 16:47:19 -0500 Subject: [PATCH 2/4] CreateLoginScreen- added to overall login screen UI --- src/app/app.component.html | 18 ++++-- src/app/app.component.scss | 6 ++ src/app/app.component.spec.ts | 32 ---------- src/app/app.component.ts | 2 +- src/app/app.module.ts | 18 +++--- src/app/common/common.module.ts | 10 ++-- .../basic-button/basic-button.component.html | 2 +- .../basic-button.component.spec.ts | 25 -------- .../basic-button/basic-button.component.ts | 11 +++- .../check-box/check-box.component.html | 2 +- .../check-box/check-box.component.spec.ts | 25 -------- .../check-box/check-box.component.ts | 5 +- .../icon-button/icon-button.component.html | 3 + .../icon-button/icon-button.component.scss | 0 .../icon-button/icon-button.component.ts | 17 ++++++ .../raised-button.component.html | 2 +- .../raised-button.component.spec.ts | 25 -------- .../raised-button/raised-button.component.ts | 17 ++++-- .../sidebar/sidebar.component.html | 17 ++++++ .../sidebar/sidebar.component.scss | 16 +++++ .../presentation/sidebar/sidebar.component.ts | 15 +++++ .../text-box/text-box.component.html | 12 ++-- .../text-box/text-box.component.spec.ts | 25 -------- .../text-box/text-box.component.ts | 8 ++- .../toolbar/toolbar.component.html | 3 +- .../toolbar/toolbar.component.scss | 11 ++++ .../toolbar/toolbar.component.spec.ts | 25 -------- .../presentation/toolbar/toolbar.component.ts | 4 +- .../smart/login/login.component.html | 23 +++++--- .../smart/login/login.component.scss | 18 +++++- .../smart/login/login.component.spec.ts | 25 -------- .../components/smart/login/login.component.ts | 17 +++--- src/app/common/models/user.ts | 0 src/index.html | 1 - src/styles.scss | 58 ++++++++++++++++--- 35 files changed, 250 insertions(+), 248 deletions(-) delete mode 100644 src/app/app.component.spec.ts delete mode 100644 src/app/common/components/presentation/basic-button/basic-button.component.spec.ts delete mode 100644 src/app/common/components/presentation/check-box/check-box.component.spec.ts create mode 100644 src/app/common/components/presentation/icon-button/icon-button.component.html create mode 100644 src/app/common/components/presentation/icon-button/icon-button.component.scss create mode 100644 src/app/common/components/presentation/icon-button/icon-button.component.ts delete mode 100644 src/app/common/components/presentation/raised-button/raised-button.component.spec.ts create mode 100644 src/app/common/components/presentation/sidebar/sidebar.component.html create mode 100644 src/app/common/components/presentation/sidebar/sidebar.component.scss create mode 100644 src/app/common/components/presentation/sidebar/sidebar.component.ts delete mode 100644 src/app/common/components/presentation/text-box/text-box.component.spec.ts delete mode 100644 src/app/common/components/presentation/toolbar/toolbar.component.spec.ts delete mode 100644 src/app/common/components/smart/login/login.component.spec.ts create mode 100644 src/app/common/models/user.ts diff --git a/src/app/app.component.html b/src/app/app.component.html index cb139f7..b3df466 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,4 +1,14 @@ - -
- -
\ No newline at end of file +
+ +
+
+ Register + Sign In +
+
+
+ +
+
+
+ \ No newline at end of file diff --git a/src/app/app.component.scss b/src/app/app.component.scss index e69de29..c5af2bc 100644 --- a/src/app/app.component.scss +++ b/src/app/app.component.scss @@ -0,0 +1,6 @@ +.page { + background-color: rgb(31, 95, 121); +} +.main { + text-align: center; +} diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts deleted file mode 100644 index 7d2799c..0000000 --- a/src/app/app.component.spec.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { TestBed, async } from '@angular/core/testing'; - -import { AppComponent } from './app.component'; - -describe('AppComponent', () => { - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ - AppComponent - ], - }).compileComponents(); - })); - - it('should create the app', async(() => { - const fixture = TestBed.createComponent(AppComponent); - const app = fixture.debugElement.componentInstance; - expect(app).toBeTruthy(); - })); - - it(`should have as title 'app'`, async(() => { - const fixture = TestBed.createComponent(AppComponent); - const app = fixture.debugElement.componentInstance; - expect(app.title).toEqual('app'); - })); - - it('should render title in a h1 tag', async(() => { - const fixture = TestBed.createComponent(AppComponent); - fixture.detectChanges(); - const compiled = fixture.debugElement.nativeElement; - expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!!'); - })); -}); diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 45af001..da40707 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.scss'] }) export class AppComponent { - title = 'Lit'; + title = 'UltiCar'; } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 0e86102..b732590 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,11 +1,16 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; - +import { Routes, RouterModule } from '@angular/router'; import { FeCommonModule } from './common/common.module'; import { AppComponent } from './app.component'; +import { LoginComponent } from 'app/common/components/smart/login/login.component'; -import { MatToolbarModule} from '@angular/material'; +const routes:Routes = [ + {path: '', redirectTo: 'login', pathMatch: 'full'}, + {path: 'login', component: LoginComponent}, + {path: 'dashboard', component: LoginComponent} +] @NgModule({ declarations: [ @@ -15,15 +20,8 @@ import { MatToolbarModule} from '@angular/material'; BrowserModule, BrowserAnimationsModule, FeCommonModule, - MatToolbarModule - ], - exports: [ - BrowserModule, - BrowserAnimationsModule, - FeCommonModule, - MatToolbarModule + RouterModule.forRoot(routes) ], - providers: [], bootstrap: [AppComponent] }) export class AppModule { } diff --git a/src/app/common/common.module.ts b/src/app/common/common.module.ts index e2ad54a..2e1caee 100644 --- a/src/app/common/common.module.ts +++ b/src/app/common/common.module.ts @@ -6,13 +6,15 @@ import { CheckBoxComponent } from './components/presentation/check-box/check-box import { ToolbarComponent } from './components/presentation/toolbar/toolbar.component'; import { RaisedButtonComponent } from './components/presentation/raised-button/raised-button.component'; import { BasicButtonComponent } from './components/presentation/basic-button/basic-button.component'; -import { MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatIconModule} from '@angular/material'; +import { IconButtonComponent } from './components/presentation/icon-button/icon-button.component'; +import { MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatFormFieldControl, MatInputModule, MatIconModule, MatCardModule } from '@angular/material'; @NgModule({ imports: [ - CommonModule, MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatIconModule + CommonModule, MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatIconModule, MatCardModule ], - declarations: [TextBoxComponent, LoginComponent, CheckBoxComponent, ToolbarComponent, RaisedButtonComponent, BasicButtonComponent], - exports: [LoginComponent, TextBoxComponent, CheckBoxComponent, ToolbarComponent, RaisedButtonComponent, MatFormFieldModule], + declarations: [TextBoxComponent, LoginComponent, CheckBoxComponent, ToolbarComponent, RaisedButtonComponent, BasicButtonComponent, IconButtonComponent], + exports: [ToolbarComponent], }) + export class FeCommonModule { } diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.html b/src/app/common/components/presentation/basic-button/basic-button.component.html index 68b77c7..396e078 100644 --- a/src/app/common/components/presentation/basic-button/basic-button.component.html +++ b/src/app/common/components/presentation/basic-button/basic-button.component.html @@ -1 +1 @@ - + diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.spec.ts b/src/app/common/components/presentation/basic-button/basic-button.component.spec.ts deleted file mode 100644 index f0e01fc..0000000 --- a/src/app/common/components/presentation/basic-button/basic-button.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { BasicButtonComponent } from './basic-button.component'; - -describe('BasicButtonComponent', () => { - let component: BasicButtonComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ BasicButtonComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(BasicButtonComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should be created', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.ts b/src/app/common/components/presentation/basic-button/basic-button.component.ts index 077492b..5b6c30e 100644 --- a/src/app/common/components/presentation/basic-button/basic-button.component.ts +++ b/src/app/common/components/presentation/basic-button/basic-button.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; @Component({ selector: 'app-basic-button', @@ -7,11 +7,18 @@ import { Component, OnInit } from '@angular/core'; }) export class BasicButtonComponent implements OnInit { - label = 'Register' + @Input() private label:string + @Input() private color:string + @Output() public clickEvent:EventEmitter = new EventEmitter(); + constructor() { } ngOnInit() { } + click(event) { + this.clickEvent.emit(event); + } + } diff --git a/src/app/common/components/presentation/check-box/check-box.component.html b/src/app/common/components/presentation/check-box/check-box.component.html index 00ae1fc..d758a6f 100644 --- a/src/app/common/components/presentation/check-box/check-box.component.html +++ b/src/app/common/components/presentation/check-box/check-box.component.html @@ -1 +1 @@ -{{label}} +{{label}} diff --git a/src/app/common/components/presentation/check-box/check-box.component.spec.ts b/src/app/common/components/presentation/check-box/check-box.component.spec.ts deleted file mode 100644 index 7917295..0000000 --- a/src/app/common/components/presentation/check-box/check-box.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { CheckBoxComponent } from './check-box.component'; - -describe('CheckBoxComponent', () => { - let component: CheckBoxComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ CheckBoxComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(CheckBoxComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should be created', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/common/components/presentation/check-box/check-box.component.ts b/src/app/common/components/presentation/check-box/check-box.component.ts index 7f6fd81..4e9aec5 100644 --- a/src/app/common/components/presentation/check-box/check-box.component.ts +++ b/src/app/common/components/presentation/check-box/check-box.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Input } from '@angular/core'; @Component({ selector: 'app-check-box', @@ -7,7 +7,8 @@ import { Component, OnInit } from '@angular/core'; }) export class CheckBoxComponent implements OnInit { - label = 'Remember my credentials' + @Input() private label: string + @Input() private color: string constructor() { } diff --git a/src/app/common/components/presentation/icon-button/icon-button.component.html b/src/app/common/components/presentation/icon-button/icon-button.component.html new file mode 100644 index 0000000..525a80b --- /dev/null +++ b/src/app/common/components/presentation/icon-button/icon-button.component.html @@ -0,0 +1,3 @@ + diff --git a/src/app/common/components/presentation/icon-button/icon-button.component.scss b/src/app/common/components/presentation/icon-button/icon-button.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/common/components/presentation/icon-button/icon-button.component.ts b/src/app/common/components/presentation/icon-button/icon-button.component.ts new file mode 100644 index 0000000..b1ea1e0 --- /dev/null +++ b/src/app/common/components/presentation/icon-button/icon-button.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit, Input } from '@angular/core'; + +@Component({ + selector: 'app-icon-button', + templateUrl: './icon-button.component.html', + styleUrls: ['./icon-button.component.scss'] +}) +export class IconButtonComponent implements OnInit { + + @Input() private icon:string; + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.html b/src/app/common/components/presentation/raised-button/raised-button.component.html index e28cacd..76d7eba 100644 --- a/src/app/common/components/presentation/raised-button/raised-button.component.html +++ b/src/app/common/components/presentation/raised-button/raised-button.component.html @@ -1 +1 @@ - \ No newline at end of file + diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.spec.ts b/src/app/common/components/presentation/raised-button/raised-button.component.spec.ts deleted file mode 100644 index ab4dfdb..0000000 --- a/src/app/common/components/presentation/raised-button/raised-button.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { RaisedButtonComponent } from './raised-button.component'; - -describe('RaisedButtonComponent', () => { - let component: RaisedButtonComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ RaisedButtonComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(RaisedButtonComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should be created', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.ts b/src/app/common/components/presentation/raised-button/raised-button.component.ts index f62f136..bf16712 100644 --- a/src/app/common/components/presentation/raised-button/raised-button.component.ts +++ b/src/app/common/components/presentation/raised-button/raised-button.component.ts @@ -1,4 +1,5 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Input, Output, HostListener, EventEmitter } from '@angular/core'; +import { RouterModule, Routes} from '@angular/router'; @Component({ selector: 'app-raised-button', @@ -7,11 +8,19 @@ import { Component, OnInit } from '@angular/core'; }) export class RaisedButtonComponent implements OnInit { - label = 'Sign In' - - constructor() { } + @Input() private label:string + @Input() private color:string + @Input() private disabled:string + + @Output() public clickEvent:EventEmitter = new EventEmitter(); + + constructor() { } ngOnInit() { } + click(event) { + this.clickEvent.emit(event); + } + } diff --git a/src/app/common/components/presentation/sidebar/sidebar.component.html b/src/app/common/components/presentation/sidebar/sidebar.component.html new file mode 100644 index 0000000..25d0154 --- /dev/null +++ b/src/app/common/components/presentation/sidebar/sidebar.component.html @@ -0,0 +1,17 @@ + + + SidenavBasic + + + + work + + +
+ + home + + +
+ + diff --git a/src/app/common/components/presentation/sidebar/sidebar.component.scss b/src/app/common/components/presentation/sidebar/sidebar.component.scss new file mode 100644 index 0000000..432cae2 --- /dev/null +++ b/src/app/common/components/presentation/sidebar/sidebar.component.scss @@ -0,0 +1,16 @@ +.container { + width: 500px; + height: 300px; + border: 1px solid rgba(0, 0, 0, 0.5); +} + +.sidenav-content { + display: flex; + height: 100%; + align-items: center; + justify-content: center; +} + +.my-sidenav { + padding: 20px; +} diff --git a/src/app/common/components/presentation/sidebar/sidebar.component.ts b/src/app/common/components/presentation/sidebar/sidebar.component.ts new file mode 100644 index 0000000..60de369 --- /dev/null +++ b/src/app/common/components/presentation/sidebar/sidebar.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-sidebar', + templateUrl: './sidebar.component.html', + styleUrls: ['./sidebar.component.scss'] +}) +export class SidebarComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/common/components/presentation/text-box/text-box.component.html b/src/app/common/components/presentation/text-box/text-box.component.html index 019d119..3bd20c2 100644 --- a/src/app/common/components/presentation/text-box/text-box.component.html +++ b/src/app/common/components/presentation/text-box/text-box.component.html @@ -1,5 +1,7 @@ -
- - - -
+
+ + + {{hide ? 'lock_outline' : 'lock_open'}} + {{icon}} + +
diff --git a/src/app/common/components/presentation/text-box/text-box.component.spec.ts b/src/app/common/components/presentation/text-box/text-box.component.spec.ts deleted file mode 100644 index 153caf7..0000000 --- a/src/app/common/components/presentation/text-box/text-box.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { TextBoxComponent } from './text-box.component'; - -describe('TextBoxComponent', () => { - let component: TextBoxComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ TextBoxComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(TextBoxComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should be created', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/common/components/presentation/text-box/text-box.component.ts b/src/app/common/components/presentation/text-box/text-box.component.ts index acefd89..06adce2 100644 --- a/src/app/common/components/presentation/text-box/text-box.component.ts +++ b/src/app/common/components/presentation/text-box/text-box.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit, Input } from '@angular/core'; +import { FormControl, Validators } from '@angular/forms'; @Component({ selector: 'app-text-box', @@ -6,8 +7,11 @@ import { Component, OnInit, Input } from '@angular/core'; styleUrls: ['./text-box.component.scss'] }) export class TextBoxComponent implements OnInit { - @Input() private id: string - @Input() private placeholder: string + @Input() private id:string + @Input() private placeholder:string + @Input() private encryption:string + @Input() private icon:string + private value: string constructor() { } diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.html b/src/app/common/components/presentation/toolbar/toolbar.component.html index aaaa78a..64e62b9 100644 --- a/src/app/common/components/presentation/toolbar/toolbar.component.html +++ b/src/app/common/components/presentation/toolbar/toolbar.component.html @@ -1,3 +1,4 @@ + {{title}} - \ No newline at end of file + diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.scss b/src/app/common/components/presentation/toolbar/toolbar.component.scss index e69de29..e1a8b0c 100644 --- a/src/app/common/components/presentation/toolbar/toolbar.component.scss +++ b/src/app/common/components/presentation/toolbar/toolbar.component.scss @@ -0,0 +1,11 @@ +.my-sidenav { + padding: 10px; + background-color:#00BCD4; +} + +.sidenav-content { + display: flex; + height: 100%; + align-items: center; + justify-content: center; +} \ No newline at end of file diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.spec.ts b/src/app/common/components/presentation/toolbar/toolbar.component.spec.ts deleted file mode 100644 index c71bb5a..0000000 --- a/src/app/common/components/presentation/toolbar/toolbar.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { ToolbarComponent } from './toolbar.component'; - -describe('ToolbarComponent', () => { - let component: ToolbarComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ ToolbarComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(ToolbarComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should be created', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.ts b/src/app/common/components/presentation/toolbar/toolbar.component.ts index c2e690c..32cad24 100644 --- a/src/app/common/components/presentation/toolbar/toolbar.component.ts +++ b/src/app/common/components/presentation/toolbar/toolbar.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Input } from '@angular/core'; @Component({ selector: 'app-toolbar', @@ -7,7 +7,7 @@ import { Component, OnInit } from '@angular/core'; }) export class ToolbarComponent implements OnInit { - title = 'UltiCar' + @Input() private title:string constructor() { } diff --git a/src/app/common/components/smart/login/login.component.html b/src/app/common/components/smart/login/login.component.html index b933cc0..e16c4ef 100644 --- a/src/app/common/components/smart/login/login.component.html +++ b/src/app/common/components/smart/login/login.component.html @@ -1,8 +1,15 @@ -
-
-home - - -
- - \ No newline at end of file +
+ + directions_car +

UltiCar

+
+ +
+ +
+
+ + +
+ +
diff --git a/src/app/common/components/smart/login/login.component.scss b/src/app/common/components/smart/login/login.component.scss index e090c0a..ccd93d4 100644 --- a/src/app/common/components/smart/login/login.component.scss +++ b/src/app/common/components/smart/login/login.component.scss @@ -1 +1,17 @@ -.mat-icon { font-size: 48px} \ No newline at end of file +.mat-icon { + font-size: 48px; + margin-left: -24px; +} +.mat-card-all { + padding-top: 10%; + padding-left: 10%; + padding-right: 10%; +} + +.mat-card-buttons { + padding-bottom: 5%; +} + +.mat-card-contents { + padding-bottom: 5%; +} diff --git a/src/app/common/components/smart/login/login.component.spec.ts b/src/app/common/components/smart/login/login.component.spec.ts deleted file mode 100644 index b9b2bc1..0000000 --- a/src/app/common/components/smart/login/login.component.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { async, ComponentFixture, TestBed } from '@angular/core/testing'; - -import { LoginComponent } from './login.component'; - -describe('LoginComponent', () => { - let component: LoginComponent; - let fixture: ComponentFixture; - - beforeEach(async(() => { - TestBed.configureTestingModule({ - declarations: [ LoginComponent ] - }) - .compileComponents(); - })); - - beforeEach(() => { - fixture = TestBed.createComponent(LoginComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should be created', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/common/components/smart/login/login.component.ts b/src/app/common/components/smart/login/login.component.ts index 54c3e51..8336597 100644 --- a/src/app/common/components/smart/login/login.component.ts +++ b/src/app/common/components/smart/login/login.component.ts @@ -1,4 +1,5 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, Input } from '@angular/core'; +import { Routes, RouterModule, Router } from '@angular/router'; @Component({ selector: 'app-login', @@ -7,17 +8,19 @@ import { Component, OnInit } from '@angular/core'; }) export class LoginComponent implements OnInit { - constructor() { } + constructor(private router: Router) { } + + @Input() private disabled:string ngOnInit() { } - loginUser(user, pass) { - console.log('clicked login'); + signIn(event) { + console.log("Signed in: " + event); } - registerUser() { - console.log('clicked register'); + register(event) { + console.log("Registered: " + event); } - + } diff --git a/src/app/common/models/user.ts b/src/app/common/models/user.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/index.html b/src/index.html index 5eddda7..2f99d19 100644 --- a/src/index.html +++ b/src/index.html @@ -8,7 +8,6 @@ - diff --git a/src/styles.scss b/src/styles.scss index e143f1b..d4aa986 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -1,9 +1,49 @@ -/* You can add global styles to this file, and also import other style files */ -@import './sass/variables.scss'; -@import "~@angular/material/prebuilt-themes/indigo-pink.css"; - -.ride-sharing-fe { - p, h1 { - color:$red; - } -} \ No newline at end of file +@import '~@angular/material/theming'; + +@include mat-core(); + +$my-theme-primary: mat-palette($mat-cyan); +$my-theme-accent: mat-palette($mat-teal); +$my-theme-warn: mat-palette($mat-red); + +$mat-light-theme-background: ( + status-bar: map_get($mat-grey, 300), + app-bar: map_get($mat-grey, 100), + background: map_get($mat-grey, 100), + hover: rgba(black, 0.04), + card: white, + dialog: white, + disabled-button: $black-12-opacity, + raised-button: white, + focused-button: $black-6-opacity, + selected-button: map_get($mat-grey, 300), + selected-disabled-button: map_get($mat-grey, 400), + disabled-button-toggle: map_get($mat-grey, 200), + unselected-chip: map_get($mat-grey, 300), + disabled-list-option: map_get($mat-grey, 200), + ); + + $mat-light-theme-foreground: ( + base: black, + divider: $black-12-opacity, + dividers: $black-12-opacity, + disabled: rgba(black, 0.38), + disabled-button: rgba(black, 0.38), + disabled-text: rgba(black, 0.38), + hint-text: rgba(black, 0.38), + secondary-text: rgba(black, 0.54), + icon: rgba(black, 0.54), + icons: rgba(black, 0.54), + text: rgba(black, 0.87), + slider-min: rgba(black, 0.87), + slider-off: rgba(black, 0.26), + slider-off-active: rgba(black, 0.38), + ); + +$my-theme: mat-light-theme( + $my-theme-primary, + $my-theme-accent, + $my-theme-warn +); + +@include angular-material-theme($my-theme); From 5cd5366ffb76e8765f21994a49c0063582d5ba06 Mon Sep 17 00:00:00 2001 From: Madeline Helmstadter Date: Thu, 9 Nov 2017 15:05:30 -0500 Subject: [PATCH 3/4] CreateLoginScreen- added models/eventemitters to components, modified UI --- src/app/common/common.module.ts | 3 ++- .../basic-button/basic-button.component.scss | 3 +++ .../check-box/check-box.component.html | 2 +- .../check-box/check-box.component.ts | 11 ++++++++++- .../icon-button/icon-button.component.html | 2 +- .../icon-button/icon-button.component.ts | 8 +++++++- .../raised-button/raised-button.component.scss | 3 +++ .../presentation/sidebar/sidebar.component.html | 17 ----------------- .../presentation/sidebar/sidebar.component.scss | 16 ---------------- .../presentation/sidebar/sidebar.component.ts | 15 --------------- .../text-box/text-box.component.html | 4 ++-- .../presentation/text-box/text-box.component.ts | 10 ++++++++-- .../presentation/toolbar/toolbar.component.html | 2 +- .../presentation/toolbar/toolbar.component.ts | 4 ++++ .../components/smart/login/login.component.html | 16 +++++++++------- .../components/smart/login/login.component.scss | 6 +++--- .../smart/login/login.component.spec.ts | 12 ++++++++++++ .../components/smart/login/login.component.ts | 14 +++++++++++++- 18 files changed, 79 insertions(+), 69 deletions(-) delete mode 100644 src/app/common/components/presentation/sidebar/sidebar.component.html delete mode 100644 src/app/common/components/presentation/sidebar/sidebar.component.scss delete mode 100644 src/app/common/components/presentation/sidebar/sidebar.component.ts create mode 100644 src/app/common/components/smart/login/login.component.spec.ts diff --git a/src/app/common/common.module.ts b/src/app/common/common.module.ts index 2e1caee..413b039 100644 --- a/src/app/common/common.module.ts +++ b/src/app/common/common.module.ts @@ -1,5 +1,6 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; +import { FormsModule } from '@angular/forms'; import { TextBoxComponent } from './components/presentation/text-box/text-box.component'; import { LoginComponent } from './components/smart/login/login.component'; import { CheckBoxComponent } from './components/presentation/check-box/check-box.component'; @@ -11,7 +12,7 @@ import { MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModul @NgModule({ imports: [ - CommonModule, MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatIconModule, MatCardModule + CommonModule, MatToolbarModule, MatCheckboxModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatIconModule, MatCardModule, FormsModule ], declarations: [TextBoxComponent, LoginComponent, CheckBoxComponent, ToolbarComponent, RaisedButtonComponent, BasicButtonComponent, IconButtonComponent], exports: [ToolbarComponent], diff --git a/src/app/common/components/presentation/basic-button/basic-button.component.scss b/src/app/common/components/presentation/basic-button/basic-button.component.scss index e69de29..1c67ae5 100644 --- a/src/app/common/components/presentation/basic-button/basic-button.component.scss +++ b/src/app/common/components/presentation/basic-button/basic-button.component.scss @@ -0,0 +1,3 @@ +.mat-button { + min-width: 200px; +} \ No newline at end of file diff --git a/src/app/common/components/presentation/check-box/check-box.component.html b/src/app/common/components/presentation/check-box/check-box.component.html index d758a6f..cda9f4b 100644 --- a/src/app/common/components/presentation/check-box/check-box.component.html +++ b/src/app/common/components/presentation/check-box/check-box.component.html @@ -1 +1 @@ -{{label}} +{{label}} \ No newline at end of file diff --git a/src/app/common/components/presentation/check-box/check-box.component.ts b/src/app/common/components/presentation/check-box/check-box.component.ts index 4e9aec5..1b8e179 100644 --- a/src/app/common/components/presentation/check-box/check-box.component.ts +++ b/src/app/common/components/presentation/check-box/check-box.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; @Component({ selector: 'app-check-box', @@ -9,10 +9,19 @@ export class CheckBoxComponent implements OnInit { @Input() private label: string @Input() private color: string + @Input() private checkboxValue:boolean + + @Output() checkboxChange:EventEmitter = new EventEmitter(); constructor() { } ngOnInit() { } + onChange(newValue) { + this.checkboxValue = newValue; + console.log("The checkbox value is: " + newValue); + this.checkboxChange.emit(newValue); + } + } diff --git a/src/app/common/components/presentation/icon-button/icon-button.component.html b/src/app/common/components/presentation/icon-button/icon-button.component.html index 525a80b..0733da4 100644 --- a/src/app/common/components/presentation/icon-button/icon-button.component.html +++ b/src/app/common/components/presentation/icon-button/icon-button.component.html @@ -1,3 +1,3 @@ diff --git a/src/app/common/components/presentation/icon-button/icon-button.component.ts b/src/app/common/components/presentation/icon-button/icon-button.component.ts index b1ea1e0..16eab48 100644 --- a/src/app/common/components/presentation/icon-button/icon-button.component.ts +++ b/src/app/common/components/presentation/icon-button/icon-button.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; @Component({ selector: 'app-icon-button', @@ -9,9 +9,15 @@ export class IconButtonComponent implements OnInit { @Input() private icon:string; + @Output() public clickEvent:EventEmitter = new EventEmitter(); + constructor() { } ngOnInit() { } + click($event) { + this.clickEvent.emit(event); + } + } diff --git a/src/app/common/components/presentation/raised-button/raised-button.component.scss b/src/app/common/components/presentation/raised-button/raised-button.component.scss index e69de29..722dc0f 100644 --- a/src/app/common/components/presentation/raised-button/raised-button.component.scss +++ b/src/app/common/components/presentation/raised-button/raised-button.component.scss @@ -0,0 +1,3 @@ +.mat-raised-button { + min-width: 200px; +} diff --git a/src/app/common/components/presentation/sidebar/sidebar.component.html b/src/app/common/components/presentation/sidebar/sidebar.component.html deleted file mode 100644 index 25d0154..0000000 --- a/src/app/common/components/presentation/sidebar/sidebar.component.html +++ /dev/null @@ -1,17 +0,0 @@ - - - SidenavBasic - - - - work - - -
- - home - - -
- - diff --git a/src/app/common/components/presentation/sidebar/sidebar.component.scss b/src/app/common/components/presentation/sidebar/sidebar.component.scss deleted file mode 100644 index 432cae2..0000000 --- a/src/app/common/components/presentation/sidebar/sidebar.component.scss +++ /dev/null @@ -1,16 +0,0 @@ -.container { - width: 500px; - height: 300px; - border: 1px solid rgba(0, 0, 0, 0.5); -} - -.sidenav-content { - display: flex; - height: 100%; - align-items: center; - justify-content: center; -} - -.my-sidenav { - padding: 20px; -} diff --git a/src/app/common/components/presentation/sidebar/sidebar.component.ts b/src/app/common/components/presentation/sidebar/sidebar.component.ts deleted file mode 100644 index 60de369..0000000 --- a/src/app/common/components/presentation/sidebar/sidebar.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-sidebar', - templateUrl: './sidebar.component.html', - styleUrls: ['./sidebar.component.scss'] -}) -export class SidebarComponent implements OnInit { - - constructor() { } - - ngOnInit() { - } - -} diff --git a/src/app/common/components/presentation/text-box/text-box.component.html b/src/app/common/components/presentation/text-box/text-box.component.html index 3bd20c2..1df5ad0 100644 --- a/src/app/common/components/presentation/text-box/text-box.component.html +++ b/src/app/common/components/presentation/text-box/text-box.component.html @@ -1,6 +1,6 @@
- - + + {{hide ? 'lock_outline' : 'lock_open'}} {{icon}} diff --git a/src/app/common/components/presentation/text-box/text-box.component.ts b/src/app/common/components/presentation/text-box/text-box.component.ts index 06adce2..0e7dd25 100644 --- a/src/app/common/components/presentation/text-box/text-box.component.ts +++ b/src/app/common/components/presentation/text-box/text-box.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; import { FormControl, Validators } from '@angular/forms'; @Component({ @@ -11,10 +11,16 @@ export class TextBoxComponent implements OnInit { @Input() private placeholder:string @Input() private encryption:string @Input() private icon:string + @Input() private textboxValue:string - private value: string + @Output() textboxChange:EventEmitter = new EventEmitter(); + constructor() { } ngOnInit() {} + + onChange(event) { + console.log(this.textboxValue); + } } diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.html b/src/app/common/components/presentation/toolbar/toolbar.component.html index 64e62b9..9f054bf 100644 --- a/src/app/common/components/presentation/toolbar/toolbar.component.html +++ b/src/app/common/components/presentation/toolbar/toolbar.component.html @@ -1,4 +1,4 @@ - + {{title}} diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.ts b/src/app/common/components/presentation/toolbar/toolbar.component.ts index 32cad24..9232b51 100644 --- a/src/app/common/components/presentation/toolbar/toolbar.component.ts +++ b/src/app/common/components/presentation/toolbar/toolbar.component.ts @@ -14,4 +14,8 @@ export class ToolbarComponent implements OnInit { ngOnInit() { } + goHome(event) { + console.log("Clicked home: " + event); + } + } diff --git a/src/app/common/components/smart/login/login.component.html b/src/app/common/components/smart/login/login.component.html index e16c4ef..e324e21 100644 --- a/src/app/common/components/smart/login/login.component.html +++ b/src/app/common/components/smart/login/login.component.html @@ -2,14 +2,16 @@ directions_car

UltiCar

-
- -
- +
+ +
+
-
- - + +
+
diff --git a/src/app/common/components/smart/login/login.component.scss b/src/app/common/components/smart/login/login.component.scss index ccd93d4..5d48667 100644 --- a/src/app/common/components/smart/login/login.component.scss +++ b/src/app/common/components/smart/login/login.component.scss @@ -8,10 +8,10 @@ padding-right: 10%; } -.mat-card-buttons { - padding-bottom: 5%; +.mat-card-sign-in { + padding-bottom: 5px; } -.mat-card-contents { +.mat-card-inputs { padding-bottom: 5%; } diff --git a/src/app/common/components/smart/login/login.component.spec.ts b/src/app/common/components/smart/login/login.component.spec.ts new file mode 100644 index 0000000..7e4c8aa --- /dev/null +++ b/src/app/common/components/smart/login/login.component.spec.ts @@ -0,0 +1,12 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { LoginComponent } from './login.component'; + +describe('LoginComponent', () => { + let component: LoginComponent; + let fixture: ComponentFixture; + + it('should be created', () => { + expect(true).toBeTruthy(); + }); +}); diff --git a/src/app/common/components/smart/login/login.component.ts b/src/app/common/components/smart/login/login.component.ts index 8336597..dacb1b5 100644 --- a/src/app/common/components/smart/login/login.component.ts +++ b/src/app/common/components/smart/login/login.component.ts @@ -22,5 +22,17 @@ export class LoginComponent implements OnInit { register(event) { console.log("Registered: " + event); } - + + rememberUser(event, checkboxValue) { + if(checkboxValue) { + console.log("Will remember."); + } else { + console.log("Will not remember.") + } + } + + rememberUserValue = true; + usernameValue = ""; + passwordValue = ""; + } From 090d7df01199ff1f1fe2880aad8205e26a1396b9 Mon Sep 17 00:00:00 2001 From: Madeline Helmstadter Date: Thu, 9 Nov 2017 15:09:23 -0500 Subject: [PATCH 4/4] CreateLoginScreen- just adding new lines --- .../components/presentation/check-box/check-box.component.html | 2 +- .../components/presentation/toolbar/toolbar.component.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/common/components/presentation/check-box/check-box.component.html b/src/app/common/components/presentation/check-box/check-box.component.html index cda9f4b..2f50f04 100644 --- a/src/app/common/components/presentation/check-box/check-box.component.html +++ b/src/app/common/components/presentation/check-box/check-box.component.html @@ -1 +1 @@ -{{label}} \ No newline at end of file +{{label}} diff --git a/src/app/common/components/presentation/toolbar/toolbar.component.scss b/src/app/common/components/presentation/toolbar/toolbar.component.scss index e1a8b0c..14d0275 100644 --- a/src/app/common/components/presentation/toolbar/toolbar.component.scss +++ b/src/app/common/components/presentation/toolbar/toolbar.component.scss @@ -8,4 +8,4 @@ height: 100%; align-items: center; justify-content: center; -} \ No newline at end of file +}