More cleanup, reworking category template
This commit is contained in:
		
							parent
							
								
									6bce3e3465
								
							
						
					
					
						commit
						739f2f1b90
					
				
					 5 changed files with 27 additions and 320 deletions
				
			
		| 
						 | 
					@ -10,7 +10,7 @@ layout: default
 | 
				
			||||||
            <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
 | 
					            <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
 | 
				
			||||||
                <div class="post-heading">
 | 
					                <div class="post-heading">
 | 
				
			||||||
                    <h1>{{ page.title }}</h1>
 | 
					                    <h1>{{ page.title }}</h1>
 | 
				
			||||||
                    <h2 class="subheading">Articles posted in {{ page.title }}</h2>
 | 
					                    <h2 class="subheading">Articles posted in '{{ page.title }}'</h2>
 | 
				
			||||||
                </div>
 | 
					                </div>
 | 
				
			||||||
            </div>
 | 
					            </div>
 | 
				
			||||||
        </div>
 | 
					        </div>
 | 
				
			||||||
| 
						 | 
					@ -24,20 +24,38 @@ layout: default
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                {% if site.categories[page.category] %}
 | 
					                {% if site.categories[page.category] %}
 | 
				
			||||||
                    {% for post in site.categories[page.category] %}
 | 
					                    {% for post in site.categories[page.category] %}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					                        <!-- Uncomment for listing by year
 | 
				
			||||||
                        {% capture post_year %}{{ post.date | date: '%Y' }}{% endcapture %}
 | 
					                        {% capture post_year %}{{ post.date | date: '%Y' }}{% endcapture %}
 | 
				
			||||||
                        {% if forloop.first %}
 | 
					                        {% if forloop.first %}
 | 
				
			||||||
                            <h3>{{ post_year }}</h3><ul>
 | 
					                            <h3>{{ post_year }}</h3>
 | 
				
			||||||
                        {% endif %}
 | 
					                        {% endif %}
 | 
				
			||||||
                  
 | 
					                  
 | 
				
			||||||
                        {% if forloop.first == false %}
 | 
					                        {% if forloop.first == false %}
 | 
				
			||||||
                            {% assign previous_index = forloop.index0 | minus: 1 %}
 | 
					                            {% assign previous_index = forloop.index0 | minus: 1 %}
 | 
				
			||||||
                            {% capture previous_post_year %}{{ site.categories[page.category][previous_index].date | date: '%Y' }}{% endcapture %}
 | 
					                            {% capture previous_post_year %}{{ site.categories[page.category][previous_index].date | date: '%Y' }}{% endcapture %}
 | 
				
			||||||
                            {% if post_year != previous_post_year %}
 | 
					                            {% if post_year != previous_post_year %}
 | 
				
			||||||
                                </div><h3>{{ post_year }}</h3><ul>
 | 
					                                </div><h3>{{ post_year }}</h3>
 | 
				
			||||||
                            {% endif %}
 | 
					                            {% endif %}
 | 
				
			||||||
                        {% endif %}
 | 
					                        {% endif %}
 | 
				
			||||||
 | 
					                        -->
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                        <li>
 | 
					                        <div class="post-preview">
 | 
				
			||||||
 | 
					                            <a href="{{ post.url | prepend: site.baseurl }}">
 | 
				
			||||||
 | 
					                                <h2 class="post-title">            {{ post.title }}
 | 
				
			||||||
 | 
					                                </h2>
 | 
				
			||||||
 | 
					                                {% if post.subtitle %}
 | 
				
			||||||
 | 
					                                <h3 class="post-subtitle">
 | 
				
			||||||
 | 
					                                    {{ post.subtitle }}
 | 
				
			||||||
 | 
					                                </h3>
 | 
				
			||||||
 | 
					                                {% endif %}
 | 
				
			||||||
 | 
					                            </a>
 | 
				
			||||||
 | 
					                            <p class="post-meta">Posted by {% if post.author %}{{ post.author }}{% else %}{{ site.title }}{% endif %} on {{ post.date | date: "%B %-d, %Y" }}</p>
 | 
				
			||||||
 | 
					                        </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					                        <hr>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					                        <!-- <li>
 | 
				
			||||||
                            <a href="{{ post.url }}/" class="read-more">
 | 
					                            <a href="{{ post.url }}/" class="read-more">
 | 
				
			||||||
                                {{ post.title }}
 | 
					                                {{ post.title }}
 | 
				
			||||||
                            </a>
 | 
					                            </a>
 | 
				
			||||||
| 
						 | 
					@ -46,6 +64,7 @@ layout: default
 | 
				
			||||||
                        {% if forloop.last %}
 | 
					                        {% if forloop.last %}
 | 
				
			||||||
                            </ul>
 | 
					                            </ul>
 | 
				
			||||||
                        {% endif %}
 | 
					                        {% endif %}
 | 
				
			||||||
 | 
					                    -->
 | 
				
			||||||
                    {% endfor %}
 | 
					                    {% endfor %}
 | 
				
			||||||
                {% else %}
 | 
					                {% else %}
 | 
				
			||||||
                    <p>There are no posts in this category.</p>
 | 
					                    <p>There are no posts in this category.</p>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,6 +1,6 @@
 | 
				
			||||||
---
 | 
					---
 | 
				
			||||||
layout: post
 | 
					layout: post
 | 
				
			||||||
title: Howto - Leverage 'Let's Encrypt' on Azure
 | 
					title: Using 'Let's Encrypt' Certificates with Azure
 | 
				
			||||||
subtitle: Create free valid SSL certificates in 20 minutes.
 | 
					subtitle: Create free valid SSL certificates in 20 minutes.
 | 
				
			||||||
category: howto
 | 
					category: howto
 | 
				
			||||||
tags: [security, cloud]
 | 
					tags: [security, cloud]
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,6 +1,6 @@
 | 
				
			||||||
---
 | 
					---
 | 
				
			||||||
layout: post
 | 
					layout: post
 | 
				
			||||||
title: Howto - Fluentd Log Parsing
 | 
					title: Better Log Parsing with Fluentd
 | 
				
			||||||
subtitle: Description of a couple of approaches to designing your fluentd configuration.
 | 
					subtitle: Description of a couple of approaches to designing your fluentd configuration.
 | 
				
			||||||
category: howto
 | 
					category: howto
 | 
				
			||||||
tags: [devops, logging]
 | 
					tags: [devops, logging]
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,18 +0,0 @@
 | 
				
			||||||
---
 | 
					 | 
				
			||||||
layout: default
 | 
					 | 
				
			||||||
---
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
<div class="posts">
 | 
					 | 
				
			||||||
  {% for post in site.posts %}
 | 
					 | 
				
			||||||
    <article class="post">
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
      <h1><a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></h1>
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
      <div class="entry">
 | 
					 | 
				
			||||||
        {{ post.excerpt }}
 | 
					 | 
				
			||||||
      </div>
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
      <a href="{{ site.baseurl }}{{ post.url }}" class="read-more">Read More</a>
 | 
					 | 
				
			||||||
    </article>
 | 
					 | 
				
			||||||
  {% endfor %}
 | 
					 | 
				
			||||||
</div>
 | 
					 | 
				
			||||||
							
								
								
									
										294
									
								
								style.scss.org
									
										
									
									
									
								
							
							
						
						
									
										294
									
								
								style.scss.org
									
										
									
									
									
								
							| 
						 | 
					@ -1,294 +0,0 @@
 | 
				
			||||||
---
 | 
					 | 
				
			||||||
---
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
//
 | 
					 | 
				
			||||||
// IMPORTS
 | 
					 | 
				
			||||||
//
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
@import "reset";
 | 
					 | 
				
			||||||
@import "variables";
 | 
					 | 
				
			||||||
// Syntax highlighting @import is at the bottom of this file
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
/**************/
 | 
					 | 
				
			||||||
/* BASE RULES */
 | 
					 | 
				
			||||||
/**************/
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
html {
 | 
					 | 
				
			||||||
  font-size: 100%;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
body {
 | 
					 | 
				
			||||||
	background: $white;
 | 
					 | 
				
			||||||
  font: 18px/1.4 $helvetica;
 | 
					 | 
				
			||||||
  color: $darkGray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.container {
 | 
					 | 
				
			||||||
  margin: 0 auto;
 | 
					 | 
				
			||||||
  max-width: 740px;
 | 
					 | 
				
			||||||
  padding: 0 10px;
 | 
					 | 
				
			||||||
  width: 100%;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
h1, h2, h3, h4, h5, h6 {
 | 
					 | 
				
			||||||
  font-family: $helveticaNeue;
 | 
					 | 
				
			||||||
  color: $darkerGray;
 | 
					 | 
				
			||||||
  font-weight: bold;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  line-height: 1.7;
 | 
					 | 
				
			||||||
  margin: 1em 0 15px;
 | 
					 | 
				
			||||||
  padding: 0;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  @include mobile {
 | 
					 | 
				
			||||||
    line-height: 1.4;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
h1 {
 | 
					 | 
				
			||||||
  font-size: 30px;
 | 
					 | 
				
			||||||
  a {
 | 
					 | 
				
			||||||
    color: inherit;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
h2 {
 | 
					 | 
				
			||||||
  font-size: 24px;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
h3 {
 | 
					 | 
				
			||||||
  font-size: 20px;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
h4 {
 | 
					 | 
				
			||||||
  font-size: 18px;
 | 
					 | 
				
			||||||
  color: $gray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
p {
 | 
					 | 
				
			||||||
  margin: 15px 0;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
a {
 | 
					 | 
				
			||||||
  color: $blue;
 | 
					 | 
				
			||||||
  text-decoration: none;
 | 
					 | 
				
			||||||
	cursor: pointer;
 | 
					 | 
				
			||||||
  &:hover, &:active {
 | 
					 | 
				
			||||||
    color: $blue;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ul, ol {
 | 
					 | 
				
			||||||
  margin: 15px 0;
 | 
					 | 
				
			||||||
  padding-left: 30px;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ul {
 | 
					 | 
				
			||||||
  list-style-type: disc;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ol {
 | 
					 | 
				
			||||||
  list-style-type: decimal;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ol ul, ul ol, ul ul, ol ol {
 | 
					 | 
				
			||||||
  margin: 0;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
ul ul, ol ul {
 | 
					 | 
				
			||||||
  list-style-type: circle;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
em, i {
 | 
					 | 
				
			||||||
  font-style: italic;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
strong, b {
 | 
					 | 
				
			||||||
  font-weight: bold;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
img {
 | 
					 | 
				
			||||||
  max-width: 100%;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
// Fixes images in popup boxes from Google Translate
 | 
					 | 
				
			||||||
.gmnoprint img {
 | 
					 | 
				
			||||||
  max-width: none;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.date {
 | 
					 | 
				
			||||||
  font-style: italic;
 | 
					 | 
				
			||||||
  color: $gray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.info {
 | 
					 | 
				
			||||||
  font-size: smaller;
 | 
					 | 
				
			||||||
  color: $gray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
// Specify the color of the selection
 | 
					 | 
				
			||||||
::-moz-selection {
 | 
					 | 
				
			||||||
  color: $black;
 | 
					 | 
				
			||||||
  background: $lightGray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
::selection {
 | 
					 | 
				
			||||||
  color: $black;
 | 
					 | 
				
			||||||
  background: $lightGray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
// Nicolas Gallagher's micro clearfix hack
 | 
					 | 
				
			||||||
// http://nicolasgallagher.com/micro-clearfix-hack/
 | 
					 | 
				
			||||||
.clearfix:before,
 | 
					 | 
				
			||||||
.clearfix:after {
 | 
					 | 
				
			||||||
    content: " ";
 | 
					 | 
				
			||||||
    display: table;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.clearfix:after {
 | 
					 | 
				
			||||||
    clear: both;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
/*********************/
 | 
					 | 
				
			||||||
/* LAYOUT / SECTIONS */
 | 
					 | 
				
			||||||
/*********************/
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
//
 | 
					 | 
				
			||||||
// .masthead
 | 
					 | 
				
			||||||
//
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.wrapper-masthead {
 | 
					 | 
				
			||||||
  margin-bottom: 50px;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.masthead {
 | 
					 | 
				
			||||||
  padding: 20px 0;
 | 
					 | 
				
			||||||
  border-bottom: 1px solid $lightGray;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  @include mobile {
 | 
					 | 
				
			||||||
    text-align: center;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.site-avatar {
 | 
					 | 
				
			||||||
  float: left;
 | 
					 | 
				
			||||||
  width: 70px;
 | 
					 | 
				
			||||||
  height: 70px;
 | 
					 | 
				
			||||||
  margin-right: 15px;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  @include mobile {
 | 
					 | 
				
			||||||
    float: none;
 | 
					 | 
				
			||||||
    display: block;
 | 
					 | 
				
			||||||
    margin: 0 auto;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  img {
 | 
					 | 
				
			||||||
    border-radius: 5px;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.site-info {
 | 
					 | 
				
			||||||
  float: left;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  @include mobile {
 | 
					 | 
				
			||||||
    float: none;
 | 
					 | 
				
			||||||
    display: block;
 | 
					 | 
				
			||||||
    margin: 0 auto;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.site-name {
 | 
					 | 
				
			||||||
  margin: 0;
 | 
					 | 
				
			||||||
  color: $darkGray;
 | 
					 | 
				
			||||||
  cursor: pointer;
 | 
					 | 
				
			||||||
  font-family: $helveticaNeue;
 | 
					 | 
				
			||||||
  font-weight: 300;
 | 
					 | 
				
			||||||
  font-size: 28px;
 | 
					 | 
				
			||||||
  letter-spacing: 1px;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.site-description {
 | 
					 | 
				
			||||||
  margin: -5px 0 0 0;
 | 
					 | 
				
			||||||
  color: $gray;
 | 
					 | 
				
			||||||
  font-size: 16px;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  @include mobile {
 | 
					 | 
				
			||||||
    margin: 3px 0;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
nav {
 | 
					 | 
				
			||||||
  float: right;
 | 
					 | 
				
			||||||
  margin-top: 23px; // @TODO: Vertically middle align
 | 
					 | 
				
			||||||
  font-family: $helveticaNeue;
 | 
					 | 
				
			||||||
  font-size: 18px;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  @include mobile {
 | 
					 | 
				
			||||||
    float: none;
 | 
					 | 
				
			||||||
    margin-top: 9px;
 | 
					 | 
				
			||||||
    display: block;
 | 
					 | 
				
			||||||
    font-size: 16px;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  a {
 | 
					 | 
				
			||||||
    margin-left: 20px;
 | 
					 | 
				
			||||||
    color: $darkGray;
 | 
					 | 
				
			||||||
    text-align: right;
 | 
					 | 
				
			||||||
    font-weight: 300;
 | 
					 | 
				
			||||||
    letter-spacing: 1px;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    @include mobile {
 | 
					 | 
				
			||||||
      margin: 0 10px;
 | 
					 | 
				
			||||||
      color: $blue;
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
//
 | 
					 | 
				
			||||||
// .main
 | 
					 | 
				
			||||||
//
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.posts > .post {
 | 
					 | 
				
			||||||
  padding-bottom: 2em;
 | 
					 | 
				
			||||||
  border-bottom: 1px solid $lightGray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.posts > .post:last-child {
 | 
					 | 
				
			||||||
  padding-bottom: 1em;
 | 
					 | 
				
			||||||
  border-bottom: none;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.post {
 | 
					 | 
				
			||||||
  blockquote {
 | 
					 | 
				
			||||||
    margin: 1.8em .8em;
 | 
					 | 
				
			||||||
    border-left: 2px solid $gray;
 | 
					 | 
				
			||||||
    padding: 0.1em 1em;
 | 
					 | 
				
			||||||
    color: $gray;
 | 
					 | 
				
			||||||
    font-size: 22px;
 | 
					 | 
				
			||||||
    font-style: italic;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  .comments {
 | 
					 | 
				
			||||||
    margin-top: 10px;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  .read-more {
 | 
					 | 
				
			||||||
    text-transform: uppercase;
 | 
					 | 
				
			||||||
    font-size: 15px;
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
.wrapper-footer {
 | 
					 | 
				
			||||||
  margin-top: 50px;
 | 
					 | 
				
			||||||
  border-top: 1px solid #ddd;
 | 
					 | 
				
			||||||
  border-bottom: 1px solid #ddd;
 | 
					 | 
				
			||||||
  background-color: $lightGray;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
footer {
 | 
					 | 
				
			||||||
  padding: 20px 0;
 | 
					 | 
				
			||||||
  text-align: center;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
// Settled on moving the import of syntax highlighting to the bottom of the CSS
 | 
					 | 
				
			||||||
// ... Otherwise it really bloats up the top of the CSS file and makes it difficult to find the start
 | 
					 | 
				
			||||||
@import "highlights";
 | 
					 | 
				
			||||||
@import "svg-icons";
 | 
					 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue