basic styling for specification pages

blocks/features/features.css

@@ -0,0 +1,27 @@
+.features {
+  margin: 50px 0;
+}
+
+/* lines */
+.features > div {
+  display: flex;
+  flex-direction: column;
+}
+
+/* rows / cells */
+.features > div > div {
+  width: 100%;
+}
+
+@media (min-width: 600px) {
+  .features > div {
+    flex-direction: row;
+    column-gap: 20px;
+  }
+
+  .features > div > div:first-child {
+    font-weight: bold;
+    flex-basis: 300px;
+    text-align: end;
+  }
+}

blocks/features/features.js

@@ -0,0 +1,3 @@
+export default async function decorate(block) {
+  // NOP
+}

blocks/specifications/specifications.css

@@ -0,0 +1,27 @@
+.specifications {
+  margin: 50px 0;
+}
+
+/* lines */
+.specifications > div {
+  display: flex;
+  flex-direction: column;
+}
+
+/* rows / cells */
+.specifications > div > div {
+  width: 100%;
+}
+
+@media (min-width: 600px) {
+  .specifications > div {
+    flex-direction: row;
+    column-gap: 20px;
+  }
+
+  .specifications > div > div:first-child {
+    font-weight: bold;
+    flex-basis: 300px;
+    text-align: end;
+  }
+}

blocks/specifications/specifications.js

@@ -0,0 +1,3 @@
+export default async function decorate(block) {
+  // NOP
+}

scripts/scripts.js

@@ -105,8 +105,8 @@ async function loadLazy(doc) {
   const element = hash ? doc.getElementById(hash.substring(1)) : false;
   if (hash && element) element.scrollIntoView();
 
-  loadHeader(doc.querySelector('header'));
-  loadFooter(doc.querySelector('footer'));
+  // loadHeader(doc.querySelector('header'));
+  // loadFooter(doc.querySelector('footer'));
 
   loadCSS(`${window.hlx.codeBasePath}/styles/lazy-styles.css`);
   loadFonts();

styles/styles.css

@@ -38,7 +38,7 @@
   --heading-font-size-xs: 18px;
 
   /* nav height */
-  --nav-height: 64px;
+  --nav-height: 0;
 }
 
 @font-face {
@@ -74,6 +74,7 @@ body.appear {
 }
 
 header {
+  display: none;
   height: var(--nav-height);
 }