1
0
mirror of https://github.com/danbee/danbarber.me.hugo.git synced 2025-03-04 08:59:18 +00:00

Add colourful logo

This commit is contained in:
Daniel Barber 2019-10-16 22:20:05 -04:00
parent 4698cd6e9c
commit 8e12a5f486
7 changed files with 55 additions and 3 deletions

View File

@ -0,0 +1,22 @@
.logo__wrapper {
width: 140px;
line-height: 0;
margin-bottom: 1em;
}
.logo__color_1 {
fill: #ff6800;
}
.logo__color_2 {
fill: #e8ff00;
}
.logo__color_3 {
fill: #00a9ff;
}
.logo__color_4 {
fill: #b346e2;
}

View File

@ -7,6 +7,10 @@
} }
} }
.site-header__container {
@include container;
}
.site-header__home-link { .site-header__home-link {
color: inherit; color: inherit;
} }

View File

@ -38,6 +38,7 @@
@import "components/posts"; @import "components/posts";
@import "components/post"; @import "components/post";
@import "components/photos"; @import "components/photos";
@import "components/logo";
// 7. Utilities utilities and helper classes with ability to override // 7. Utilities utilities and helper classes with ability to override
// anything which goes before in the triangle, eg. hide helper class // anything which goes before in the triangle, eg. hide helper class

View File

@ -1,5 +1,7 @@
<header class="site-header" role="banner"> <header class="site-header" role="banner">
<div class="container"> <div class="site-header__container">
<h1><a class="site-header__home-link" href="/">{{.Site.Title}}</a></h1> <h1 class="logo__wrapper">
<a class="site-header__home-link" href="/">{{ partial "logo.svg" . }}</a>
</h1>
</div> </div>
</header> </header>

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 36 KiB

View File

@ -1,5 +1,5 @@
{{ define "main" }} {{ define "main" }}
<section class="photos outer"> <section class="photos">
<div class="photos__container"> <div class="photos__container">
{{ range (.Paginator 24).Pages }} {{ range (.Paginator 24).Pages }}
<article class="photos__thumb-container"> <article class="photos__thumb-container">

View File

@ -380,6 +380,11 @@ pre {
.site-header { .site-header {
border-bottom: 1px dashed #ddd; } } border-bottom: 1px dashed #ddd; } }
.site-header__container {
margin-left: auto;
margin-right: auto;
max-width: 40rem; }
.site-header__home-link { .site-header__home-link {
color: inherit; } color: inherit; }
@ -447,3 +452,20 @@ pre {
.photos__thumb { .photos__thumb {
border-radius: 0.25rem; border-radius: 0.25rem;
width: 100%; } width: 100%; }
.logo__wrapper {
width: 140px;
line-height: 0;
margin-bottom: 1em; }
.logo__color_1 {
fill: #ff6800; }
.logo__color_2 {
fill: #e8ff00; }
.logo__color_3 {
fill: #00a9ff; }
.logo__color_4 {
fill: #b346e2; }