Skip to content

Commit

Permalink
Implemented the new layout for blog pages
Browse files Browse the repository at this point in the history
  • Loading branch information
@olakara
olakara committed Jun 28, 2014
1 parent 98231da commit 5607e1f
Show file tree
Hide file tree
Showing 9 changed files with 154 additions and 172 deletions.
2 changes: 1 addition & 1 deletion _config.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,4 +31,4 @@ navigation:
url: /about/

# Custom vars
version: 0.5.5
version: 0.6.0
36 changes: 15 additions & 21 deletions _includes/footer.html
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,15 @@
<footer>
<div class="container">
<div class="row">
<div class="col-ms-12 text-center">
<a href="#"> About Me </a>&nbsp;<i class="fa fa-asterisk"></i>&nbsp;<a href="#"> Blog </a>&nbsp;<i class="fa fa-asterisk"></i>&nbsp; <a href="#"> Contact Me </a> <br/>
<hr/>
&copy; {{ site.time | date: '%Y' }} - {{site.author}}. All rights reserved.
</div>
</div>
</div>
</footer>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', '{{site.gahandler}}', 'blog-olakara.rhcloud.com');
ga('send', 'pageview');

</script>
<footer class="row">
<div class="col-ms-12 text-center">
<hr/>
&copy; {{ site.time | date: '%Y' }} - {{site.author}}. All rights reserved.
</div>
</footer>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', '{{site.gahandler}}', 'blog-olakara.rhcloud.com');
ga('send', 'pageview');
</script>
4 changes: 0 additions & 4 deletions _layouts/master.html
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,7 @@
<!DOCTYPE html>
<html class="no-js">

{% include head.html %}

<body>
{{ content }}

{% include footer.html %}
</body>
</html>
12 changes: 7 additions & 5 deletions _layouts/page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,15 @@
<div class="container">

<header class="row">
<div class="col-md-12">
<a href="http://blog-olakara.rhcloud.com/">
<div class="col-md-12 col-xs-12">
<h1>
<a href="http://blog-olakara.rhcloud.com">
<div class="icon icon-back" style="width: 48px;height: 48px;float: left;"></div>
</a>
<h1>{{ page.title }}</h1>
&nbsp;&nbsp;&nbsp; {{page.title}}
</a>
</h1>
</div>
</header>
</header>

<div class="row">
<article class="col-md-12 justified">
Expand Down
151 changes: 69 additions & 82 deletions _layouts/post.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,86 +2,73 @@
layout: master
---

<div class="container">

<header class="row">
<div class="col-md-12 col-xs-12">
<h1>
<a href="http://blog-olakara.rhcloud.com">
<div class="icon icon-back" style="width: 48px;height: 48px;float: left;"></div>
&nbsp;&nbsp;&nbsp; Abdel Raoof's Blog
</a>
</h1>
</div>
</header>


<div class="row">
<article class="col-md-12 col-xs-12 justified">
<h1 class="post-title">{{ page.title }}</h1>
<div class="publish-tag">
<span class="fa fa-calendar"></span>&nbsp;Published On {{ page.date | date: "%B %d, %Y" }}
<div class="container-fluid" style="min-height:100%;overflow:hidden">
<div class="row">
<div class="hidden-xs col-md-2 blue colx">
<aside>
<div class="row">
<div class="col-md-12 text-center">
<h1><a href="{{sit.url}}/blog" style="color:white;text-decoration:none">Blog</a></h1>
</div>
</div>
</aside>
</div>
<div class="col-md-10 colx">
<article class="col-md-12 col-xs-12 justified">
<h1 class="post-title">{{ page.title }}</h1>
<div class="publish-tag">
<span class="fa fa-calendar"></span>&nbsp;Published On {{ page.date | date: "%B %d, %Y" }}
</div>
{{ content }}
<br/>
<span class="fa fa-tag"></span>Tags:
{% if page.tags %}
{% for tag in page.tags %}
<a href="/tags/{{tag}}"><span class="label label-primary">{{tag}}</span></a>
{% endfor %}
{% else %}
None
{% endif %}
<br/><br/>
<h4>Comments:</h4>
<div id="disqus_thread"></div>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = 'testingblogo';

/* * * DON'T EDIT BELOW THIS LINE * * */
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
</article>



<div class="row">
<div class="col-sm-6 col-xs-6 text-left">
{% if page.previous.url %}
<a class="btn btn-primary" href="{{page.previous.url}}">← Previous</a>
{% else %}
<span class="btn btn-primary disabled">← Previous</span>
{% endif %}
</div>
<div class="col-sm-6 col-xs-6 text-right">
{% if page.next.url %}
<a class="btn btn-primary" href="{{page.next.url}}">Next →</a>
{% else %}
<span class="btn btn-primary disabled">Next →</span>
{% endif %}
</div>
</div>
</div>

{% include footer.html %}
</div>
</div>
{{ content }}
<br/>
<span class="fa fa-tag"></span>Tags:
{% if page.tags %}
{% for tag in page.tags %}
<a href="/tags/{{tag}}"><span class="label label-primary">{{tag}}</span></a>
{% endfor %}
{% else %}
None
{% endif %}
<br/><br/>
<div class="row">
<div class="col-sm-6 col-xs-6 text-left">
{% if page.previous.url %}
<a class="btn btn-primary" href="{{page.previous.url}}">← Previous</a>
{% else %}
<span class="btn btn-primary disabled">← Previous</span>
{% endif %}
</div>
<div class="col-sm-6 col-xs-6 text-right">
{% if page.next.url %}
<a class="btn btn-primary" href="{{page.next.url}}">Next →</a>
{% else %}
<span class="btn btn-primary disabled">Next →</span>
{% endif %}
</div>
</div>
<br/><br/>
<h4>Comments:</h4>
<div id="disqus_thread"></div>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = 'testingblogo';

/* * * DON'T EDIT BELOW THIS LINE * * */
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>

</article>
</div>

<div class="related">
<h4>Related Posts:</h4>
<ul class="related-posts">
{% for post in site.related_posts limit:3 %}
<li>
<h6>
<a href="{{ post.url }}">
{{ post.title }}
<small>{{ post.date | date_to_string }}</small>
</a>
</h6>
</li>
{% endfor %}
</ul>
</div>



12 changes: 6 additions & 6 deletions assets/css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,10 @@
text-decoration:none !important;
}

.colx {
margin-bottom:-9999px;padding-bottom:9999px;
}

.container > header {
color: #2672EC;
}
Expand All @@ -27,15 +31,10 @@
margin-bottom: 30px;
height: 160px;
}

.title {
margin-top: 0px;
}


.purple, .blue, .red, .orange, .green {
color: #fff;
}
}

.purple {
background: #5133AB;
Expand All @@ -62,6 +61,7 @@
background-repeat: no-repeat;
list-style: none outside none;
}

.icon-twitter{background-position:0px 0px ; width: 128px ; height: 128px; }
.icon-facebook{background-position:-138px 0px ; width: 128px ; height: 128px; }
.icon-googleplus{background-position:-276px 0px ; width: 128px ; height: 128px; }
Expand Down
4 changes: 2 additions & 2 deletions assets/css/bootstrap.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ html {
}
body {
margin: 0;
height: 100%;
}
article,
aside,
Expand Down Expand Up @@ -3635,8 +3636,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
.label {
display: inline;
padding: .2em .6em .3em;
font-size: 75%;
font-weight: bold;
font-size: 100%;
line-height: 1;
color: #ffffff;
text-align: center;
Expand Down
Binary file modified assets/images/icon.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
105 changes: 54 additions & 51 deletions blog/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,55 +4,58 @@
---


<div class="container">

<header class="row">
<div class="col-md-12">
<h1>
<a href="http://blog-olakara.rhcloud.com">
<div class="icon icon-back" style="width: 48px;height: 48px;float: left;"></div>
&nbsp;&nbsp;&nbsp; Abdel Raoof's Blog
</a>
</h1>
</div>
</header>

<div class="row">
{% for post in paginator.posts %}
<article class="col-md-12 justified">
<h1 class="post-title">
<a href="{{site.baseurl}}{{ post.url }}">
{{ post.title }}
</a>
</h1>
<div class="publish-tag">
<span class="fa fa-calendar"></span>&nbsp;PUBLISHED ON {{ post.date | date: "%B %d, %Y" }}
</div>
<br/>
{{ post.content }}
</article>
{% endfor %}
</div>
<br/>
<div class="container-fluid" style="min-height:100%;overflow:hidden">
<div class="row">
<div class="hidden-xs col-md-2 blue colx">
<aside>
<div class="row">
<div class="col-md-12 text-center">
<h1><a href="{{sit.url}}/blog" style="color:white;text-decoration:none">Blog</a></h1>
</div>
</div>
</aside>
</div>
<div class="col-md-10 colx">
<div class="row">
{% for post in paginator.posts %}
<article class="col-md-12 justified">
<h1 class="post-title">
<a href="{{site.baseurl}}{{ post.url }}">
{{ post.title }}
</a>
</h1>
<div class="publish-tag">
<span class="fa fa-calendar"></span>&nbsp;PUBLISHED ON {{ post.date | date: "%B %d, %Y" }}
</div>
<br/>
{{ post.content }}
</article>
{% endfor %}
</div>
<br/>

<div class="row">
<div class="col-sm-6 text-left">
{% if paginator.next_page %}
<a class="btn btn-primary" href="{{paginator.next_page_path}}">← Older</a>
{% else %}
<span class="btn btn-primary disabled">← Older</span>
{% endif %}
</div>
<div class="col-sm-6 text-right">
{% if paginator.previous_page %}
{% if paginator.page == 2 %}
<a class="btn btn-primary" href="/blog/">Newer →</a>
{% else %}
<a class="btn btn-primary" href="{{paginator.previous_page_path}}">Newer →</a>
{% endif %}
{% else %}
<span class="btn btn-primary disabled">Newer →</span>
{% endif %}
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 text-left">
{% if paginator.next_page %}
<a class="btn btn-primary" href="{{paginator.next_page_path}}">← Older</a>
{% else %}
<span class="btn btn-primary disabled">← Older</span>
{% endif %}
</div>
<div class="col-sm-6 text-right">
{% if paginator.previous_page %}
{% if paginator.page == 2 %}
<a class="btn btn-primary" href="/blog/">Newer →</a>
{% else %}
<a class="btn btn-primary" href="{{paginator.previous_page_path}}">Newer →</a>
{% endif %}
{% else %}
<span class="btn btn-primary disabled">Newer →</span>
{% endif %}
</div>
</div>

{% include footer.html %}
</div>
</div>
</div>

0 comments on commit 5607e1f

Please sign in to comment.