i like this blogpost header more

This commit is contained in:
Lorin Werthen 2017-04-20 14:20:32 +02:00
parent ecc386087d
commit a6a9a27fda
No known key found for this signature in database
GPG key ID: F11FFC921E0E08E0
4 changed files with 56 additions and 22 deletions

View file

@ -23,6 +23,7 @@ group :development do
gem 'adsf'
gem 'highline'
gem 'terminal-notifier-guard'
gem 'terminal-notifier'
end
group :production do

View file

@ -84,6 +84,7 @@ GEM
sass (3.4.23)
shellany (0.0.1)
slop (3.6.0)
terminal-notifier (1.7.1)
terminal-notifier-guard (1.7.0)
therubyracer (0.12.3)
libv8 (~> 3.16.14.15)
@ -112,6 +113,7 @@ DEPENDENCIES
kramdown
nanoc (= 4.7.4)
sass
terminal-notifier
terminal-notifier-guard
therubyracer
w3c_validators

View file

@ -33,8 +33,41 @@ dl {
}
}
.blogwidth{
width: 75%;
margin:auto;
word-wrap: normal;
.blog-heading {
display: flex;
flex-direction: column;
.titlewrap {
position: relative;
margin: auto;
.title {
font-size: 4rem;
font-weight: bolder;
}
.subtitle {
position: absolute;
}
.details {
right: 0;
position: absolute;
margin-top: -1.1rem;
line-height: 1;
text-align: right;
}
}
&::after {
content: '';
width: 80px;
height: 1px;
margin-top: 30px;
margin-right: auto;
margin-left: auto;
margin-bottom: 30px;
display: block;
background: $zeus-orange;
}
}

View file

@ -1,22 +1,20 @@
<div class="heading">
<div class="blog-heading">
<div class="titlewrap">
<h1 class="title is-1 has-text-centered">
<%= item[:title] %>
</h1>
<% if item[:author] %>
<h2 class="subtitle is-3 has-text-centered">
<% if item[:lang] == :en %>
by
<% else %>
door
<% end %>
<%= item[:author] %>
door <%= item[:author] %>
</h2>
<% end %>
<p class="has-text-centered">
<small>Geschreven op <%= item[:created_at] %></small><br>
<div class="details">
<small>
Geschreven op <%= item[:created_at] %><br>
Leestijd: <%= reading_time @item %>
</p>
<hr>
</small>
</div>
</div>
</div>
<div class="columns">