From 4ebec513f822f94a0119c430d30849541a11c2e3 Mon Sep 17 00:00:00 2001 From: Robert Kaussow Date: Sun, 12 Jul 2020 23:07:37 +0200 Subject: [PATCH] small icon and spacing fixes --- .gitignore | 1 + exampleSite/content/contact.md | 6 +++++- exampleSite/content/posts/post-1.md | 8 ++++++++ gulpfile.js | 7 ++++--- layouts/partials/site-footer.html | 2 +- layouts/partials/svg-icon-symbols.html | 2 +- src/iconfont/email.svg | 1 + src/iconfont/uEA05-contact.svg | 1 - src/iconfont/uEA05-contacts.svg | 1 + src/icons/contact.svg | 5 ----- src/icons/contacts.svg | 5 +++++ src/icons/email.svg | 5 +++++ src/sass/_base.scss | 27 +++++++++++++++----------- 13 files changed, 48 insertions(+), 23 deletions(-) create mode 100644 src/iconfont/email.svg delete mode 100644 src/iconfont/uEA05-contact.svg create mode 100644 src/iconfont/uEA05-contacts.svg delete mode 100644 src/icons/contact.svg create mode 100644 src/icons/contacts.svg create mode 100644 src/icons/email.svg diff --git a/.gitignore b/.gitignore index ef938c3..5457267 100644 --- a/.gitignore +++ b/.gitignore @@ -2,6 +2,7 @@ .swp .env* dist/ +tmp/ node_modules/ exampleSite/themes/ exampleSite/public/ diff --git a/exampleSite/content/contact.md b/exampleSite/content/contact.md index 736ccc7..1c0004a 100644 --- a/exampleSite/content/contact.md +++ b/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 diff --git a/exampleSite/content/posts/post-1.md b/exampleSite/content/posts/post-1.md index 4a421e4..8d96d63 100644 --- a/exampleSite/content/posts/post-1.md +++ b/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 diff --git a/gulpfile.js b/gulpfile.js index 9040d01..9510793 100644 --- a/gulpfile.js +++ b/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 () { diff --git a/layouts/partials/site-footer.html b/layouts/partials/site-footer.html index d1aa8cf..79a6f16 100644 --- a/layouts/partials/site-footer.html +++ b/layouts/partials/site-footer.html @@ -6,7 +6,7 @@ Feed - + Contact {{ with .Site.Params.GeekblogLegalNotice }} diff --git a/layouts/partials/svg-icon-symbols.html b/layouts/partials/svg-icon-symbols.html index 95fe43b..8da93a0 100644 --- a/layouts/partials/svg-icon-symbols.html +++ b/layouts/partials/svg-icon-symbols.html @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/iconfont/email.svg b/src/iconfont/email.svg new file mode 100644 index 0000000..f38da85 --- /dev/null +++ b/src/iconfont/email.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/iconfont/uEA05-contact.svg b/src/iconfont/uEA05-contact.svg deleted file mode 100644 index 38ab28e..0000000 --- a/src/iconfont/uEA05-contact.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/iconfont/uEA05-contacts.svg b/src/iconfont/uEA05-contacts.svg new file mode 100644 index 0000000..fea5716 --- /dev/null +++ b/src/iconfont/uEA05-contacts.svg @@ -0,0 +1 @@ + diff --git a/src/icons/contact.svg b/src/icons/contact.svg deleted file mode 100644 index 830058a..0000000 --- a/src/icons/contact.svg +++ /dev/null @@ -1,5 +0,0 @@ - - -contact - - diff --git a/src/icons/contacts.svg b/src/icons/contacts.svg new file mode 100644 index 0000000..3afaf01 --- /dev/null +++ b/src/icons/contacts.svg @@ -0,0 +1,5 @@ + + +contacts + + diff --git a/src/icons/email.svg b/src/icons/email.svg new file mode 100644 index 0000000..756ab79 --- /dev/null +++ b/src/icons/email.svg @@ -0,0 +1,5 @@ + + +email + + diff --git a/src/sass/_base.scss b/src/sass/_base.scss index 5d57020..9bd06f0 100644 --- a/src/sass/_base.scss +++ b/src/sass/_base.scss @@ -56,7 +56,7 @@ a { &:hover { background: $color-link; - color: $white!important; + color: $white !important; text-decoration: none; } @@ -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; - height: 1em; + width: 1.3em; + 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; } @@ -199,7 +200,7 @@ img { a:hover { background: none; text-decoration: underline; - color: $body-font-color!important; + color: $body-font-color !important; } } @@ -225,7 +226,7 @@ img { } &__tag { - margin: $padding-4 0!important; + margin: $padding-4 0 !important; .gblog-button__link { padding: $padding-4 $padding-8; @@ -239,7 +240,7 @@ img { &__anchorwrap { &:hover .gblog-post__anchor { background: none; - color: $gray-500!important; + color: $gray-500 !important; } } @@ -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 { @@ -282,7 +287,7 @@ img { &:hover { background: $color-link-footer; - color: $body-font-color!important; + color: $body-font-color !important; } &:visited { @@ -352,7 +357,7 @@ img { padding: 0; } - &__list{ + &__list { background: lighten($second-color, 10%); flex-direction: column; justify-content: center;