Add SVGs to home page features section

Signed-off-by: lucperkins <[email protected]>
zeinabawd · Jan 7, 2019 · 7f98d3d · 7f98d3d
1 parent 1bc2254
commit 7f98d3d
Show file tree

Hide file tree

Showing 10 changed files with 510 additions and 3 deletions.
diff --git a/assets/sass/helpers.sass b/assets/sass/helpers.sass
@@ -0,0 +1,6 @@
+=flex
+  display: flex
+
+=x-center
+  +flex
+  justify-content: center
diff --git a/assets/sass/style.sass b/assets/sass/style.sass
@@ -23,7 +23,7 @@ $etcd-dark-blue: darken($etcd-blue, 10%)
 
 // Bulma variable overrides
 $primary: $etcd-blue
-$link: darken($primary, 5%)
+$link: $etcd-dark-blue
 $family-sans-serif: "{{ $sansSerifFont }}", BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif
 $family-code: "{{ $monospaceFont }}", monospace
 $toc-item-font-size: 1.5rem
@@ -36,6 +36,8 @@ $dashboard-panel-footer-top-margin: 3rem
 @import "bulma-dashboard/src/bulma-dashboard"
 @import "bulma-squeezebox/bulma-squeezebox"
 
+@import "helpers"
+
 =logo($touch, $desktop)
   +touch
     width: $touch
@@ -66,3 +68,9 @@ $dashboard-panel-footer-top-margin: 3rem
 
   .main
     flex: 1
+
+.is-home-svg
+  +x-center
+
+  svg
+    height: 7.5rem
diff --git a/config.toml b/config.toml
@@ -36,14 +36,17 @@ github = "https://github.com/etcd-io/etcd"
 
 [[params.features]]
 title = "Simple interface"
+svg = "interface"
 description = "Read and write values using standard HTTP tools, such as curl"
 
 [[params.features]]
 title = "Key-value storage"
+svg = "kv"
 description = "Store data in hierarchically organized directories, as in a standard filesystem"
 
 [[params.features]]
 title = "Watch for changes"
+svg = "watch"
 description = "Watch specific keys or directories for changes and react to changes in values"
 
 [[params.fonts]]

diff --git a/layouts/partials/home/features.html b/layouts/partials/home/features.html
@@ -9,6 +9,7 @@
 
     <div class="columns is-variable is-8">
       {{ range $features }}
+      {{ $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">
           {{ .title }}
@@ -17,6 +18,10 @@
         <p class="subtitle">
           {{ .description | markdownify }}
         </p>
+
+        <div class="is-home-svg">
+          {{ $svg | readFile | safeHTML }}
+        </div>
       </div>
       {{ end }}
     </div>

diff --git a/layouts/shortcodes/svg.html b/layouts/shortcodes/svg.html
@@ -0,0 +1,2 @@
+{{ $path := .Get 0 }}
+{{ $path | readFile | safeHTML }}
diff --git a/resources/_gen/assets/sass/sass/style.sass_6af550c30182af2cbd2f775fdbb9d3bc.content b/resources/_gen/assets/sass/sass/style.sass_6af550c30182af2cbd2f775fdbb9d3bc.content
diff --git a/resources/_gen/assets/sass/sass/style.sass_6af550c30182af2cbd2f775fdbb9d3bc.json b/resources/_gen/assets/sass/sass/style.sass_6af550c30182af2cbd2f775fdbb9d3bc.json
@@ -1 +1 @@
-{"Target":"css/style.b900ac2b6c4c6297dc6c1fe08e134bfb65c3f624403a6406de889fe435c899c9.css","MediaType":"text/css","Data":{"Integrity":"sha256-uQCsK2xMYpfcbB/gjhNL+2XD9iRAOmQG3oif5DXImck="}}
+{"Target":"css/style.fbdc66f6142c9f43f0d036b05b94e29d9d51ff474905f830652934ea7785a065.css","MediaType":"text/css","Data":{"Integrity":"sha256-+9xm9hQsn0Pw0DawW5TinZ1R/0dJBfgwZSk06neFoGU="}}
diff --git a/static/img/interface.svg b/static/img/interface.svg
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		{{ $path := .Get 0 }}
		{{ $path \| readFile \| safeHTML }}
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		{"Target":"css/style.b900ac2b6c4c6297dc6c1fe08e134bfb65c3f624403a6406de889fe435c899c9.css","MediaType":"text/css","Data":{"Integrity":"sha256-uQCsK2xMYpfcbB/gjhNL+2XD9iRAOmQG3oif5DXImck="}}
		{"Target":"css/style.fbdc66f6142c9f43f0d036b05b94e29d9d51ff474905f830652934ea7785a065.css","MediaType":"text/css","Data":{"Integrity":"sha256-+9xm9hQsn0Pw0DawW5TinZ1R/0dJBfgwZSk06neFoGU="}}