Transition to Hugo Image Processing (#173)

* Update layout to use Hugo Image Processing.

Created shortcode rimg that uses the srcset attribute to display responsive images.

* Copy Static images to assets folder.

* Add image processing to missing components + Update examples

* Fix rendering in https://themes.gohugo.io/

Co-authored-by: Emruz Hossain <emruz@appscode.com>

layouts/partials/cards/skill.html

@@ -2,8 +2,15 @@
   <a class="skill-card-link" href="{{ if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}">
     <div class="card">
       <div class="card-head d-flex">
-        {{ if .icon }}
-        <img class="card-img-xs" src="{{ .icon | relURL }}" alt="{{ .name }}" />
+        {{ if .logo }}
+          {{ $logoImage := resources.Get .logo }}
+
+          {{/*  svg don't support "Fit" operation   */}}
+          {{ if ne $logoImage.MediaType.SubType "svg" }}
+            {{ $logoImage := $logoImage.Fit "24x24" }}
+          {{ end }}
+
+          <img class="card-img-xs" src="{{ $logoImage.RelPermalink }}" alt="{{ .name }}" />
         {{ end }}
         <h5 class="card-title">{{ .name }}</h5>
       </div>