design update based on gyorb/master #41

master
bickhaus 3 years ago
parent e65c6a3b8f
commit 4fd8032241

@ -13,6 +13,10 @@
* code block background now transparent
* date format now D Mon YYYY
* theme colors are changed via css file
* titles, tags, list of posts are not so dense as before
* default colors were fine tuned
* some other small layout changes
### Fixed
* fix breaking change in mainSections introduced in Hugo v0.57.0

@ -72,5 +72,5 @@ pygmentsCodeFences = true
twitter = "twitter id"
linkedin = "linkedin id"
email = "myemail"
theme_colors = "color-dark"
theme_colors = "default-dark" #uses color css file under static/css/default-dark.css
~~~~

@ -1,6 +1,6 @@
baseurl = "/"
title = "Hugo Themes"
copyright = "Copyright (c) 2008 - 2014, all rights reserved."
copyright = "Copyright (c) 2019, all rights reserved."
languageCode = "en-US"
canonifyurls = true
paginate = 3
@ -49,4 +49,4 @@ pygmentsCodeFences = true
#gitlab = "gitlab id"
twitter = "twitter id"
#linkedin = "linkedin id"
theme_colors = "color-dark"
theme_colors = "default-dark"

Binary file not shown.

Before

Width:  |  Height:  |  Size: 102 KiB

After

Width:  |  Height:  |  Size: 125 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 79 KiB

After

Width:  |  Height:  |  Size: 70 KiB

@ -1,7 +1,10 @@
<div class="content-item">
<a href="{{ .Permalink }}">
<div class="post-list"> <h3 class="title"> {{ .Title }} </h3> </div>
<div class="post-list"> <h3 class="title"> {{ .Title }} </h3> </div>
</a>
{{ partial "tags.html" . }}
<div class="date"> {{ .Date.Format "2 Jan 2006" }} </div>
<div class="meta">
{{ partial "tags.html" . }}
<div class="date"> {{ .Date.Format "2 Jan 2006" }} </div>
</div>
</div>

@ -6,12 +6,10 @@
<div class="content-list">
{{ range .Data.Pages.GroupByDate "2006" }}
<div class="content-list-date">{{ .Key }}</div>
{{ range .Pages }}
{{ .Render "li"}}
{{ end }}
{{ end }}
</div>
{{ partial "footer.html" . }}

@ -3,7 +3,9 @@
<header>
<h2 class="title"> <a href='{{ .Permalink }}'> {{ .Title }}</a> </h2>
<div class="meta">
<div class="date">
{{ .Date.Format "2 Jan 2006" }} - {{ .ReadingTime }} minutes
</div>
{{ partial "tags.html" . }}
</div>
@ -14,7 +16,7 @@
</div>
<div class="rmore">
<a href='{{ .Permalink }}' class="rmore">Read more ...</a>
<a href='{{ .Permalink }}' class="rmore">Read more</a>
</div>

@ -17,7 +17,7 @@
{{ if isset .Site.Params "theme_colors" }}
<link rel="stylesheet" href="/css/{{ .Site.Params.theme_colors }}.css" />
{{ else }}
<link rel="stylesheet" href="/css/color-dark.css" />
<link rel="stylesheet" href="/css/default-dark.css" />
{{ end }}
{{ template "_internal/google_analytics_async.html" . }}

@ -21,8 +21,9 @@
</nav>
<hr/>
</div>
{{ partial "social-links.html" . }}
</div>
</header>

@ -1,33 +0,0 @@
/*
* main green: #99cc66
* */
body { background: #101010; color: #dbdbdb; }
a { color: #dbdbdb; }
pre { background: #1D1F21; border: 1px solid #5C5C5C; border-radius: 5px; }
code { background: #1D1F21; }
blockquote { background: #1D1F21; border-left: 3px solid #99cc66; }
table { margin: 1em auto; border-collapse: collapse; }
table, th, td { border: 1px solid #5C5C5C; }
tr:hover { background: #1D1F21; }
th { background: #1D1F21; }
.siteTitle a { color: #99cc66; }
.post .content h1{ color: #99cc66; }
.post .content h2{ color: #99cc66; }
.post .content h3{ color: #99cc66; }
.post .content h4{ color: #99cc66; }
.post .content h5{ color: #99cc66; }
.post .content h6{ color: #99cc66; }
.post .content a:hover { color: #99cc66; }
.social-link:hover { color: #99cc66; }
.nav-item-title:hover { color: #99cc66; }
.tag a:hover { color: #99cc66; }
.copyright { color: #404040; }
.poweredby { color: #404040; }
.poweredby a { color: #404040; }
.post-preview .title a{ color: #99cc66; }
.content-item a:hover{ text-decoration: underline; color: #99cc66; }
.post-list .title { color: #99cc66; }
.rmore { color: #dbdbdb; }
.terms .term a:hover { text-decoration: underline; color: #99cc66; }

@ -2,13 +2,11 @@ body {
font-family: "Arial", Gadget, sans-serif;
counter-reset: heading;
margin: 0;
padding: 1em 0.5em 0.5em 0.5em;
}
.main {
margin: 0 auto;
max-width: 64em;
margin: auto;
max-width: 42em;
}
img {
@ -29,7 +27,7 @@ figcaption {
}
iframe {
max-width: 64em;
max-width: 42em;
display: block;
margin-left: auto;
margin-right: auto;
@ -40,24 +38,25 @@ li {
}
p {
line-height: 1.4em;
}
h1 { font-size: 2.75em;
h1 { font-size: 2em;
font-weight: normal;
}
h2 { font-size: 2.25em;
h2 { font-size: 1.5em;
font-weight: normal;
}
h3 { font-size: 2em;
h3 { font-size: 1.17em;
font-weight: normal;
}
h4 { font-size: 1.5em;
h4 { font-size: 1.12em;
font-weight: normal;
}
h5 { font-size: 1.25em;
h5 { font-size: .83em;
font-weight: normal;
}
h6 { font-size: 1em;
h6 { font-size: .75em;
font-weight: normal;
}
@ -122,7 +121,7 @@ th, td {
/* site title */
.siteTitle {
font-size: 3.5em;
font-size: 2.75em;
margin-bottom: 0.1em;
}
@ -139,6 +138,12 @@ th, td {
flex-flow: row wrap;
}
.post {
margin-top: 1.5em;
padding-left: 0.5em;
padding-right: 0.5em;
}
.post .title {
text-align: center;
}
@ -160,11 +165,11 @@ th, td {
}
.post .content h4{
margin: .5em 0em;
margin: .75em 0em;
}
.post .content h5{
margin: .5em 0em;
margin: .75em 0em;
}
.post .content p{
@ -191,6 +196,20 @@ th, td {
font-size: 0.9em;
}
.content-item {
margin-top: 0.5em;
padding: 0.1em 0.3em 0.5em 0.3em
}
.content-item .meta{
margin-top: 0.5em;
padding-top: 0.5em;
display: -webkit-flex;
display:flex;
flex-wrap: wrap;
justify-content: space-between;
}
.content-item .tags {
margin-bottom: 0.2em;
font-size: 0.7em;
@ -200,6 +219,7 @@ th, td {
font-size: 0.7em;
font-weight: bold;
white-space: nowrap;
text-align: right;
}
.post-footer-menu {
@ -279,7 +299,7 @@ th, td {
.social-link {
margin: 0.2em;
font-size: 1.5em;
font-size: 1.2em;
}
.social-link:hover {
@ -308,7 +328,7 @@ th, td {
}
.post-list .title {
margin-bottom: 0em;
margin: 0em;
}
.tag {
@ -323,9 +343,15 @@ th, td {
.post-preview {
text-decoration: none;
padding-bottom: 1em;
padding-left: 0.5em;
padding-right: 0.5em;
margin-top: 1.5em;
margin-bottom: 1.5em;
}
.post-preview .title {
margin-top: 0.3em;
margin-bottom: 0.3em;
}
@ -334,7 +360,8 @@ th, td {
}
.post-preview .summary {
margin-top: 0.2em;
margin-top: 1em;
margin-bottom: 0.5em;
line-height: 1.4em;
}
@ -349,8 +376,15 @@ th, td {
.post-preview .meta {
font-size: 0.8em;
font-weight: bold;
padding-bottom: 0.3em;
padding-top: 0.3em;
padding: 0.3em 1em 0.5em 1em;
text-align: left;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.post-preview .date {
font-weight: bold;
text-align: left;
}
@ -360,11 +394,24 @@ th, td {
}
.rmore {
margin-top: 0.5em;
white-space:nowrap;
text-decoration: underline;
text-align: right;
}
.rmore a {
border-radius: 0.2em;
padding: 0.3em;
}
/* terms list */
.terms {
border-radius: 0.2em;
width: 50%;
margin: auto;
margin-bottom: 1em;
}
.terms a {
font-size: 1.2em;
text-decoration: none;
@ -416,6 +463,7 @@ th, td {
.sitemap {
margin: auto;
width: 50%;
font-size: 1.4em;
}
@media only screen and (min-width: 400px) {

Loading…
Cancel
Save