diff --git a/app.js b/app.js index 553dfea..b923e15 100644 --- a/app.js +++ b/app.js @@ -17,15 +17,25 @@ mongoose.connection.on('error', (err) => { } }); app.use(cors()); + app.set('views', path.join(__dirname,'views')); app.set('view engine', 'ejs'); app.engine('html', require('ejs').renderFile); + app.use(express.static(path.join(__dirname, 'client'))); + app.use(bodyparser.json()); + app.use(bodyparser.urlencoded({ extended: false })); + app.use('/', index); + app.listen(port, () => { console.log('server started at port: ' + port); }); +app.get('*',(req,res)=> +{ + res.sendFile(path.join(__dirname,'views/index.html')) +}); exports = module.exports = app; diff --git a/client.zip b/client.zip new file mode 100644 index 0000000..a12066f Binary files /dev/null and b/client.zip differ diff --git a/client/npm-debug.log b/client/npm-debug.log new file mode 100644 index 0000000..eec3cf6 --- /dev/null +++ b/client/npm-debug.log @@ -0,0 +1,45 @@ +0 info it worked if it ends with ok +1 verbose cli [ '/usr/bin/node', '/usr/bin/npm', 'start' ] +2 info using npm@3.5.2 +3 info using node@v8.10.0 +4 verbose run-script [ 'prestart', 'start', 'poststart' ] +5 info lifecycle client@0.0.0~prestart: client@0.0.0 +6 silly lifecycle client@0.0.0~prestart: no script for prestart, continuing +7 info lifecycle client@0.0.0~start: client@0.0.0 +8 verbose lifecycle client@0.0.0~start: unsafe-perm in lifecycle true +9 verbose lifecycle client@0.0.0~start: PATH: /usr/share/npm/bin/node-gyp-bin:/home/divya/MediCenter/client/node_modules/.bin:/home/divya/miniconda3/bin:/home/divya/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin +10 verbose lifecycle client@0.0.0~start: CWD: /home/divya/MediCenter/client +11 silly lifecycle client@0.0.0~start: Args: [ '-c', 'ng serve' ] +12 silly lifecycle client@0.0.0~start: Returned: code: 1 signal: null +13 info lifecycle client@0.0.0~start: Failed to exec start script +14 verbose stack Error: client@0.0.0 start: `ng serve` +14 verbose stack Exit status 1 +14 verbose stack at EventEmitter. (/usr/share/npm/lib/utils/lifecycle.js:232:16) +14 verbose stack at emitTwo (events.js:126:13) +14 verbose stack at EventEmitter.emit (events.js:214:7) +14 verbose stack at ChildProcess. (/usr/share/npm/lib/utils/spawn.js:24:14) +14 verbose stack at emitTwo (events.js:126:13) +14 verbose stack at ChildProcess.emit (events.js:214:7) +14 verbose stack at maybeClose (internal/child_process.js:925:16) +14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5) +15 verbose pkgid client@0.0.0 +16 verbose cwd /home/divya/MediCenter/client +17 error Linux 4.15.0-39-generic +18 error argv "/usr/bin/node" "/usr/bin/npm" "start" +19 error node v8.10.0 +20 error npm v3.5.2 +21 error code ELIFECYCLE +22 error client@0.0.0 start: `ng serve` +22 error Exit status 1 +23 error Failed at the client@0.0.0 start script 'ng serve'. +23 error Make sure you have the latest version of node.js and npm installed. +23 error If you do, this is most likely a problem with the client package, +23 error not with npm itself. +23 error Tell the author that this fails on your system: +23 error ng serve +23 error You can get information on how to open an issue for this project with: +23 error npm bugs client +23 error Or if that isn't available, you can get their info via: +23 error npm owner ls client +23 error There is likely additional logging output above. +24 verbose exit [ 1, true ] diff --git a/client/package.json b/client/package.json index 2c84af8..a555440 100644 --- a/client/package.json +++ b/client/package.json @@ -12,15 +12,18 @@ "private": true, "dependencies": { "@angular/animations": "~7.0.0", + "@angular/cdk": "~7.2.1", "@angular/common": "~7.0.0", "@angular/compiler": "~7.0.0", "@angular/core": "~7.0.0", "@angular/forms": "~7.0.0", "@angular/http": "~7.0.0", + "@angular/material": "~7.2.1", "@angular/platform-browser": "~7.0.0", "@angular/platform-browser-dynamic": "~7.0.0", "@angular/router": "~7.0.0", "core-js": "^2.5.4", + "hammerjs": "^2.0.8", "rxjs": "~6.3.3", "zone.js": "~0.8.26" }, @@ -45,4 +48,4 @@ "tslint": "~5.11.0", "typescript": "~3.1.6" } -} +} \ No newline at end of file diff --git a/client/src/app/app-routing.module.ts b/client/src/app/app-routing.module.ts index d425c6f..9626891 100644 --- a/client/src/app/app-routing.module.ts +++ b/client/src/app/app-routing.module.ts @@ -1,8 +1,18 @@ import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; - -const routes: Routes = []; - +import { MydashComponent } from './mydash/mydash.component'; +import { HomeComponent } from './home/home.component'; +import { SignupComponent } from './signup/signup.component'; +import { SigninComponent } from './signin/signin.component'; +import { ConsultComponent } from './consult/consult.component'; +const routes: Routes = [ + { path: '', redirectTo: '/home', pathMatch: 'full' }, + {path: 'dash', component: MydashComponent}, + {path: 'home', component: HomeComponent}, + {path: 'signup', component: SignupComponent}, + {path: 'consult', component: ConsultComponent}, + {path: 'signin', component: SigninComponent} +]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule] diff --git a/client/src/app/app.component.html b/client/src/app/app.component.html index 1094e7e..c5eaa0e 100644 --- a/client/src/app/app.component.html +++ b/client/src/app/app.component.html @@ -1,21 +1,10 @@ -
-

- Welcome to {{ title }}! -

- Angular Logo -
-

Here are some links to help you start:

- + - + + + + + diff --git a/client/src/app/app.component.scss b/client/src/app/app.component.scss index e69de29..2bc9d30 100644 --- a/client/src/app/app.component.scss +++ b/client/src/app/app.component.scss @@ -0,0 +1,3 @@ +.pt-64{ + padding-top: 64px; +} diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index 01ec8e2..3f196e3 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -1,5 +1,4 @@ import { Component } from '@angular/core'; - @Component({ selector: 'app-root', templateUrl: './app.component.html', diff --git a/client/src/app/app.module.ts b/client/src/app/app.module.ts index 2c3ba29..7fe1168 100644 --- a/client/src/app/app.module.ts +++ b/client/src/app/app.module.ts @@ -1,16 +1,45 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; - import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; - +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import {MatButtonModule} from '@angular/material/button'; +import { MynavComponent } from './mynav/mynav.component'; +import { LayoutModule } from '@angular/cdk/layout'; +import { MatToolbarModule, MatSidenavModule, MatIconModule, MatListModule, +MatGridListModule, MatCardModule, MatMenuModule, MatTableModule, MatPaginatorModule, MatSortModule } from '@angular/material'; +import { MydashComponent } from './mydash/mydash.component'; +import {MatSelectModule} from '@angular/material/select'; +import { HomeComponent } from './home/home.component'; +import { ConsultComponent } from './consult/consult.component'; +import { SignupComponent } from './signup/signup.component'; +import { SigninComponent } from './signin/signin.component'; @NgModule({ declarations: [ - AppComponent + AppComponent, + MynavComponent, + MydashComponent, + HomeComponent, + ConsultComponent, + SignupComponent, + SigninComponent ], imports: [ BrowserModule, - AppRoutingModule + AppRoutingModule, + BrowserAnimationsModule, + MatButtonModule, + MatSelectModule, + LayoutModule, + MatToolbarModule, + MatSidenavModule, + MatIconModule, + MatListModule, + MatGridListModule, + MatCardModule, MatMenuModule, + MatTableModule, + MatPaginatorModule, + MatSortModule ], providers: [], bootstrap: [AppComponent] diff --git a/client/src/app/consult/consult.component.html b/client/src/app/consult/consult.component.html new file mode 100644 index 0000000..9e29c70 --- /dev/null +++ b/client/src/app/consult/consult.component.html @@ -0,0 +1,19 @@ +
Consult a Doctor
+
+ + + + {{specialist.viewValue}} + + + +
+
+ + + + {{gender.viewValue}} + + + +
diff --git a/client/src/app/consult/consult.component.scss b/client/src/app/consult/consult.component.scss new file mode 100644 index 0000000..d612090 --- /dev/null +++ b/client/src/app/consult/consult.component.scss @@ -0,0 +1,19 @@ +.selector1 { + position: absolute; + left:5%; + top:20%; +} +.selector2 { + position: absolute; + left:5%; + top:30%; +} +.center { + position: absolute; + left: 0; + top: 12%; + width: 100%; + text-align: center; + font-size: 30px; + color: blue + } diff --git a/client/src/app/consult/consult.component.spec.ts b/client/src/app/consult/consult.component.spec.ts new file mode 100644 index 0000000..626a295 --- /dev/null +++ b/client/src/app/consult/consult.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ConsultComponent } from './consult.component'; + +describe('ConsultComponent', () => { + let component: ConsultComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ConsultComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ConsultComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/client/src/app/consult/consult.component.ts b/client/src/app/consult/consult.component.ts new file mode 100644 index 0000000..4d8f065 --- /dev/null +++ b/client/src/app/consult/consult.component.ts @@ -0,0 +1,25 @@ +import { Component} from '@angular/core'; +export interface Specialist { + value: string; + viewValue: string; +} +export interface Gender { + value: string; + viewValue: string; +} +@Component({ + selector: 'app-consult', + templateUrl: './consult.component.html', + styleUrls: ['./consult.component.scss'] +}) +export class ConsultComponent { + specialist: Specialist[] = [ + {value: '1', viewValue: 'Dermatologist'}, + {value: '2', viewValue: 'Physiotherapist'}, + {value: '3', viewValue: 'Gynaecologist'} + ]; + gender: Gender[] = [ + {value: 'F', viewValue: 'Female'}, + {value: 'M', viewValue: 'Male'} + ]; +} diff --git a/client/src/app/home/home.component.html b/client/src/app/home/home.component.html new file mode 100644 index 0000000..81f84bc --- /dev/null +++ b/client/src/app/home/home.component.html @@ -0,0 +1,18 @@ + + + + + + + + +
+
+

MEDICENTER

+ + +
+
+ + diff --git a/client/src/app/home/home.component.scss b/client/src/app/home/home.component.scss new file mode 100644 index 0000000..9bfcd05 --- /dev/null +++ b/client/src/app/home/home.component.scss @@ -0,0 +1,52 @@ +.center { + position: absolute; + top: 12%; + width: 100%; + text-align: center; + font-size: 40px; + color: black; + } +body { + margin: 0; + font-family: Arial, Helvetica, sans-serif; +} +.image { +/* background-image: url("https://images.pexels.com/photos/48604/pexels-photo-48604.jpeg?auto=compress&cs=tinysrgb&h=650&w=940"); */ +background-color: white; +height: 450px; +background-position: center; +background-repeat: no-repeat; +background-size: cover; +position: relative; +} +.hero-text { +text-align: center; +position: absolute; +top: 50%; +left: 50%; +transform: translate(-50%, -50%); +color: black; +} +button { + background-color: #4CAF50; + color: white; + padding: 14px 20px; + margin: 8px 0; + border: none; + cursor: pointer; + width: 100%; + opacity: 0.9; + } + + button:hover { + opacity:1; + } + .example-card { + max-width: 400px; + } + + .example-header-image { + background-image: url('https://material.angular.io/assets/img/examples/shiba1.jpg'); + background-size: cover; + } + \ No newline at end of file diff --git a/client/src/app/home/home.component.spec.ts b/client/src/app/home/home.component.spec.ts new file mode 100644 index 0000000..490e81b --- /dev/null +++ b/client/src/app/home/home.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { HomeComponent } from './home.component'; + +describe('HomeComponent', () => { + let component: HomeComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ HomeComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(HomeComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/client/src/app/home/home.component.ts b/client/src/app/home/home.component.ts new file mode 100644 index 0000000..ff5610d --- /dev/null +++ b/client/src/app/home/home.component.ts @@ -0,0 +1,9 @@ +import { Component} from '@angular/core'; +@Component({ + selector: 'app-home', + templateUrl: './home.component.html', + styleUrls: ['./home.component.scss'] +}) +export class HomeComponent { + +} diff --git a/client/src/app/mydash/mydash.component.html b/client/src/app/mydash/mydash.component.html new file mode 100644 index 0000000..df9e4bf --- /dev/null +++ b/client/src/app/mydash/mydash.component.html @@ -0,0 +1,24 @@ +
+

Dashboard

+ + + + + + {{card.title}} + + + + + + + + +
Card Content Here
+ + + + +
diff --git a/client/src/app/mydash/mydash.component.scss b/client/src/app/mydash/mydash.component.scss new file mode 100644 index 0000000..49a8146 --- /dev/null +++ b/client/src/app/mydash/mydash.component.scss @@ -0,0 +1,21 @@ +.grid-container { + margin: 20px; +} + +.dashboard-card { + position: absolute; + top: 15px; + left: 15px; + right: 15px; + bottom: 15px; +} + +.more-button { + position: absolute; + top: 5px; + right: 10px; +} + +.dashboard-card-content { + text-align: center; +} diff --git a/client/src/app/mydash/mydash.component.spec.ts b/client/src/app/mydash/mydash.component.spec.ts new file mode 100644 index 0000000..6223ef1 --- /dev/null +++ b/client/src/app/mydash/mydash.component.spec.ts @@ -0,0 +1,42 @@ +import { LayoutModule } from '@angular/cdk/layout'; +import { NoopAnimationsModule } from '@angular/platform-browser/animations'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { + MatButtonModule, + MatCardModule, + MatGridListModule, + MatIconModule, + MatMenuModule, +} from '@angular/material'; + +import { MydashComponent } from './mydash.component'; + +describe('MydashComponent', () => { + let component: MydashComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [MydashComponent], + imports: [ + NoopAnimationsModule, + LayoutModule, + MatButtonModule, + MatCardModule, + MatGridListModule, + MatIconModule, + MatMenuModule, + ] + }).compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(MydashComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should compile', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/client/src/app/mydash/mydash.component.ts b/client/src/app/mydash/mydash.component.ts new file mode 100644 index 0000000..626426d --- /dev/null +++ b/client/src/app/mydash/mydash.component.ts @@ -0,0 +1,33 @@ +import { Component } from '@angular/core'; +import { map } from 'rxjs/operators'; +import { Breakpoints, BreakpointObserver } from '@angular/cdk/layout'; + +@Component({ + selector: 'app-dash', + templateUrl: './mydash.component.html', + styleUrls: ['./mydash.component.scss'] +}) +export class MydashComponent { + /** Based on the screen size, switch from standard to one column per row */ + cards = this.breakpointObserver.observe(Breakpoints.Handset).pipe( + map(({ matches }) => { + if (matches) { + return [ + { title: 'Card 1', cols: 1, rows: 1 }, + { title: 'Card 2', cols: 1, rows: 1 }, + { title: 'Card 3', cols: 1, rows: 1 }, + { title: 'Card 4', cols: 1, rows: 1 } + ]; + } + + return [ + { title: 'Card 1', cols: 2, rows: 1 }, + { title: 'Card 2', cols: 1, rows: 1 }, + { title: 'Card 3', cols: 1, rows: 2 }, + { title: 'Card 4', cols: 1, rows: 1 } + ]; + }) + ); + + constructor(private breakpointObserver: BreakpointObserver) {} +} diff --git a/client/src/app/mynav/mynav.component.html b/client/src/app/mynav/mynav.component.html new file mode 100644 index 0000000..c6d138c --- /dev/null +++ b/client/src/app/mynav/mynav.component.html @@ -0,0 +1,30 @@ + + + Menu + + Dashboard + Home + Consult Doctor + + + + + + MediCenter + + + + + + + diff --git a/client/src/app/mynav/mynav.component.scss b/client/src/app/mynav/mynav.component.scss new file mode 100644 index 0000000..17d572f --- /dev/null +++ b/client/src/app/mynav/mynav.component.scss @@ -0,0 +1,18 @@ +.sidenav-container { + height: 100%; +} + +.sidenav { + width: 200px; +} + +.sidenav .mat-toolbar { + background: inherit; +} + +.mat-toolbar.mat-primary { + position: sticky; + top: 0; + z-index: 1; +} + diff --git a/client/src/app/mynav/mynav.component.spec.ts b/client/src/app/mynav/mynav.component.spec.ts new file mode 100644 index 0000000..4feb5b0 --- /dev/null +++ b/client/src/app/mynav/mynav.component.spec.ts @@ -0,0 +1,42 @@ +import { LayoutModule } from '@angular/cdk/layout'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { NoopAnimationsModule } from '@angular/platform-browser/animations'; +import { + MatButtonModule, + MatIconModule, + MatListModule, + MatSidenavModule, + MatToolbarModule, +} from '@angular/material'; + +import { MynavComponent } from './mynav.component'; + +describe('MynavComponent', () => { + let component: MynavComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [MynavComponent], + imports: [ + NoopAnimationsModule, + LayoutModule, + MatButtonModule, + MatIconModule, + MatListModule, + MatSidenavModule, + MatToolbarModule, + ] + }).compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(MynavComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should compile', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/client/src/app/mynav/mynav.component.ts b/client/src/app/mynav/mynav.component.ts new file mode 100644 index 0000000..c6764fc --- /dev/null +++ b/client/src/app/mynav/mynav.component.ts @@ -0,0 +1,20 @@ +import { Component } from '@angular/core'; +import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout'; +import { Observable } from 'rxjs'; +import { map } from 'rxjs/operators'; + +@Component({ + selector: 'my-nav', + templateUrl: './mynav.component.html', + styleUrls: ['./mynav.component.scss'] +}) +export class MynavComponent { + + isHandset$: Observable = this.breakpointObserver.observe(Breakpoints.Handset) + .pipe( + map(result => result.matches) + ); + + constructor(private breakpointObserver: BreakpointObserver) {} + +} diff --git a/client/src/app/signin/signin.component.html b/client/src/app/signin/signin.component.html new file mode 100644 index 0000000..2f58e08 --- /dev/null +++ b/client/src/app/signin/signin.component.html @@ -0,0 +1,19 @@ +
+
+ + + + + + + + +
+ +
+ + Forgot password? +
+
\ No newline at end of file diff --git a/client/src/app/signin/signin.component.scss b/client/src/app/signin/signin.component.scss new file mode 100644 index 0000000..69c7a8c --- /dev/null +++ b/client/src/app/signin/signin.component.scss @@ -0,0 +1,60 @@ +form { + border: 3px solid #f1f1f1; + + } + + /* Full-width inputs */ + input[type=text], input[type=password] { + width: 100%; + padding: 12px 20px; + margin: 8px 0; + display: inline-block; + border: 1px solid #ccc; + box-sizing: border-box; + } + + /* Set a style for all buttons */ + button { + background-color: #4CAF50; + color: white; + padding: 14px 20px; + margin: 8px 0; + border: none; + cursor: pointer; + width: 100%; + opacity: 0.9; + } + + /* Add a hover effect for buttons */ + button:hover { + opacity: 1; + } + + /* Extra style for the cancel button (red) */ + .cancelbtn { + width: auto; + padding: 10px 18px; + background-color: #f44336; + opacity: 0.9; + } + /* Add padding to containers */ + .container { + padding: 16px; + } + + /* The "Forgot password" text */ + span.psw { + float: right; + padding-top: 16px; + } + + /* Change styles for span and cancel button on extra small screens */ + @media screen and (max-width: 300px) { + span.psw { + display: block; + float: none; + } + .cancelbtn { + width: 100%; + } + } \ No newline at end of file diff --git a/client/src/app/signin/signin.component.spec.ts b/client/src/app/signin/signin.component.spec.ts new file mode 100644 index 0000000..c64b0b2 --- /dev/null +++ b/client/src/app/signin/signin.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SigninComponent } from './signin.component'; + +describe('SigninComponent', () => { + let component: SigninComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SigninComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SigninComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/client/src/app/signin/signin.component.ts b/client/src/app/signin/signin.component.ts new file mode 100644 index 0000000..5afe20f --- /dev/null +++ b/client/src/app/signin/signin.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-signin', + templateUrl: './signin.component.html', + styleUrls: ['./signin.component.scss'] +}) +export class SigninComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/client/src/app/signup/signup.component.html b/client/src/app/signup/signup.component.html new file mode 100644 index 0000000..8576e3f --- /dev/null +++ b/client/src/app/signup/signup.component.html @@ -0,0 +1,22 @@ +
+
+

Sign Up

+

Please fill in this form to create an account.

+
+ + + + + + + + + + + +
+ + +
+
+
\ No newline at end of file diff --git a/client/src/app/signup/signup.component.scss b/client/src/app/signup/signup.component.scss new file mode 100644 index 0000000..b5388ed --- /dev/null +++ b/client/src/app/signup/signup.component.scss @@ -0,0 +1,109 @@ +body {font-family: Arial, Helvetica, sans-serif;} +* {box-sizing: border-box;} + +/* Full-width input fields */ +input[type=text], input[type=password] { + width: 100%; + padding: 15px; + margin: 5px 0 22px 0; + display: inline-block; + border: none; + background: #f1f1f1; +} + +/* Add a background color when the inputs get focus */ +input[type=text]:focus, input[type=password]:focus { + background-color: #ddd; + outline: none; +} + +/* Set a style for all buttons */ +button { + background-color: #4CAF50; + color: white; + padding: 14px 20px; + margin: 8px 0; + border: none; + cursor: pointer; + width: 100%; + opacity: 0.9; +} + +button:hover { + opacity:1; +} + +/* Extra styles for the cancel button */ +.cancelbtn { + padding: 14px 20px; + background-color: #f44336; +} + +/* Float cancel and signup buttons and add an equal width */ +.cancelbtn, .signupbtn { + float: left; + width: 50%; +} + +/* Add padding to container elements */ +.container { + padding: 16px; +} + +/* The Modal (background) */ +.modal { + display: none; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 1; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color:black; + padding-top: 50px; +} + +/* Modal Content/Box */ +.modal-content { + background-color: #fefefe; + margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */ + border: 1px solid #888; + width: 80%; /* Could be more or less, depending on screen size */ +} + +/* Style the horizontal ruler */ +hr { + border: 1px solid #f1f1f1; + margin-bottom: 25px; +} + +/* The Close Button (x) */ +.close { + position: absolute; + right: 35px; + top: 15px; + font-size: 40px; + font-weight: bold; + color: #f1f1f1; +} + +.close:hover, +.close:focus { + color: #f44336; + cursor: pointer; +} + +/* Clear floats */ +.clearfix::after { + content: ""; + clear: both; + display: table; +} + +/* Change styles for cancel button and signup button on extra small screens */ +@media screen and (max-width: 300px) { + .cancelbtn, .signupbtn { + width: 100%; + } +} \ No newline at end of file diff --git a/client/src/app/signup/signup.component.spec.ts b/client/src/app/signup/signup.component.spec.ts new file mode 100644 index 0000000..43e46a5 --- /dev/null +++ b/client/src/app/signup/signup.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SignupComponent } from './signup.component'; + +describe('SignupComponent', () => { + let component: SignupComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SignupComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SignupComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/client/src/app/signup/signup.component.ts b/client/src/app/signup/signup.component.ts new file mode 100644 index 0000000..0843903 --- /dev/null +++ b/client/src/app/signup/signup.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-signup', + templateUrl: './signup.component.html', + styleUrls: ['./signup.component.scss'] +}) +export class SignupComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/client/src/image1.jpg b/client/src/image1.jpg new file mode 100644 index 0000000..17752db Binary files /dev/null and b/client/src/image1.jpg differ diff --git a/client/src/index.html b/client/src/index.html index 87d768a..49bdf59 100644 --- a/client/src/index.html +++ b/client/src/index.html @@ -7,8 +7,12 @@ + + - + + + diff --git a/client/src/main.ts b/client/src/main.ts index c7b673c..3b2b7d0 100644 --- a/client/src/main.ts +++ b/client/src/main.ts @@ -1,3 +1,4 @@ +import 'hammerjs'; import { enableProdMode } from '@angular/core'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; diff --git a/client/src/styles.scss b/client/src/styles.scss index 90d4ee0..74b013c 100644 --- a/client/src/styles.scss +++ b/client/src/styles.scss @@ -1 +1,32 @@ + +// Custom Theming for Angular Material +// For more information: https://material.angular.io/guide/theming +@import '~@angular/material/theming'; +// Plus imports for other components in your app. + +// Include the common styles for Angular Material. We include this here so that you only +// have to load a single css file for Angular Material in your app. +// Be sure that you only ever include this mixin once! +@include mat-core(); + +// Define the palettes for your theme using the Material Design palettes available in palette.scss +// (imported above). For each palette, you can optionally specify a default, lighter, and darker +// hue. Available color palettes: https://material.io/design/color/ +$client-primary: mat-palette($mat-indigo); +$client-accent: mat-palette($mat-pink, A200, A100, A400); + +// The warn palette is optional (defaults to red). +$client-warn: mat-palette($mat-red); + +// Create the theme object (a Sass map containing all of the palettes). +$client-theme: mat-light-theme($client-primary, $client-accent, $client-warn); + +// Include theme styles for core and each component used in your app. +// Alternatively, you can import and @include the theme mixins for each component +// that you are using. +@include angular-material-theme($client-theme); + /* You can add global styles to this file, and also import other style files */ + +html, body { height: 100%; } +body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; } diff --git a/routes/index.js b/routes/index.js index 2d8413d..4f96bb5 100644 --- a/routes/index.js +++ b/routes/index.js @@ -11,5 +11,4 @@ router.get('/api', (req, res, next) => { res.json("API Working!!"); }); - module.exports = router; \ No newline at end of file