feat(demo): added angular material

AnthonyNahas · Nov 25, 2020 · ea0e634 · ea0e634
1 parent 5f826d7
commit ea0e634
Show file tree

Hide file tree

Showing 7 changed files with 40 additions and 3 deletions.
diff --git a/angular.json b/angular.json
@@ -31,6 +31,7 @@
               "src/assets"
             ],
             "styles": [
+              "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
               "src/styles.scss"
             ],
             "scripts": []
@@ -94,6 +95,7 @@
               "src/assets"
             ],
             "styles": [
+              "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
               "src/styles.scss"
             ],
             "scripts": []

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -17,10 +17,12 @@
   "private": true,
   "dependencies": {
     "@angular/animations": "~11.0.1",
+    "@angular/cdk": "^11.0.1",
     "@angular/common": "~11.0.1",
     "@angular/compiler": "~11.0.1",
     "@angular/core": "~11.0.1",
     "@angular/forms": "~11.0.1",
+    "@angular/material": "^11.0.1",
     "@angular/platform-browser": "~11.0.1",
     "@angular/platform-browser-dynamic": "~11.0.1",
     "@angular/platform-server": "~11.0.1",

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -20,7 +20,8 @@ export class AppComponent implements OnInit {
   ngOnInit(): void {
     const mailto: Mailto = {
       cc: [],
-      subject: 'Just only a test!'
+      subject: 'Just only a test!',
+      body: 'this is the body of the email!'
     };
     console.log(this.mailtoService.compose(mailto));
   }

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -4,6 +4,7 @@ import { NgxMailtoModule } from '../ngx-mailto/ngx-mailto.module';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 @NgModule({
   declarations: [
@@ -12,7 +13,8 @@ import { AppComponent } from './app.component';
   imports: [
     BrowserModule.withServerTransition({ appId: 'serverApp' }),
     AppRoutingModule,
-    NgxMailtoModule
+    NgxMailtoModule,
+    BrowserAnimationsModule
   ],
   providers: [],
   bootstrap: [AppComponent]

diff --git a/src/index.html b/src/index.html
@@ -6,8 +6,10 @@
   <base href="/">
   <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/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 </head>
-<body>
+<body class="mat-typography">
   <app-root></app-root>
 </body>
 </html>
diff --git a/src/styles.scss b/src/styles.scss
@@ -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, "Helvetica Neue", sans-serif; }