Add secondary features section

Signed-off-by: lucperkins <lucperkins@gmail.com>

config.toml

@@ -34,21 +34,37 @@ panel  = "https://raw.githubusercontent.com/cncf/artwork/master/etcd/icon/color/
 [params.social]
 github = "https://github.com/etcd-io/etcd"
 
-[[params.features]]
+[[params.features.primary]]
 title = "Simple interface"
 svg = "interface"
 description = "Read and write values using standard HTTP tools, such as curl"
 
-[[params.features]]
+[[params.features.primary]]
 title = "Key-value storage"
 svg = "kv"
 description = "Store data in hierarchically organized directories, as in a standard filesystem"
 
-[[params.features]]
+[[params.features.primary]]
 title = "Watch for changes"
 svg = "watch"
 description = "Watch specific keys or directories for changes and react to changes in values"
 
+[[params.features.secondary]]
+text = "Optional SSL client certificate authentication"
+icon = "lock"
+
+[[params.features.secondary]]
+text = "Benchmarked at 1000s of writes/s per instance"
+icon = "chart-bar"
+
+[[params.features.secondary]]
+text = "Optional TTLs for keys expiration"
+icon = "clock"
+
+[[params.features.secondary]]
+text = "Properly distributed via Raft protocol"
+icon = "arrows-alt"
+
 [[params.fonts]]
 name = "Source Sans Pro"
 sizes = [300,400,600,700]

layouts/partials/home/features.html

@@ -1,4 +1,6 @@
-{{ $features := .Site.Params.features }}
+{{ $features  := .Site.Params.features }}
+{{ $primary   := $features.primary }}
+{{ $secondary := $features.secondary }}
 <section class="section">
   <div class="container">
     <p class="title is-size-2 is-size-3-mobile has-text-primary has-text-weight-bold">
@@ -8,7 +10,7 @@
     <hr class="has-background-primary" />
 
     <div class="columns is-variable is-8">
-      {{ range $features }}
+      {{ range $primary }}
       {{ $svg := printf "static/img/%s.svg" .svg }}
       <div class="column">
         <p class="title is-size-3 is-size-4-mobile is-spaced has-text-weight-light">
@@ -25,5 +27,23 @@
       </div>
       {{ end }}
     </div>
+
+    <hr />
+
+    <div class="columns is-multiline">
+      {{ range $secondary }}
+      <div class="column">
+        <span class="icon has-text-danger">
+          <i class="fas fa-lg fa-{{ .icon }}"></i>
+        </span>
+
+        <br /><br />
+
+        <p class="is-size-4 is-size-5-mobile">
+          {{ .text }}
+        </p>
+      </div>
+      {{ end }}
+    </div>
   </div>
 </section>