added community section, new font, and faq button. Params added to manage url links

config.toml

@@ -13,8 +13,9 @@ theme = "cloud.autonomic.zone"
     url = "https://docs.cloud.autonomic.zone"
     weight = 2
 
-
+[params]
-# HACK: DO NOT REMOVE
+  [params.links]
-# For some reason, having 0 params means that the Data map does not work.
+  docs = "https://docs.cloud.autonomic.zone/"
-[Params]
+  docsfaq = "https://docs.cloud.autonomic.zone/faq/"
-hello = "world"
+  getinvolved = ""
+  autonomicSite = "https://autonomic.zone"

themes/cloud.autonomic.zone/assets/scss/main.scss

@@ -23,6 +23,8 @@ $button-ghost-hover-color: $white;
 $button-text-hover-color: $white;
 $button-focus-box-shadow-size: 0;
 
+
+
 @import "./bulma/bulma.sass";
 
 @mixin define-manrope-family($weight, $uri) {
@@ -38,6 +40,7 @@ $button-focus-box-shadow-size: 0;
 @font-face { 
     @include define-manrope-family(bold, '../font/manrope.bold.woff2')
 }
+
 @font-face { 
     @include define-manrope-family(300, '../font/manrope.light.woff2')
 }
@@ -46,6 +49,14 @@ $button-focus-box-shadow-size: 0;
     @include define-manrope-family(medium, '../font/manrope.medium.woff2')
 }
 
+@font-face {
+    font-family: "lora";
+    src: url("../font/Lora-Italic.woff2");
+    font-weight: 300;
+    font-style: italic;
+}
+
+
 body {
     background-color: $bg-color;
     color: $text-color;
@@ -67,11 +78,48 @@ body {
     }
 }
 
-
 .hr-header {
     @include thick-hr();
 }
 
+button {
+    border-radius: 0 !important;
+}
+
+button.grey-button {
+    color: $text-color !important;
+    background-color: rgba(0,0,0,0) !important;
+    border-color: $text-color !important;
+    a {
+        color: $text-color;
+    }
+    &:hover {
+        border-color: black !important;
+    }
+}
+
+button#faq-button {
+    margin: 50px 0 30px 0;
+}
+
+#get-involved {
+    margin: 20px 0;
+    >.hero-body {
+        margin: 20px 0;
+    }
+    p {
+        line-height: 1 !important;
+    }
+    p:not(:last-child) {
+        padding-bottom: 20px;
+    }
+
+}
+
+#community-project {
+    font-family: "lora";
+}
+
 hr {
     background-color: $text-color;
     border: none;
@@ -90,7 +138,6 @@ hr {
     }
     a {
         color: $white;
-        text-decoration: underline;
     }
     .content {
         padding-bottom: 20px;
@@ -107,7 +154,6 @@ hr {
 
 }
 
-
 // Do not show server image when using mobile viewport
 // Is a little bigger than the actual mobile viewport in bulma due to the text overlapping with the server icon
 @media all and (min-width: 769px) {

themes/cloud.autonomic.zone/layouts/index.html

@@ -4,7 +4,8 @@
 {{ partial "index/underline_points.html" (dict "context" . "title" "benefits" "data" site.Data.benefits) }}
 {{ partial "index/underline_points.html" (dict "context" . "title" "faq" "data" site.Data.faq) }}
 {{ partial "index/autonomic_hero.html" (dict "context" . "data" site.Data) }}
-{{ partial "index/open_collective.html" (dict "context" . "data" site.Data) }}
+<!-- {{ partial "index/open_collective.html" (dict "context" . "data" site.Data) }} -->
+{{ partial "index/community_project.html" (dict "context" . "data" site.Data) }}
 
 
 {{ end }}

themes/cloud.autonomic.zone/layouts/partials/head.html

@@ -4,9 +4,8 @@
     {{ $title := print .Site.Title " | " .Title }}
     {{ if .IsHome }}{{ $title = .Site.Title }}{{ end }}
     {{/*  scss compiling  */}}
-    {{ $cssOutput := "css/style.css" }}
+    {{ $options := (dict "targetPath" "css/style.css" "outputStyle" "compressed") }}
-    {{ $options := (dict "targetPath" $cssOutput "outputStyle" "compressed") }}
     {{ $style := resources.Get "scss/main.scss" | resources.ToCSS $options }}
-    <link href='{{ path.Join "/" $cssOutput }}' rel="stylesheet">
+    <link href='{{ $style.RelPermalink }}' rel="stylesheet">
     <title>{{ $title }}</title>
 </head>

themes/cloud.autonomic.zone/layouts/partials/index/autonomic_hero.html

@@ -10,7 +10,7 @@
       </div>
       <div class="column is-half-widescreen is-two-thirds-tablet is-desktop">
         <p class="is-size-4 block">{{ site.Data.who_is_involved.text }}</p>
-        <button class="button is-autonomic has-text-white is-large">visit: autonomic.zone</button>
+        <button class="button is-autonomic has-text-white is-large"><a href="{{ site.Params.links.autonomicSite }}">visit: autonomic.zone</a></button>
       </div>
     </div>
   </div>

themes/cloud.autonomic.zone/layouts/partials/index/community_project.html

@@ -0,0 +1,13 @@
+<section id="get-involved" class="hero">
+  <div class="hero-body has-text-centered">
+    <p class="is-size-1">
+      {{ emojify ":house:" }}
+    </p>
+    <p id="community-project" class="is-size-3">
+        This is a community project.
+    </p>
+    <div class="">
+      <button id="get-involved" class="button grey-button is-uppercase is-medium has-text-weight-bold">Get involved</button>
+    </div>
+  </div>
+</section>

themes/cloud.autonomic.zone/layouts/partials/index/server_hero.html

@@ -12,7 +12,7 @@
         </div>
       </div>
     </div>
-    <div class="hero-foot has-text-centered ">
+    <div class="hero-foot has-text-centered">
       <p class="is-size-3"><b>Learn More</b></p>
       <!-- SVG provided by LineIcons https://lineicons.com under CC BY-SA 4.0 -->
       <!-- Colour has been changed and this SVG is also licensed under CC BY-SA 4.0 as per its license requirements -->

themes/cloud.autonomic.zone/layouts/partials/index/underline_points.html

@@ -3,6 +3,7 @@
     <h1 class="is-uppercase">{{ .title }}</h1>
     <hr class="hr-header">
     {{ $title := lower .title }}
+    {{ $amount := len .data }}
     {{ range $index, $item := .data }}
       {{/*  Don't place <hr> if it is the first in the list  */}}
       {{ if gt $index 0 }}<hr>{{ end }}
@@ -18,6 +19,11 @@
           <div class="is-size-4">
             <p class="block has-text-weight-light">{{ $item.right }}</p>
           </div>
+          {{ if and (eq $amount (add $index 1)) (eq $title "faq") }}
+            <button id="faq-button" class="button grey-button is-medium">
+              <a href="{{ site.Params.links.docsfaq }}">Read all Frequently Asked Questions</a>
+            </button>
+          {{ end }}
         </div>
       </div>
     {{ end }}