Layout file update - head section updated

4 years ago · ef6fb7344a
6 changed files with 41 additions and 35 deletions
--- a/README.md
+++ b/README.md
@ -9,7 +9,7 @@ npm install
 Run development environment:

 ```
-npm component-dev
+npm start
 ```

 # Block Structure
--- a/layouts/page-container.hbs
+++ b/layouts/page-container.hbs
@ -1,5 +1,8 @@
 <html lang="en">
 <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
    <link rel="stylesheet" href="{{ config.cssUrl }}">
    <link rel="stylesheet" href="styles/template.min.css">
 </head>
--- a/layouts/page.hbs
+++ b/layouts/page.hbs
@ -1,5 +1,8 @@
 <html lang="en">
 <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
    <link rel="stylesheet" href="{{ config.cssUrl }}">
    <link rel="stylesheet" href="styles/template.min.css">
 </head>
--- a/package.json
+++ b/package.json
@ -2,7 +2,7 @@
  "name": "axe-web-component",
  "version": "1.0.1",
  "scripts": {
-    "start": "NODE_ENV=production node server.js",
+    "start": "component-dev",
    "dev": "NODE_ENV=development node server.js"
  },
  "license": "ISC",
--- a/src/styles/template.scss
+++ b/src/styles/template.scss
@ -9,36 +9,40 @@
 *
 */

-.clients {
-  background-color: red;
-  //color: white;
+.template {
+  padding: 1rem;

-  &__sub_level {
-    // EXAMPLE OF BREAKPOINTS
+  // EXAMPLE OF BREAKPOINTS

-    @media (min-width: 600px) {
-      // Tablet
-    }
+  @media (min-width: 600px) {
+    // Tablet
+  }

-    @media (min-width: 980px) {
-      // Large Tablet
-    }
+  @media (min-width: 980px) {
+    // Large Tablet
+  }

-    @media (min-width: 1024px) {
-      // Laptop & Tablet
-    }
+  @media (min-width: 1024px) {
+    // Laptop & Tablet
+  }

-    @media (min-width: 1336px) {
-      // Laptop
-    }
+  @media (min-width: 1336px) {
+    // Laptop
+  }

-    @media (min-width: 1680px) {
-      // Desktop
-    }
+  @media (min-width: 1680px) {
+    // Desktop
+  }
+
+  &__header {
+    border-bottom: 2px solid red;

+    &-heading {
+      // Heading
+    }
  }

-  &__sub_level_two {
-    //
+  &__content {
+    // Content
  }
 }
--- a/src/template.hbs
+++ b/src/template.hbs
@ -1,13 +1,9 @@
-<section class="template clients">
-    <div class="clients__intro"><h2 class="clients__title title">{{title}}</h2></div>
+<section class="template">
+    <header class="template__header">
+        <h1 class="template__header-heading">Ready!</h1>
+    </header>

-    <div class="clients__content">
-        <div class="clients__content-text"><p>{{phrase}}</p></div>
+    <div class="template__content">
+        <p>Review the `/data` folder with JSON data files.</p>
    </div>
-
-    <footer class="clients__actions actions">
-        <a href="{{ url }}" target="_self" class="btn btn--secondary">{{ cta_text }}</a>
-    </footer>
-</section>
-
-<img src="images/demo.jpeg" alt="">
+</section>