i like this blogpost header more
This commit is contained in:
parent
ecc386087d
commit
a6a9a27fda
4 changed files with 56 additions and 22 deletions
1
Gemfile
1
Gemfile
|
@ -23,6 +23,7 @@ group :development do
|
||||||
gem 'adsf'
|
gem 'adsf'
|
||||||
gem 'highline'
|
gem 'highline'
|
||||||
gem 'terminal-notifier-guard'
|
gem 'terminal-notifier-guard'
|
||||||
|
gem 'terminal-notifier'
|
||||||
end
|
end
|
||||||
|
|
||||||
group :production do
|
group :production do
|
||||||
|
|
|
@ -84,6 +84,7 @@ GEM
|
||||||
sass (3.4.23)
|
sass (3.4.23)
|
||||||
shellany (0.0.1)
|
shellany (0.0.1)
|
||||||
slop (3.6.0)
|
slop (3.6.0)
|
||||||
|
terminal-notifier (1.7.1)
|
||||||
terminal-notifier-guard (1.7.0)
|
terminal-notifier-guard (1.7.0)
|
||||||
therubyracer (0.12.3)
|
therubyracer (0.12.3)
|
||||||
libv8 (~> 3.16.14.15)
|
libv8 (~> 3.16.14.15)
|
||||||
|
@ -112,6 +113,7 @@ DEPENDENCIES
|
||||||
kramdown
|
kramdown
|
||||||
nanoc (= 4.7.4)
|
nanoc (= 4.7.4)
|
||||||
sass
|
sass
|
||||||
|
terminal-notifier
|
||||||
terminal-notifier-guard
|
terminal-notifier-guard
|
||||||
therubyracer
|
therubyracer
|
||||||
w3c_validators
|
w3c_validators
|
||||||
|
|
|
@ -33,8 +33,41 @@ dl {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.blogwidth{
|
.blog-heading {
|
||||||
width: 75%;
|
display: flex;
|
||||||
margin:auto;
|
flex-direction: column;
|
||||||
word-wrap: normal;
|
|
||||||
|
.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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,22 +1,20 @@
|
||||||
<div class="heading">
|
<div class="blog-heading">
|
||||||
<h1 class="title is-1 has-text-centered">
|
<div class="titlewrap">
|
||||||
<%= item[:title] %>
|
<h1 class="title is-1 has-text-centered">
|
||||||
</h1>
|
<%= item[:title] %>
|
||||||
<% if item[:author] %>
|
</h1>
|
||||||
<h2 class="subtitle is-3 has-text-centered">
|
<% if item[:author] %>
|
||||||
<% if item[:lang] == :en %>
|
<h2 class="subtitle is-3 has-text-centered">
|
||||||
by
|
door <%= item[:author] %>
|
||||||
<% else %>
|
</h2>
|
||||||
door
|
|
||||||
<% end %>
|
<% end %>
|
||||||
<%= item[:author] %>
|
<div class="details">
|
||||||
</h2>
|
<small>
|
||||||
<% end %>
|
Geschreven op <%= item[:created_at] %><br>
|
||||||
<p class="has-text-centered">
|
Leestijd: <%= reading_time @item %>
|
||||||
<small>Geschreven op <%= item[:created_at] %></small><br>
|
</small>
|
||||||
Leestijd: <%= reading_time @item %>
|
</div>
|
||||||
</p>
|
</div>
|
||||||
<hr>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="columns">
|
<div class="columns">
|
||||||
|
|
Loading…
Reference in a new issue