From ad910f6998c71cfaaf9ff456a423d0e1464976ed Mon Sep 17 00:00:00 2001 From: Rytis Alekna Date: Mon, 24 Sep 2018 18:13:26 +0300 Subject: [PATCH] feat(added Material UI) --- angular.json | 6 ++++++ package-lock.json | 25 +++++++++++++++++++++++++ package.json | 4 +++- src/app/app.component.html | 16 ++-------------- src/app/app.component.ts | 2 +- src/app/app.module.ts | 4 +++- src/index.html | 2 ++ src/styles.css | 3 +++ 8 files changed, 45 insertions(+), 17 deletions(-) diff --git a/angular.json b/angular.json index c8468e9..942b522 100644 --- a/angular.json +++ b/angular.json @@ -23,6 +23,9 @@ "src/assets" ], "styles": [ + { + "input": "node_modules/@angular/material/prebuilt-themes/indigo-pink.css" + }, "src/styles.css" ], "scripts": [] @@ -72,6 +75,9 @@ "tsConfig": "src/tsconfig.spec.json", "karmaConfig": "src/karma.conf.js", "styles": [ + { + "input": "node_modules/@angular/material/prebuilt-themes/indigo-pink.css" + }, "src/styles.css" ], "scripts": [], diff --git a/package-lock.json b/package-lock.json index f7fce99..98b30d0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -124,6 +124,14 @@ "tslib": "^1.9.0" } }, + "@angular/cdk": { + "version": "6.4.7", + "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-6.4.7.tgz", + "integrity": "sha512-18x0U66fLD5kGQWZ9n3nb75xQouXlWs7kUDaTd8HTrHpT1s2QIAqlLd1KxfrYiVhsEC2jPQaoiae7VnBlcvkBg==", + "requires": { + "tslib": "^1.7.1" + } + }, "@angular/cli": { "version": "6.2.3", "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-6.2.3.tgz", @@ -357,6 +365,23 @@ "integrity": "sha512-AQpjHDlhGuuRvBuWEpq/u49lcaEL/PO2tLMMU5gRqBFYido9wP/6Flz0Oxgu1g5Xjj19Kj00j9uNGgSGc4UCyQ==", "dev": true }, + "@angular/material": { + "version": "6.4.7", + "resolved": "https://registry.npmjs.org/@angular/material/-/material-6.4.7.tgz", + "integrity": "sha512-SdNx7Xovi24Kw9eU6lkLhY/7f2M7L9F+/uh6XuPr4jbGgCUVVpeeVI5ztZhsZRbj1sN+/r1p5w8u62apWWl5Ww==", + "requires": { + "parse5": "^5.0.0", + "tslib": "^1.7.1" + }, + "dependencies": { + "parse5": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/parse5/-/parse5-5.1.0.tgz", + "integrity": "sha512-fxNG2sQjHvlVAYmzBZS9YlDp6PTSSDwa98vkD4QgVDDCAo84z5X1t5XyJQ62ImdLXx5NdIIfihey6xpum9/gRQ==", + "optional": true + } + } + }, "@angular/platform-browser": { "version": "6.1.8", "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-6.1.8.tgz", diff --git a/package.json b/package.json index 0a5bb49..4a1ffce 100644 --- a/package.json +++ b/package.json @@ -17,12 +17,14 @@ "@angular/core": "^6.1.0", "@angular/forms": "^6.1.0", "@angular/http": "^6.1.0", + "@angular/material": "^6.4.7", "@angular/platform-browser": "^6.1.0", "@angular/platform-browser-dynamic": "^6.1.0", "@angular/router": "^6.1.0", "core-js": "^2.5.4", "rxjs": "~6.2.0", - "zone.js": "~0.8.26" + "zone.js": "~0.8.26", + "@angular/cdk": "^6.2.0" }, "devDependencies": { "@angular-devkit/build-angular": "~0.8.0", diff --git a/src/app/app.component.html b/src/app/app.component.html index fa2706a..c6650c9 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,20 +1,8 @@

- Welcome to {{ title }}! + {{ title }}

- Angular Logo
-

Here are some links to help you start:

- + diff --git a/src/app/app.component.ts b/src/app/app.component.ts index d0c7b00..6fd46f6 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 = 'dynamic-form'; + title = 'Dynamic form'; } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index f657163..de5e54d 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -2,13 +2,15 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; @NgModule({ declarations: [ AppComponent ], imports: [ - BrowserModule + BrowserModule, + BrowserAnimationsModule ], providers: [], bootstrap: [AppComponent] diff --git a/src/index.html b/src/index.html index 927a8cd..e280561 100644 --- a/src/index.html +++ b/src/index.html @@ -1,6 +1,8 @@ + + DynamicForm diff --git a/src/styles.css b/src/styles.css index 90d4ee0..d0fb837 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1 +1,4 @@ /* You can add global styles to this file, and also import other style files */ + +html, body { height: 100%; } +body { margin: 0; font-family: 'Roboto', sans-serif; }