Mic92/blog
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

1. Updated readme

Browse Source 
2. Improved blog typography
3. Improved support for Disqus
4. Removed unnecessary page layout
This commit is contained in:
Brandon Mathis 2011-06-20 16:44:04 -04:00
parent f77db80077
commit 5d61b46358
13 changed files with 110 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
README.markdown
View File

@ -42,7 +42,13 @@ which tells Jekyll how to processes posts and pages.
Octopress adds some custom paramaters to give you more publishing flexibility and you can [read about those here](#include_link),
but for now. Go ahead and type up a sample post or use some [inspired filler](http://baconipsum.com/).
### Generate Your Blog
{% pullquote %}
When writing longform posts, I find it helpful to include pullquotes, which help those scanning a post discern whether or not a post is helpful.
It is important to note, {" pullquotes are merely visual in presentation and should not appear twice in the text. "} That is why it is prefered
to use a CSS only technique for styling pullquotes.
{% endpullquote %}
## Generate Your Blog
rake preview

46
themes/classic/sass/default/core/_theme.scss
View File

@ -5,8 +5,6 @@ $link-color-visited: darken(adjust_hue($link_color, 70), 10) !default;
$link-color-active: darken($link-color-hover, 15) !default;
// Main Section Colors
$body-color: #333333 !default;
$light-text: #999999 !default;
$page-bg: #252525 !default;
$article-border: #eeeeee !default;
$main-bg: #f5f5f5 !default;
@ -16,42 +14,42 @@ $header-border: lighten($header-bg, 15) !default;
$title-color: #f2f2f2 !default;
$subtitle-color: #aaa !default;
$type-color: #222 !default;
$type-color-light: #555 !default;
$text-color: #222 !default;
$text-color-light: #aaa !default;
$type-border: #ddd !default;
/* Navigation */
$nav-bg: #ccc !default;
$nav-color: darken($nav-bg, 38) !default;
$nav-color-hover: darken($nav-color, 25);
$nav-placeholder: desaturate(darken($nav-bg, 10), 15);
$nav-border: darken($nav-bg, 10);
$nav-border-top: lighten($nav-bg, 15);
$nav-border-bottom: darken($nav-bg, 25);
$nav-border-left: darken($nav-bg, 11);
$nav-border-right: lighten($nav-bg, 7);
$nav-color-hover: darken($nav-color, 25) !default;
$nav-placeholder: desaturate(darken($nav-bg, 10), 15) !default;
$nav-border: darken($nav-bg, 10) !default;
$nav-border-top: lighten($nav-bg, 15) !default;
$nav-border-bottom: darken($nav-bg, 25) !default;
$nav-border-left: darken($nav-bg, 11) !default;
$nav-border-right: lighten($nav-bg, 7) !default;
/* Sidebar colors */
$sidebar-bg: #eee !default;
$sidebar-link-color: $link-color !default;
$sidebar-link-color-hover: $link-color-hover !default;
$sidebar-color: change-color(mix($type-color, $sidebar-bg, 80), $hue: hue($sidebar-bg), $saturation: saturation($sidebar-bg)/2) !default;
$sidebar-border: desaturate(darken($sidebar-bg, 7), 10);
$sidebar-border: darken($sidebar-bg, 7);
$sidebar-link-color-subdued: lighten($sidebar-color, 20);
$sidebar-link-color-subdued-hover: $sidebar-link-color-hover;
$twitter-status-link: lighten($sidebar-link-color-subdued, 15);
$sidebar-color: change-color(mix($text-color, $sidebar-bg, 80), $hue: hue($sidebar-bg), $saturation: saturation($sidebar-bg)/2) !default;
$sidebar-border: desaturate(darken($sidebar-bg, 7), 10) !default;
$sidebar-border: darken($sidebar-bg, 7) !default;
$sidebar-link-color-subdued: lighten($sidebar-color, 20) !default;
$sidebar-link-color-subdued-hover: $sidebar-link-color-hover !default;
$twitter-status-link: lighten($sidebar-link-color-subdued, 15) !default;
$footer-color: #999999 !default;
$footer-bg: #ccc !default;
$footer-color: darken($footer-bg, 38);
$footer-color-hover: darken($footer-color, 10);
$footer-border-top: lighten($footer-bg, 15);
$footer-border-bottom: darken($footer-bg, 15);
$footer-link-color: darken($footer-bg, 38);
$footer-link-color-hover: darken($footer-color, 25);
$page-border-bottom: darken($footer-bg, 5);
$footer-color: darken($footer-bg, 38) !default;
$footer-color-hover: darken($footer-color, 10) !default;
$footer-border-top: lighten($footer-bg, 15) !default;
$footer-border-bottom: darken($footer-bg, 15) !default;
$footer-link-color: darken($footer-bg, 38) !default;
$footer-link-color-hover: darken($footer-color, 25) !default;
$page-border-bottom: darken($footer-bg, 5) !default;
// Form Colors
$fieldset-bg: #ececec;

8
themes/classic/sass/default/core/_typography.scss
View File

@ -19,7 +19,7 @@ body > header h1 {
body {
line-height: 1.5em;
color: $type-color;
color: $text-color;
@extend .serif;
}
@ -115,7 +115,7 @@ blockquote {
+ p > cite {
margin-left: $bq-margin;
text-align: right;
&:before { content: '– '; color: $type-color-light; }
&:before { content: '– '; color: $text-color-light; }
a { font-style: italic; }
}
}
@ -131,11 +131,11 @@ blockquote {
/* Pull out to the right, modular scale based margins. */
float: right;
width: 45%;
margin: 1em 0 1em 1.5em;
margin: .5em 0 1em 1.5em;
/* Baseline correction */
position: relative;
top: 6px;
top: 7px;
font-size: 1.4em;
line-height: 1.45em;
}

39
themes/classic/sass/default/partials/_blog.scss
View File

@ -14,11 +14,8 @@ $border: inline-image('dotted-border.png');
padding-top: 0;
}
}
time + .byline:before, .byline + time +time:before {
content: "\2022 ";
padding: 0 .3em 0 .2em;
display: inline-block;
@include opacity(.5);
.byline + time:before, time +time:before, .comments:before {
@extend .separator;
}
header {
position: relative;
@ -33,7 +30,7 @@ $border: inline-image('dotted-border.png');
}
p {
font-size: .9em;
color: $type-color-light;
color: $text-color-light;
margin: 0;
@extend .sans;
&.meta {
@ -82,9 +79,20 @@ $border: inline-image('dotted-border.png');
}
#disqus_thread { }
iframe.twitter-share-button {
//display: block;
//margin-top: .5em;
//padding: .2em 0;
position: relative;
top: .3em;
padding-left: .5em;
}
footer {
padding-top: 15px;
time, .author { color: $light-text; }
margin-top: 2em;
padding-top: 1em;
margin-bottom: 1.5em;
background: $border top left repeat-x;
time, .author { color: $text-color-light; @extend .sans; }
}
}
}
@ -103,10 +111,25 @@ article + article {
padding: .4em .8em;
margin-right: .5em;
text-decoration: none;
color: mix($text-color, $text-color-light);
@extend .serif;
@include transition(background-color, .5s);
&:hover {
background: $link-color-hover;
text-shadow: none;
color: $main-bg;
}
}
footer {
@extend .sans;
margin-top: 1em;
p.meta { color: $text-color-light; }
a { color: inherit; &:hover{ color: $link-color-hover;} }
}
}
.separator {
content: "\2022 ";
padding: 0 .4em 0 .2em;
display: inline-block;
}

2
themes/classic/sass/default/partials/_syntax.scss
View File

@ -69,10 +69,12 @@ p code {
white-space: no-wrap;
background: #fff;
font-size: .9em;
line-height: 1.5em;
color: #555;
border: 1px solid #ddd;
@include border-radius(.4em);
padding: 0 .3em;
margin: -1px 0;
}
.pre-code {

18
themes/classic/source/_includes/article.html
View File

@ -1,8 +1,3 @@
{% if page.author %}
{% assign author = page.author %}
{% else %}
{% assign author = site.author %}
{% endif %}
{% unless page.no_header %}
<header>
{% if index %}
@ -10,17 +5,18 @@
{% else %}
<h1 class="entry-title">{{ page.title | titlecase }}</h1>
{% endif %}
{% unless page.no_meta or !index %}<p class="meta">{% include post_meta.html %}</p>{% endunless %}
{% unless page.no_meta or !index %}<p class="meta">{% include post_date.html %}</p>{% endunless %}
</header>
{% endunless %}
{% if index %}
<div class="entry-content">{{ content | exerpt | smart_quotes }}</div>
<p><a rel="full-article" href="{{ page.url }}">Read on &rarr;</a></p>
<footer>
<p>
{% if content contains "<!-- more -->" or content contains "<!--more-->" %}
<a rel="full-article" href="{{ page.url }}">Read more &hellip;</a>
{% endif %}
{% include post_meta.html %}
<p class="meta">
{% include post_author.html %}
{% include post_date.html %}
<span class="comments"><a rel="comments" href="{{ page.url }}#disqus_thread">Add a comment</a></span>
{% include sharing.html %}
</p>
</footer>
{% else %}

16
themes/classic/source/_includes/disqus_thread.html
View File

@ -1,7 +1,13 @@
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_url = "{{ site.url }}{{ page.url }}";
var disqus_shortname = '{{ site.disqus_short_name }}';
var disqus_identifier = '{{ site.url }}{{ page.url }}';
var disqus_url = '{{ site.url }}{{ page.url }}';
var disqus_developer = 1;
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>
<a href="http://{{ site.disqus_short_name }}.disqus.com/?url=ref">View the discussion thread</a>
</noscript>
<script type="text/javascript" src="http://disqus.com/forums/{{ site.disqus_short_name }}/embed.js"></script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

7
themes/classic/source/_includes/post_meta.html
View File

@ -1,7 +0,0 @@
{% if page.date %}
<time datetime="{{ page.date | datetime }}" pubdate {% if page.updated %} updated {% endif %}>{{ page.date | ordinalize }}</time>
{% endif %}
{% if page.updated %}
<time class="updated" datetime="{{ page.updated | datetime }}"></time>
{% endif %}
{% if author %}<span class="byline author vcard"><span class="fn">{{ author }}</span></span>{% endif %}

12
themes/classic/source/_layouts/page.html
View File

@ -1,13 +1,5 @@
---
layout: default
no_title_link: true
permalink: pretty
single: true
layout: post
---
<article>
{% include article.html %}
{% if site.disqus_short_name %}
<div id="disqus_thread">{% include disqus_thread.html %}</div>
{% endif %}
</article>
<!-- if you want a page layout -->

9
themes/classic/source/_layouts/post.html
View File

@ -6,11 +6,16 @@ single: true
<article class="hentry">
{% include article.html %}
<footer>
<p>
<a href="http://twitter.com/share" class="twitter-share-button" data-url="{{ site.url }}{{ page.url }}" data-via="{{ site.twitter_user }}" data-counturl="{{ site.url }}{{ page.url }}" >Tweet</a>
<p class="meta">
{% include post_author.html %}
{% include post_date.html %}
{% include sharing.html %}
</p>
</footer>
{% if site.disqus_short_name %}
<section>
<h1>Comments</h1>
<div id="disqus_thread">{% include disqus_thread.html %}</div>
</section>
{% endif %}
</article>

2
themes/classic/source/archive.html
View File

@ -1,5 +1,5 @@
---
layout: page
layout: post
title: Blog Archive
no_meta: true
---

12
themes/classic/source/index.html
View File

@ -9,4 +9,14 @@ blog_index: true
{% include article.html %}
</article>
{% endfor %}
{% if site.disqus_short_name %}
<script type="text/javascript">
var disqus_shortname = '{{ site.disqus_short_name }}';
(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
{% endif %}