Further work on the homepage

This commit is contained in:
Tetsuro
2015-01-27 15:06:23 -05:00
parent fe4253f872
commit 1fad0e2638
5 changed files with 110 additions and 118 deletions
-1
View File
@@ -5,7 +5,6 @@ layout: default
<header class="post-header">
<h1 class="post-title">{{ page.title }}</h1>
<p class="post-meta">{{ page.date | date: "%b %-d, %Y" }}{% if page.author %} • {{ page.author }}{% endif %}{% if page.meta %} • {{ page.meta }}{% endif %}</p>
</header>
<article class="post-content">
@@ -1,39 +0,0 @@
---
layout: post
title: "Test Post"
date: 2015-01-26 17:50:59
categories: liquid docs yo
---
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
This is a dummy paragraph. Find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `jekyll serve`, which launches a web server and auto-regenerates your site when a file is updated.
This is a dummy paragraph. Find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `jekyll serve`, which launches a web server and auto-regenerates your site when a file is updated.
This is a dummy paragraph. Find this post in your `_posts` directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run `jekyll serve`, which launches a web server and auto-regenerates your site when a file is updated.
> Blockquote
Code snippet:
{% highlight ruby %}
def print_hi(name)
puts "Hi, #{name}"
end
print_hi('Tom')
#=> prints 'Hi, Tom' to STDOUT.
{% endhighlight %}
Check out the [Jekyll docs][jekyll] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekylls GitHub repo][jekyll-gh]. If you have questions, you can ask them on [Jekylls dedicated Help repository][jekyll-help].
[jekyll]: http://jekyllrb.com
[jekyll-gh]: https://github.com/jekyll/jekyll
[jekyll-help]: https://github.com/jekyll/jekyll-help
+54 -17
View File
@@ -77,23 +77,60 @@ a {
}
}
/** Wrapper */
.wrapper {
max-width: $content-width;
margin-right: auto;
margin-left: auto;
padding-right: $spacing-unit;
padding-left: $spacing-unit;
@extend %clearfix;
h1 {
font-size: 2em;
}
/** Clearfix */
%clearfix {
&:after {
content: "";
display: table;
clear: both;
}
h2 {
font-size: 2em;
text-decoration: underline;
}
h3 {
font-size: 1.5em;
}
h4 {
font-size: 1.5em;
text-decoration: underline;
}
blockquote {
color: lighten($color-slate, 20);
border-left: 2px solid lighten($color-slate, 20);
padding-left: $spacing-unit / 2;
letter-spacing: -1px;
font-style: italic;
> :last-child {
margin-bottom: 0;
}
}
pre, code {
font-size: 15px;
border: 1px solid $color-blue-2;
border-radius: 3px;
background-color: lighten($color-blue-1, 0.9);
}
code {
padding: 1px 5px;
}
pre {
padding: 8px 12px;
> code {
border: 0;
padding-right: 0;
padding-left: 0;
}
}
hr {
display: block;
height: 1px;
border: 0;
background-color: lighten($color-slate, 40%);
}
+39 -55
View File
@@ -53,13 +53,28 @@ $on-laptop: 900px;
"syntax-highlighting"
;
* {
box-sizing: border-box;
}
/** Clearfix */
%clearfix {
&:after {
content: "";
display: table;
clear: both;
}
}
.wrapper {
max-width: $content-width;
margin-right: auto;
margin-left: auto;
padding-right: $spacing-unit;
padding-left: $spacing-unit;
@extend %clearfix;
}
/*============================================================================
Sidebar
==============================================================================*/
@@ -89,6 +104,16 @@ $on-laptop: 900px;
> ul {
margin: 0;
> li {
margin-bottom: $spacing-unit;
}
ul {
li {
margin-top: $spacing-unit/2;
}
}
}
li {
@@ -109,58 +134,17 @@ $on-laptop: 900px;
.content {
padding: $spacing-unit $spacing-unit $spacing-unit ($spacing-unit + $sidebar-width);
h1 {
font-size: 2em;
}
h2 {
font-size: 2em;
text-decoration: underline;
}
h3 {
font-size: 1.5em;
}
h4 {
font-size: 1.5em;
text-decoration: underline;
}
blockquote {
color: lighten($color-slate, 20);
border-left: 4px solid lighten($color-slate, 20);
padding-left: $spacing-unit / 2;
font-size: 18px;
letter-spacing: -1px;
font-style: italic;
> :last-child {
margin-bottom: 0;
}
}
pre, code {
font-size: 15px;
border: 1px solid $color-blue-2;
border-radius: 3px;
background-color: lighten($color-blue-1, 0.9);
}
code {
padding: 1px 5px;
}
pre {
padding: 8px 12px;
> code {
border: 0;
padding-right: 0;
padding-left: 0;
}
}
}
/*============================================================================
Index
==============================================================================*/
.home--banner {
h1 {
text-align: center;
font-weight: bold;
font-size: 5em;
}
}
+17 -6
View File
@@ -2,9 +2,20 @@
layout: default
---
{% for post in site.posts %}
<h2>
<a class="post-link" href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a>
</h2>
{{ post.content }}
{% endfor %}
<div class="home">
<header class="home--banner">
<h1>Liquid</h1>
<div>Ruby library for rendering safe templates which cannot affect the security of the server they are rendered on.</div>
</header>
<hr/>
{% for post in site.posts %}
<h2>
<a class="post-link" href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a>
</h2>
{{ post.content }}
{% endfor %}
</div>