update scss paths

client/angular.json

@@ -17,18 +17,11 @@
             "tsConfig": "src/tsconfig.app.json",
             "polyfills": "src/polyfills.ts",
             "extractCss": true,
-            "assets": [
-              "src/assets"
-            ],
+            "assets": ["src/assets"],
             "stylePreprocessorOptions": {
-              "includePaths": [
-                "src/sass"
-              ]
+              "includePaths": ["src/sass"]
             },
-            "styles": [
-              "node_modules/pb-design-system/dist/css/designsystem.css",
-              "src/styles.scss"
-            ],
+            "styles": ["node_modules/pb-design-system/dist/css/designsystem.css", "src/styles.scss"],
             "scripts": [
               "node_modules/jquery/dist/jquery.slim.js",
               "node_modules/popper.js/dist/umd/popper.js",
@@ -81,26 +74,15 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "src/tsconfig.spec.json",
             "scripts": [],
-            "styles": [
-              "node_modules/pb-design-system/dist/css/designsystem.css",
-              "src/styles.scss"
-            ],
-            "assets": [
-              "src/assets",
-              "src/favicon.ico"
-            ]
+            "styles": ["src/styles.scss"],
+            "assets": ["src/assets", "src/favicon.ico"]
           }
         },
         "lint": {
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
-            "tsConfig": [
-              "src/tsconfig.app.json",
-              "src/tsconfig.spec.json"
-            ],
-            "exclude": [
-              "**/node_modules/**"
-            ]
+            "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
+            "exclude": ["**/node_modules/**"]
           }
         }
       }
@@ -120,12 +102,8 @@
         "lint": {
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
-            "tsConfig": [
-              "e2e/tsconfig.e2e.json"
-            ],
-            "exclude": [
-              "**/node_modules/**"
-            ]
+            "tsConfig": ["e2e/tsconfig.e2e.json"],
+            "exclude": ["**/node_modules/**"]
           }
         }
       }
@@ -141,4 +119,4 @@
       "prefix": "app"
     }
   }
-}
+}

client/src/app/home/home.component.html

@@ -1,7 +1,20 @@
 <div class="page-header">
   <div class="container">
     <div class="row">
-      <div class="col"><h1>Home</h1></div>
+      <div class="col">
+        <h1>Home</h1>
+      </div>
     </div>
   </div>
 </div>
+
+<!--  mt-7 class on container, unless the first element inside is an H2 -->
+<div class="container mt-7">
+  <div class="row">
+    <div class="col">
+      <!-- if you have an H2 as the first element, remove the mt-7 from the container -->
+      <!-- <h2>Rest of Your Content</h2> -->
+      <p>Etiam porta sem malesuada magna mollis euismod. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Maecenas faucibus mollis interdum. Nulla vitae elit libero, a pharetra augue. Sed posuere consectetur est at lobortis. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+    </div>
+  </div>
+</div>

client/src/sass/_sample.scss

@@ -0,0 +1 @@
+// you can use this to add your app's styles

client/src/styles.scss

@@ -4,5 +4,7 @@
 @import '../node_modules/pb-design-system/sass/variables';
 @import '../node_modules/pb-design-system/sass/mixins';
 
-// project imports
-@import 'sample';
+@import '../node_modules/pb-design-system/dist/css/designsystem.css';
+
+// your project imports, add as many as you need
+@import '../src/sass/sample';