small icon and spacing fixes

.gitignore

@@ -2,6 +2,7 @@
 .swp
 .env*
 dist/
+tmp/
 node_modules/
 exampleSite/themes/
 exampleSite/public/

exampleSite/content/contact.md

@@ -1,3 +1,7 @@
 ---
-title: "Contact"
+title: "Get in touch"
 ---
+
+- **E-Mail:** mail [ett] example.com
+- **Matrix:** @john:example.com
+- **XMPP:** john@example.com

exampleSite/content/posts/post-1.md

@@ -16,3 +16,11 @@ Amalia id per in minimum facility, quid facet modifier ea ma. Ill um select ma a
 ## Subtitle 2
 
 Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious copious quo ad. Stet probates in duo.
+
+### Subtitle 3
+
+#### Subtitle 4
+
+##### Subtitle 5
+
+###### Subtitle 6

gulpfile.js

@@ -112,9 +112,10 @@ gulp.task('svg-sprite', function () {
               attributes: false,
             },
             spacing: {
-                padding: 0,
+                padding: 5,
                 box: 'content'
             },
+            dest: 'tmp/intermediate-svg',
         },
         svg: {
             xmlDeclaration: false,
@@ -125,7 +126,7 @@ gulp.task('svg-sprite', function () {
         mode: {
             inline: true,
             symbol: {
-                dest: './',
+                dest: 'layouts/partials/',
                 sprite: 'svg-icon-symbols.html',
                 bust: false,
             }
@@ -134,7 +135,7 @@ gulp.task('svg-sprite', function () {
 
     return gulp.src('src/icons/*.svg')
         .pipe(svgSprite(config))
-        .pipe(gulp.dest('layouts/partials/'));
+        .pipe(gulp.dest('.'));
 });
 
 gulp.task('iconfont', function () {

layouts/partials/site-footer.html

@@ -6,7 +6,7 @@
                 <a href='{{ "atom.xml" | relURL }}' class="gblog-footer__link">Feed</a>
             </span>
             <span class="gblog-footer__item">
-                <svg class="icon contact"><use xlink:href="#contact"></use></svg>
+                <svg class="icon email"><use xlink:href="#email"></use></svg>
                 <a href='{{ "contact" | relURL }}' class="gblog-footer__link">Contact</a>
             </span>
             {{ with .Site.Params.GeekblogLegalNotice }}

src/iconfont/email.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="-6.67 -6.67 45.33 45.33"><path d="M28.845 9.615v-3.23L16 14.422 3.155 6.385v3.23L16 17.577zm0-6.46q1.277 0 2.216.977T32 6.385v19.23q0 1.277-.939 2.253t-2.216.977H3.155q-1.277 0-2.216-.977T0 25.615V6.385q0-1.277.939-2.253t2.216-.977h25.69z"/></svg>

src/iconfont/uEA05-contact.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="-6.67 -6.67 45.33 45.33"><path d="M16.826 17.577q0-1.728 2.404-3.831t2.404-4.131q0-2.629-1.915-4.545t-4.545-1.915-4.507 1.915-1.878 4.545h3.23q0-1.277.939-2.253t2.216-.977 2.253.977.977 2.253q0 1.052-.751 1.878T16 12.845t-1.653 1.765-.751 2.967h3.23zm0 5.634v-3.23h-3.23v3.23h3.23zM15.174 0q5.634 0 9.653 3.981t4.019 9.615q0 5.484-3.53 10.554T16.002 32v-4.807h-.826q-5.634 0-9.615-3.981T1.58 13.597t3.981-9.615T15.176.001z"/></svg>

src/iconfont/uEA05-contacts.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="-6.67 -6.67 45.33 45.33"><path d="M22.688 22.688v-2q0-1.5-2.281-2.438t-4.406-.938-4.406.938-2.281 2.438v2h13.375zM16 9q-1.25 0-2.125.875T13 12t.875 2.125T16 15t2.125-.875T19 12t-.875-2.125T16 9zm10.688-3.687q1.063 0 1.844.813t.781 1.875v16q0 1.063-.781 1.875t-1.844.813H5.313q-1.063 0-1.844-.813t-.781-1.875v-16q0-1.063.781-1.875t1.844-.813h21.375zM5.313 32v-2.688h21.375V32H5.313zM26.688 0v2.688H5.313V0h21.375z"/></svg>

src/icons/contact.svg

@@ -1,5 +0,0 @@
-<!-- Generated by IcoMoon.io -->
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-<title>contact</title>
-<path d="M16.826 17.577q0-1.728 2.404-3.831t2.404-4.131q0-2.629-1.915-4.545t-4.545-1.915-4.507 1.915-1.878 4.545h3.23q0-1.277 0.939-2.253t2.216-0.977 2.253 0.977 0.977 2.253q0 1.052-0.751 1.878t-1.653 1.352-1.653 1.765-0.751 2.967h3.23zM16.826 23.211v-3.23h-3.23v3.23h3.23zM15.174 0q5.634 0 9.653 3.981t4.019 9.615q0 5.484-3.53 10.554t-9.314 7.85v-4.807h-0.826q-5.634 0-9.615-3.981t-3.981-9.615 3.981-9.615 9.615-3.981z"></path>
-</svg>

src/icons/contacts.svg

@@ -0,0 +1,5 @@
+<!-- Generated by IcoMoon.io -->
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+<title>contacts</title>
+<path d="M22.688 22.688v-2q0-1.5-2.281-2.438t-4.406-0.938-4.406 0.938-2.281 2.438v2h13.375zM16 9q-1.25 0-2.125 0.875t-0.875 2.125 0.875 2.125 2.125 0.875 2.125-0.875 0.875-2.125-0.875-2.125-2.125-0.875zM26.688 5.313q1.063 0 1.844 0.813t0.781 1.875v16q0 1.063-0.781 1.875t-1.844 0.813h-21.375q-1.063 0-1.844-0.813t-0.781-1.875v-16q0-1.063 0.781-1.875t1.844-0.813h21.375zM5.313 32v-2.688h21.375v2.688h-21.375zM26.688 0v2.688h-21.375v-2.688h21.375z"></path>
+</svg>

src/icons/email.svg

@@ -0,0 +1,5 @@
+<!-- Generated by IcoMoon.io -->
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+<title>email</title>
+<path d="M28.845 9.615v-3.23l-12.845 8.037-12.845-8.037v3.23l12.845 7.962zM28.845 3.155q1.277 0 2.216 0.977t0.939 2.253v19.23q0 1.277-0.939 2.253t-2.216 0.977h-25.69q-1.277 0-2.216-0.977t-0.939-2.253v-19.23q0-1.277 0.939-2.253t2.216-0.977h25.69z"></path>
+</svg>

src/sass/_base.scss

@@ -79,13 +79,13 @@ img {
   width: 100%;
   max-width: $container-max-width;
   margin: 0 auto;
-  padding: $padding-16;
+  padding: $padding-16 $padding-16 * 1.5;
 }
 
 .icon {
   display: inline-block;
-  width: 1em;
+  width: 1.3em;
-  height: 1em;
+  height: 1.3em;
   vertical-align: middle;
   stroke-width: 0;
   stroke: currentColor;
@@ -191,7 +191,8 @@ img {
       margin-top: 0;
     }
 
-    a, a:visited {
+    a,
+    a:visited {
       color: inherit;
       text-decoration: none;
     }
@@ -256,6 +257,10 @@ img {
     &--right {
       text-align: right;
     }
+
+    .icon {
+      font-size: $font-size-16 * 1.3;
+    }
   }
 
   &__footer {
@@ -274,7 +279,7 @@ img {
   color: $white;
 
   &__item {
-    margin: $padding-8 $padding-8;
+    margin: $padding-8 $padding-8 $padding-8 0;
   }
 
   &__link {