sr-rolando/rolandjesse.de
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Merge pull request #56 from joariasl/master

Browse source 
Complete refactorization for css/grayscale.scss and sorted sections in index.html Fixes #40 #48 #57
This commit is contained in:
Panos Sakkos 2015-11-14 02:26:55 +01:00
commit 4ba5b714a5
18 changed files with 149 additions and 229 deletions
Download patch file Download diff file Expand all files Collapse all files

4
_config.yml
View file

@ -118,7 +118,7 @@ social:
pages_list:
About: 'about'
Blog: 'blog'
Blog: 'latest-post'
Career: 'career'
Contact: 'contact'
@ -130,6 +130,6 @@ sass:
style: compressed
# Exclusion list from the generated _site
exclude: ["Rakefile", "LICENSE", "readme.markdown", "vendor"]
exclude: ["LICENSE", "README", "CONTRIBUTORS", "scripts"]
gems: [jekyll-paginate]

2
_includes/about.html
View file

@ -1,7 +1,7 @@
<!-- About Start -->
<section id="{{ page.title }}" class="container content-section text-center">
<section id="{{ page.section-type }}" class="container content-section text-center">
<div class="row">
<div class="col-lg-10 col-lg-offset-1">
{{ page.content | markdownify }}

2
_includes/career.html
View file

@ -1,7 +1,7 @@
<!-- Career Start -->
<section id="{{ page.title }}" class="container content-section text-center">
<section id="{{ page.section-type }}" class="container content-section text-center">
<div class="row">
<div class="col-lg-10 col-lg-offset-1">

2
_includes/contact.html
View file

@ -1,7 +1,7 @@
<!-- Contact Start -->
<section id="{{ page.title }}" class="container content-section text-center">
<section id="{{ page.section-type }}" class="container content-section text-center">
<div class="row">
<div class="col-lg-10 col-lg-offset-1">

2
_includes/head.html
View file

@ -27,7 +27,9 @@
<!-- Custom CSS -->
<link href="{{site.baseurl}}/css/grayscale.css" rel="stylesheet">
{% if page.section-type == "index" %}
<link href="{{site.baseurl}}/css/timeline.css" rel="stylesheet">
{% endif %}
<!-- Custom Fonts -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

6
_includes/js.html
View file

@ -14,7 +14,11 @@
<!--* Start Bootstrap - Grayscale Bootstrap Theme (http://startbootstrap.com)
* Code licensed under the Apache License v2.0.
* For details, see http://www.apache.org/licenses/LICENSE-2.0.-->
<script>$(window).scroll(function(){50<$(".navbar").offset().top?$(".navbar-fixed-top").addClass("top-nav-collapse"):$(".navbar-fixed-top").removeClass("top-nav-collapse")});$(function(){$("a.page-scroll").bind("click",function(b){var a=$(this);$("html, body").stop().animate({scrollTop:$(a.attr("href")).offset().top},1500,"easeInOutExpo",function(){a.blur()});b.preventDefault()})});$(".navbar-collapse ul li a").click(function(){$(".navbar-toggle:visible").click()});</script>
<script>
function toggleNavCollapse(){50<$(".navbar").offset().top?$(".navbar-fixed-top").addClass("top-nav-collapse"):$(".navbar-fixed-top").removeClass("top-nav-collapse");}
$(document).ready(toggleNavCollapse);
$(window).scroll(toggleNavCollapse);$(function(){$("a.page-scroll").bind("click",function(b){var a=$(this);$("html, body").stop().animate({scrollTop:$(a.attr("href")).offset().top-50},1500,"easeInOutExpo",function(){a.blur()});b.preventDefault()})});$(".navbar-collapse ul li a").click(function(){$(".navbar-toggle:visible").click()});
</script>
{% if site.google-tracking-id %}

2
_includes/latest-post.html
View file

@ -1,7 +1,7 @@
<!-- Latest Post Preview Start -->
<section id="{{ page.title }}" class="container content-section text-center">
<section id="{{ page.section-type }}" class="container content-section text-center">
<div class="row">
<div class="col-lg-10 col-lg-offset-1">

27
_includes/navigation.html
View file

@ -13,42 +13,31 @@
<a class="navbar-brand page-scroll" href="{{site.baseurl}}/index.html#page-top">
{% endif %}
<div>{% if site.black-favicon %}<img src="{{site.baseurl}}{{ site.black-favicon }}" alt=""> {% endif %}{{ site.title }}</div>
</a>
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-right navbar-main-collapse">
<ul class="nav navbar-nav">
<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
<li class="hidden">
<a href="#page-top"></a>
</li>
{% if page.section-type == "index" %}
<!-- Scroll to section for each page in index -->
{% for p in site.pages_list %}
<li>
<a class="page-scroll" href="#{{ p[1] }}"> {{ p[0] }} </a>
<a class="page-scroll" href="#{{ p[1] }}"> {{ p[0] }}</a>
</li>
{% endfor %}
{% else %}
<!-- Blog, Post, Tag pages-->
{% for p in site.pages_list %}
{% if page.section-type == "blog" and p[0] == "Blog" %}
<!-- Blog button in blog.html doesn't refresh the page -->
<li>
<a class="page-scroll" href="#blog"> {{ p[0] }} </a>
</li>
{% elsif p[0] == "Blog" %}
<li>
<a class="page-scroll" href="{{site.baseurl}}/blog/index.html"> {{ p[0] }} </a>
</li>
<li>
{% comment %} If are blog, redirect to index.html of Blog {% endcomment %}
{% if p[1] == "latest-post" %}
<a class="page-scroll" href="{{site.baseurl}}/blog/index.html"> {{ p[0] }}</a>
{% else %}
<li>
<a class="page-scroll" href="{{site.baseurl}}/index.html#{{ p[1] }}"> {{ p[0] }} </a>
</li>
<a class="page-scroll" href="{{site.baseurl}}/index.html#{{ p[1] }}"> {{ p[0] }}</a>
{% endif %}
</li>
{% endfor %}
{% endif %}
</ul>

10
_includes/pagination.html
View file

@ -4,17 +4,21 @@
<div class="pagination">
<h4>
{% if paginator.previous_page %}
<a href="{{site.baseurl}}{{ paginator.previous_page_path }}" class="previous">Newer Posts</a>
{% endif %}
{% if paginator.previous_page and paginator.next_page %}
|
{% endif %}
{% if paginator.next_page %}
<a href="{{site.baseurl}}{{ paginator.next_page_path }}" class="next">Older Posts</a>
{% endif %}
</h4>
</div>
<!-- Pagination Links End -->

12
_layouts/blog.html
View file

@ -6,18 +6,18 @@
{% include head.html %}
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<body>
{% include navigation.html %}
<section id="{{ page.title }}" class="container content-section text-center">
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-lg-10 col-lg-offset-1">
{{ page.content | markdownify }}
{% for post in paginator.posts %}
<h4 align="left"><strong>{{ post.date | date_to_string }}</strong> <small>. {{ post.category }} .</small> <a href="{{site.baseurl}}{{post.url}}"> <strong>{{ post.title }} </strong> </a> <small><a href="{{site.baseurl}}{{post.url}}#disqus_thread">Comments</a></small></h4>
<h4 align="left"><strong>{{ post.date | date_to_string }}</strong> <small>. {{ post.category }} .</small> <a href="{{site.baseurl}}{{post.url}}"> <strong>{{ post.title }}</strong> </a> <small><a href="{{site.baseurl}}{{post.url}}#disqus_thread">Comments</a></small></h4>
{% endfor %}
{% include pagination.html %}
@ -26,9 +26,9 @@
</div>
</section>
<section id="{{ page.title }}" class="container content-section text-center">
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-lg-10 col-lg-offset-1">
{% include social-buttons.html %}
</div>
</div>

14
_layouts/error.html
View file

@ -6,13 +6,13 @@
{% include head.html %}
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<body>
{% include navigation.html %}
<section id="{{ page.title }}" class="container content-section text-center">
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-lg-10 col-lg-offset-1">
<h1><strong>{{ page.title }}</strong></h1>
@ -20,8 +20,14 @@
<img class="img-responsive center-block" src="{{site.baseurl}}{{ site.404-img }}" alt="">
{% include social-buttons.html %}
</div>
</div>
</section>
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-10 col-lg-offset-1">
{% include social-buttons.html %}
</div>
</div>
</section>

28
_layouts/index.html
View file

@ -6,32 +6,18 @@
{% include head.html %}
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top" data-offset="51">
{% include navigation.html %}
{% include header.html %}
{% for page in site.pages %}
{% if page.section-type == "about" %}
{% include about.html %}
{% elsif page.section-type == "latest-post" %}
{% include latest-post.html %}
{% elsif page.section-type == "career" %}
{% include career.html %}
{% elsif page.section-type == "contact" %}
{% include contact.html %}
{% endif %}
{% for p in site.pages_list %}
{% for page in site.pages %}
{% if p[1] == page.section-type%}
{% include {{ page.path }} %}
{% endif %}
{% endfor %}
{% endfor %}
{% include footer.html %}

10
_layouts/post.html
View file

@ -6,13 +6,13 @@
{% include head.html %}
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<body>
{% include navigation.html %}
<section id="{{ page.title }}" class="container content-section text-center">
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-lg-10 col-lg-offset-1">
<h1><strong>{{ page.title }}</strong></h1>
<h4><strong>{{ page.date | date_to_string }}</strong>
@ -33,9 +33,9 @@
</div>
</section>
<section id="{{ page.title }}" class="container content-section text-center">
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-lg-10 col-lg-offset-1">
{% include social-buttons.html %}
</div>
</div>

10
_layouts/tag.html
View file

@ -6,13 +6,13 @@
{% include head.html %}
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<body>
{% include navigation.html %}
<section id="{{ page.title }}" class="container content-section text-center">
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-lg-10 col-lg-offset-1">
<div id="archives">
<div>
@ -33,9 +33,9 @@
</div>
</section>
<section id="{{ page.title }}" class="container content-section text-center">
<section class="container content-section text-center">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-lg-10 col-lg-offset-1">
{% include social-buttons.html %}
</div>
</div>

10
_sass/_variables.scss
View file

@ -3,3 +3,13 @@
$primary: #fed136;
$dark: #000;
$light: #fff;
$header-text-shadow: true;
$header-background-color: $dark;
$intro-text-color: $light;
$navbar-color: $light;
$navbar-lg-collapse-background-color: $header-background-color;
$navbar-lg-background: transparent;
$navbar-sm-background-color: $navbar-lg-collapse-background-color;
$social-buttons-color: $primary;

234
css/grayscale.scss Executable file → Normal file
View file

@ -31,7 +31,7 @@ h5,
h6 {
margin: 0 0 35px;
text-transform: uppercase;
font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
font-family: "Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
font-weight: 700;
letter-spacing: 1px;
}
@ -40,10 +40,7 @@ p {
margin: 0 0 25px;
font-size: 18px;
line-height: 1.5;
}
@media(min-width:767px) {
p {
@media(min-width:768px) {
margin: 0 0 35px;
font-size: 20px;
line-height: 1.6;
@ -57,95 +54,85 @@ a {
transition: all .2s ease-in-out;
&:hover,
&:focus {
text-decoration: none;
color: darken($primary, 20%);
text-decoration: none;
color: darken($primary,20%);
}
}
.light {
font-weight: 400;
}
ul,
ol {
text-align: center;
margin: 0 0 35px;
font-size: 20px;
line-height: 1.5;
list-style-position: inside;
}
.navbar-custom {
margin-bottom: 0;
border-bottom: 1px solid rgba($light, 0.3);
text-transform: uppercase;
font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
background-color: $dark;
font-family: "Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
background-color: $navbar-sm-background-color;
/* Fix height limit and scroll for small screen and many items menu */
max-height: 100%;
overflow-y: auto;
.navbar-toggle {
padding: 4px 6px;
font-size: 16px;
color: $navbar-color;
&:focus,
&:active {
outline: none;
}
}
.navbar-brand {
font-weight: 700;
&:focus {
outline: none;
}
.navbar-toggle {
padding: 4px 6px;
font-size: 16px;
color: $light;
&:focus,
&:active {
outline: none;
}
&:focus {
outline: none;
}
}
a {
color: $light;
}
ul {
font-size: 14px;
color: $navbar-color;
@if $header-text-shadow{
text-shadow: 0 0 2px rgba(0, 0, 0, 0.8);
}
}
.nav {
text-align: center;
li {
&.active {
outline: nonte;
background-color: rgba($light, 0.3);
}
a {
-webkit-transition: background .3s ease-in-out;
-moz-transition: background .3s ease-in-out;
transition: background .3s ease-in-out;
&:hover,
&:hover {
/* color: rgba($light, 0.8); */
outline: none;
background-color: rgba($light, 0.3);
}
&:focus,
&.active {
&:active {
outline: none;
background-color: rgba($light, 0.3);
}
}
&.active {
outline: none;
a {
background-color: rgba($light, 0.3);
&:hover {
color: $navbar-color;
}
}
}
}
}
}
@media(min-width:767px) {
.navbar {
@media(min-width:768px) {
padding: 20px 0;
border-bottom: none;
letter-spacing: 1px;
background: transparent;
background: $navbar-lg-background;
-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
-moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
transition: background .5s ease-in-out,padding .5s ease-in-out;
}
.top-nav-collapse {
padding: 0;
background-color: $dark;
}
.navbar-custom.top-nav-collapse {
border-bottom: 1px solid rgba($light, 0.3);
&.top-nav-collapse {
padding: 0;
background: $navbar-lg-collapse-background-color;
border-bottom: 1px solid rgba($light, 0.3);
}
}
}
@ -155,9 +142,11 @@ ol {
height: auto;
padding: 100px 0;
text-align: center;
color: $light;
background: url( {{ site.background-img }} ) no-repeat bottom center scroll;
background-color: $dark;
color: $intro-text-color;
{% if site.background-img %}
background: url({{ site.background-img }}) no-repeat bottom center scroll;
{% endif %}
background-color: $header-background-color;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
@ -168,68 +157,27 @@ ol {
.brand-heading {
font-size: 40px;
}
.intro-text {
font-size: 18px;
@if $header-text-shadow {
text-shadow: 1px 0 1px #000;
}
}
}
}
@media(min-width:767px) {
.intro {
@media(min-width:768px) {
height: 100%;
padding: 0;
.intro-body {
.brand-heading {
font-size: 100px;
}
.intro-text {
font-size: 25px;
font-size: 26px;
}
}
}
}
.btn-circle {
width: 70px;
height: 70px;
margin-top: 15px;
padding: 7px 16px;
border: 2px solid $light;
border-radius: 35px;
font-size: 40px;
color: $light;
background: transparent;
-webkit-transition: background .3s ease-in-out;
-moz-transition: background .3s ease-in-out;
transition: background .3s ease-in-out;
&:hover,
&:focus {
outline: none;
color: $light;
background: rgba($light, 0.1);
}
i.animated {
-webkit-transition-property: -webkit-transform;
-webkit-transition-duration: 1s;
-moz-transition-property: -moz-transform;
-moz-transition-duration: 1s;
}
&:hover {
i.animated {
-webkit-animation-name: pulse;
-moz-animation-name: pulse;
-webkit-animation-duration: 1.5s;
-moz-animation-duration: 1.5s;
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-moz-animation-timing-function: linear;
}
}
}
@-webkit-keyframes pulse {
from {
-webkit-transform: scale(1);
@ -248,7 +196,7 @@ ol {
}
@-moz-keyframes pulse {
fom {
from {
-moz-transform: scale(1);
transform: scale(1);
}
@ -266,58 +214,30 @@ ol {
.content-section {
padding-top: 100px;
}
.download-section {
width: 100%;
padding: 50px 0;
color: $light;
background: url(../img/downloads-bg.jpg) no-repeat center center scroll;
background-color: $dark;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
/* Added in { Personal } for responsive images in posts and section contents */
img {
display: block;
max-width: 100%;
height: auto;
}
/* Added in { Personal } */
ul,
ol {
text-align: center;
margin: 0 0 35px;
font-size: 20px;
line-height: 1.5;
list-style-position: inside;
}
}
@media(min-width:767px) {
.content-section {
padding-top: 250px;
}
.download-section {
padding: 100px 0;
}
#map {
height: 400px;
margin-top: 250px;
}
}
ul.banner-social-buttons {
margin-top: 0;
}
@media(max-width:1199px) {
ul.banner-social-buttons {
margin-top: 15px;
}
}
@media(max-width:767px) {
ul.banner-social-buttons {
li {
display: block;
margin-bottom: 20px;
padding: 0;
&:last-child {
margin-bottom: 0;
}
}
}
}
/* Added in { Personal } */
ul.social-buttons li a {
display: block;
width: 40px;
@ -326,7 +246,7 @@ ul.social-buttons li a {
font-size: 20px;
line-height: 40px;
outline: 0;
/* color: #fff; */
color: $social-buttons-color;
background-color: #222;
-webkit-transition: all .3s;
@ -337,7 +257,7 @@ ul.social-buttons li a {
&:focus,
&:active {
color: #222;
background-color: darken($primary, 10%);
background-color: darken($social-buttons-color, 10%);
}
}
@ -360,10 +280,6 @@ footer {
background: rgba($light, 0.2);
}
img {
max-width: 100%;
}
img::selection {
background: transparent;
}
@ -373,9 +289,10 @@ img::-moz-selection {
}
body {
webkit-tap-highlight-color: rgba($light, 0.2);
-webkit-tap-highlight-color: rgba($light, 0.2);
}
/* Added in { Personal } for Typed Cursor in Header */
.typed-cursor{
opacity: 1;
-webkit-animation: blink 0.7s infinite;
@ -397,3 +314,4 @@ body {
50% { opacity:0; }
100% { opacity:1; }
}
/* END Added in { Personal } for Typed Cursor in Header */

1
blog.html → latest-post.html
View file

@ -1,4 +1,5 @@
---
section-type: latest-post
title: Blog
---
## Blog

2
scripts/newpost
View file

@ -7,7 +7,7 @@ POSTS_DIR = '_posts/'
post = ARGV[0]
File.open(POSTS_DIR + Date.today.strftime("%Y-%m-%d-") + post + '.md', 'w') {|f| f.write(
"---\nlayout: post\nsection-type: post\ntitle: <Title>\ncategory: <Category>\ntags: [ '<tag1>', '<tag2>' ]\n---")
"---\nlayout: post\nsection-type: post\ntitle: Title\ncategory: Category\ntags: [ 'tag1', 'tag2' ]\n---")
}
puts('[+] Created ' + post + ' post')