ettore.dreucci/cocoa-eh-hugo-theme
1
0
Fork 0
mirror of https://github.com/Noettore/cocoa-eh-hugo-theme.git synced 2025-10-15 03:36:41 +02:00
Code Issues Packages Projects Releases Wiki Activity

Color changes to background and compensated colors

Browse Source 
* Fix overly dark shades
* Remove word count from posts
* Markup changes for single posts headers
* Rename config
* Fix page heading
This commit is contained in:
Nishanth Shanmugham
2015-10-03 18:31:59 -05:00
parent d99e82e683
commit 29a5b22882
5 changed files with 90 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
layouts/partials/header_only_narrow.html Normal file
View File

@@ -0,0 +1,64 @@
<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
{{ partial "head.html" . }}
<body lang="{{ .Site.Params.Lang }}">
<div class="section header narrow">
<div class="container">
<div class="content">
<nav>
<ul>
<a href="/posts"><li>Posts</li></a>
<a href="/about"><li>About</li></a>
<a href="/code"><li>Code</li></a>
</ul>
</nav>
<a href="/"><div class="name">{{ .Site.Params.Author }}</div></a>
</div>
</div>
</div>
<div class="section icons">
<div class="container">
<div class="content">
{{ if .Site.Params.GitHub }}
<a href="{{ .Site.Params.GitHub }}" target="_blank">
<i class="icon ion-social-github"></i>
</a>
{{ end }}
{{ if .Site.Params.Twitter }}
<a href="{{ .Site.Params.Twitter }}" target="_blank">
<i class="icon ion-social-twitter"></i>
</a>
{{ end }}
{{ if .Site.Params.LinkedIn }}
<a href="{{ .Site.Params.LinkedIn }}" target="_blank">
<i class="icon ion-social-linkedin"></i>
</a>
{{ end }}
{{ if .Site.Params.Facebook }}
<a href="{{ .Site.Params.Facebook }}" target="_blank">
<i class="icon ion-social-facebook larger"></i>
</a>
{{ end }}
{{ if .Site.Params.SoundCloud }}
<a href="{{ .Site.Params.SoundCloud }}" target="_blank">
<i class="icon ion-ios-musical-notes larger"></i>
</a>
{{ end }}
{{ if .Site.Params.Email }}
<a href="mailto:{{ .Site.Params.Email }}">
<i class="icon ion-ios-email larger"></i>
</a>
{{ end }}
</div>
</div>
</div>

1
layouts/partials/page-heading.html
View File

@@ -5,4 +5,3 @@
{{ .Title }}
{{ end }}
</div>

15
layouts/posts/single.html
View File

@@ -1,18 +1,17 @@
<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
{{ partial "head.html" . }}
<body lang="{{ .Site.Params.Lang }}">
{{ partial "header_only_narrow.html" . }}
<div class="section main post">
<div class="container">
<div class="content">
<div class="front-matter">
<a href="{{ .Permalink }}">{{ partial "page-heading.html" . }}</a>
<div class="title-container">
<div class="page-heading">
<a href="{{ .Permalink }}">{{ if .Params.heading }}{{ .Params.heading }}{{ else }}{{ .Title }}{{ end }}</a>
</div>
<div class="initials"><a href="{{ .Site.BaseUrl }}">{{ .Site.Params.Initials }}</a></div>
</div>
<div class="meta">
<div class="date">{{ .Date.Format .Site.Params.DateForm }}</div>
<div class="word-count"><div class="middot"></div>{{ if eq 1 .FuzzyWordCount }}{{ .FuzzyWordCount }} word{{ else }}{{ .FuzzyWordCount }} words{{ end }}</div>
<div class="reading-time"><div class="middot"></div>{{ if eq 1 .ReadingTime }}{{ .ReadingTime }} minute read{{ else }}{{ .ReadingTime }} minutes read{{ end }}</div>
</div>
</div>

21
main.less
View File

@@ -19,8 +19,11 @@
@black: #333;
@gray: #b7b7b7;
@accent: #0096cc;
@black-background: @black;
@accent: #0096cc; // jasonlong.me blue
@background: #f7f7f7;
@compensated-black: #555;
@compensated-gray: #999;
@compensated-gray-hover: @gray;
@white: #fefefe;
@milk: #fefefe;
@@ -170,7 +173,7 @@ body {
// Header section
.section.header {
background-color: @black-background;
background-color: @background;
.container {
.align-items(center);
@@ -185,7 +188,7 @@ body {
.name {
.heading();
color: @white;
color: @compensated-black;
}
nav {
@@ -214,11 +217,11 @@ body {
}
ul li {
color: @milk;
color: @compensated-gray;
.transition(~'color @{transition-speed-1} @{in-sine}');
&:hover {
color: @white
color: @compensated-gray-hover;
}
}
}
@@ -262,7 +265,7 @@ body {
// Icons
.section.icons {
background-color: @black-background;
background-color: @background;
.container {
.align-items(center);
@@ -273,7 +276,7 @@ body {
a {
margin-left: 6px;
margin-right: 6px;
color: @milk;
color: @compensated-gray;
.transition(~'color @{transition-speed-1} @{in-sine}');
&:first-child {
@@ -285,7 +288,7 @@ body {
}
&:hover {
color: @white;
color: @compensated-gray-hover;
}
.icon {

14
static/css/main.css
View File

@@ -150,7 +150,7 @@ body {
}
}
.section.header {
background-color: #333333;
background-color: #f7f7f7;
}
.section.header .container {
-webkit-align-items: center;
@@ -187,7 +187,7 @@ body {
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
color: #333333;
color: #fefefe;
color: #555555;
}
.section.header nav {
font-size: 13px;
@@ -214,14 +214,14 @@ body {
margin-right: 0;
}
.section.header nav ul li {
color: #fefefe;
color: #999999;
-webkit-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
-moz-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
-ms-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
-o-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
}
.section.header nav ul li:hover {
color: #fefefe;
color: #b7b7b7;
}
@media (min-width: 550px) {
.section.header {
@@ -257,7 +257,7 @@ body {
}
}
.section.icons {
background-color: #333333;
background-color: #f7f7f7;
}
.section.icons .container {
-webkit-align-items: center;
@@ -272,7 +272,7 @@ body {
.section.icons .content a {
margin-left: 6px;
margin-right: 6px;
color: #fefefe;
color: #999999;
-webkit-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
-moz-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
-ms-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
@@ -285,7 +285,7 @@ body {
margin-right: 0;
}
.section.icons .content a:hover {
color: #fefefe;
color: #b7b7b7;
}
.section.icons .content a .icon {
font-size: 16px;