Merge pull request #30 from ggrossetie/issue-17-home-layout

ref #17 Introduce a home layout

preview-src/home.adoc

@@ -0,0 +1,8 @@
+= Feel++ Documentation
+:page-layout: home
+:feelpp: Feel++
+
+[.lead]
+{feelpp} is an Open-Source {cpp} library which allows to solve a large range of partial differential equations using Galerkin methods,
+e.g. finite element method, spectral element method, discontinuous Galerkin methods or reduced basis methods.
+Feel++ enables parallel computing in a seamless way and allows to solve large scale systems up to tens of thousands of cores.

src/css/docs-home.css

@@ -0,0 +1,108 @@
+@media screen and (min-width: 1024px) {
+  body.docs-home .toolbar {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 1023px) {
+  body.docs-home .doc {
+    padding: 1rem;
+  }
+
+  body.docs-home .toolbar {
+    top: 0;
+  }
+
+  body.docs-home .nav-container {
+    z-index: 30;
+    margin-top: var(--toolbar-height);
+  }
+}
+
+body.docs-home .doc > h1.page:first-child {
+  font-size: 2rem;
+  margin-top: 0.25rem;
+  margin-bottom: 0;
+}
+
+body.docs-home .doc .paragraph.lead {
+  margin-top: 0.5rem;
+  color: var(--color-gray-70);
+}
+
+body.docs-home .doc .paragraph.lead > p {
+  font-size: 1.15rem;
+}
+
+@media screen and (min-width: 769px) {
+  body.docs-home .doc > h1.page:first-child {
+    margin-top: 1.5rem;
+  }
+
+  body.docs-home .doc .paragraph.lead > p {
+    font-size: 1.25rem;
+  }
+}
+
+body.docs-home .books {
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  gap: 2em;
+  padding-left: 2em;
+  padding-right: 2em;
+  margin-top: 2em;
+}
+
+body.docs-home .book-cover > svg a:hover {
+  color: inherit;
+  text-decoration: none;
+}
+
+body.docs-home .book-cover > svg {
+  height: auto;
+  width: 250px;
+  box-shadow: 5px 5px 5px #aaa;
+}
+
+body.docs-home .book-cover > svg:hover {
+  margin: 1px -1px -1px 1px;
+  box-shadow: 3px 3px 10px #545454;
+}
+
+body.docs-home .book-cover > svg:active {
+  margin: 2px -2px -2px 2px;
+  box-shadow: 3px 3px 10px #545454;
+}
+
+body.docs-home .button {
+  padding: 0.75em 1.5em;
+  font-size: inherit;
+  line-height: 1.5;
+  border-radius: 0.5em;
+  border: 1px solid;
+  transition: 80ms cubic-bezier(0.33, 1, 0.68, 1);
+  transition-property: color, background-color, box-shadow, border-color;
+  box-shadow: var(--color-gray-30), var(--color-gray-30);
+}
+
+body.docs-home article.doc {
+  padding-bottom: 2em;
+}
+
+body.docs-home .actions {
+  display: flex;
+  gap: 1em;
+}
+
+body.docs-home .button.primary {
+  color: white;
+  background-color: hsl(344deg 60% 49.02%);
+  border-color: hsl(344 60% 35% / 1);
+}
+
+body.docs-home .button.secondary {
+  background-color: var(--color-smoke-50);
+  color: var(--color-jet-70);
+  border-color: var(--color-smoke-90);
+}

src/css/home.css

@@ -83,3 +83,21 @@
 .doc .grid ul a {
   font-weight: var(--body-font-weight-bold);
 }
+
+.latest-news {
+  padding-top: 2.5em;
+  display: flex;
+  flex-wrap: wrap;
+  margin-bottom: 3em;
+  gap: 2em;
+}
+
+.twitter-timeline {
+  display: block;
+}
+
+.twitter-timeline-container {
+  max-width: 100%;
+  width: 420px;
+  height: 500px;
+}

src/css/nav.css

@@ -189,7 +189,7 @@ html.is-clipped--nav {
   align-items: inherit;
 }
 
-.nav-panel-explore .context .version::after {
+.nav-panel-explore:not(:first-child) .context .version::after {
   content: "";
   background: url(../img/chevron.svg) no-repeat center right / auto 100%;
   width: 1.25em;

src/css/site.css

@@ -22,5 +22,5 @@
 @import "print.css";
 @import "stretchy.css";
 @import "clipboard.css";
-@import "cover.css";
 @import "tabs-block.css";
+@import "docs-home.css";

src/helpers/debug.js

@@ -0,0 +1,3 @@
+'use strict'
+
+module.exports = (obj) => console.log({ obj }) && obj

src/helpers/get-install-page.js

@@ -5,23 +5,25 @@ module.exports = (version, { data: { root } }) => {
   if (version === 'stable') {
     // find latest stable version
     const userComponent = contentCatalog.getComponent('user')
-    const componentVersions = userComponent.versions
-    if (componentVersions.length > 1) {
-      const stableVersion = componentVersions[1].version
-      const page = contentCatalog.getById({
-        component: 'user',
-        version: stableVersion,
-        family: 'page',
-        module: 'install',
-        relative: 'index.adoc',
-      })
-      if (page) {
-        return {
-          ...page,
+    if (userComponent) {
+      const componentVersions = userComponent.versions
+      if (componentVersions.length > 1) {
+        const stableVersion = componentVersions[1].version
+        const page = contentCatalog.getById({
+          component: 'user',
           version: stableVersion,
+          family: 'page',
+          module: 'install',
+          relative: 'index.adoc',
+        })
+        if (page) {
+          return {
+            ...page,
+            version: stableVersion,
+          }
         }
+        return page
       }
-      return page
     }
     return undefined
   }

src/helpers/get-recommended-resources.js

@@ -0,0 +1,79 @@
+'use strict'
+
+module.exports = ({ data: { root } }) => {
+  const { contentCatalog } = root
+  const result = []
+  const userComponent = contentCatalog.getComponent('user')
+  if (userComponent) {
+    const { versions } = userComponent
+    if (versions && versions.length) {
+      // stable
+      const startPageUrl = versions[0].navigation[0].items[0].url
+      result.push({
+        title: 'USER MANUAL',
+        color: '#1ddaff',
+        id: 'user-manual',
+        url: startPageUrl,
+      })
+    }
+  }
+  const devComponent = contentCatalog.getComponent('dev')
+  if (devComponent) {
+    const { versions } = devComponent
+    if (versions && versions.length) {
+      // stable
+      const startPageUrl = versions[0].navigation[0].items[0].url
+      result.push({
+        title: 'DEV. MANUAL',
+        color: '#50377b',
+        id: 'dev-manual',
+        url: startPageUrl,
+      })
+    }
+  }
+  const dataComponent = contentCatalog.getComponent('data')
+  if (dataComponent) {
+    const { versions } = dataComponent
+    if (versions && versions.length) {
+      // stable
+      const startPageUrl = versions[0].navigation[0].items[0].url
+      result.push({
+        title: 'DATA MANUAL',
+        color: '#0080FF',
+        id: 'data-manual',
+        url: startPageUrl,
+      })
+    }
+  }
+  const femIndexPage = contentCatalog.getById({
+    component: 'math',
+    version: 'master',
+    family: 'page',
+    module: 'fem',
+    relative: 'index.adoc',
+  })
+  if (femIndexPage) {
+    result.push({
+      title: 'FEM',
+      color: 'red',
+      id: 'fem-book',
+      url: femIndexPage.pub.url,
+    })
+  }
+  const hdgIndexPage = contentCatalog.getById({
+    component: 'math',
+    version: 'master',
+    family: 'page',
+    module: 'hdg',
+    relative: 'index.adoc',
+  })
+  if (hdgIndexPage) {
+    result.push({
+      title: 'HDG',
+      color: 'magenta',
+      id: 'hdg-book',
+      url: femIndexPage.pub.url,
+    })
+  }
+  return result
+}

src/helpers/rearrange.js

@@ -0,0 +1,24 @@
+'use strict'
+
+module.exports = (collection, property, orderSpec) => {
+  if (orderSpec == null || orderSpec === '*') return Object.values(collection)
+  const sourceCollection = Object.values(collection).reduce((accum, it) => accum.set(it[property], it), new Map())
+  const order = orderSpec
+    .split(',')
+    .map((it) => it.trim())
+    .filter((it) => {
+      if (it.charAt() !== '!') return true
+      sourceCollection.delete(it.substr(1))
+    })
+  const restIdx = order.indexOf('*')
+  if (~restIdx) order.splice(restIdx, 1)
+  const targetCollection = order.reduce((accum, key) => {
+    if (sourceCollection.has(key)) {
+      accum.push(sourceCollection.get(key))
+      sourceCollection.delete(key)
+    }
+    return accum
+  }, [])
+  if (~restIdx) targetCollection.splice(restIdx, 0, ...sourceCollection.values())
+  return targetCollection
+}

src/helpers/stringify.js

@@ -0,0 +1,3 @@
+'use strict'
+
+module.exports = (obj) => JSON.stringify(obj)