diff options
author | Valentin Popov <valentineus@gmail.com> | 2018-04-04 02:06:36 +0300 |
---|---|---|
committer | Valentin Popov <valentineus@gmail.com> | 2018-04-04 02:06:36 +0300 |
commit | cf2658dd1a52a2bdcf21f79f82fcc89d66d0467a (patch) | |
tree | 25632af530ea8947ca361e41b5c268393865ef01 | |
parent | a02864e005d647e427d4066ec065e8fc4a210ed0 (diff) | |
download | popov.link-cf2658dd1a52a2bdcf21f79f82fcc89d66d0467a.tar.xz popov.link-cf2658dd1a52a2bdcf21f79f82fcc89d66d0467a.zip |
List of all entries on the main page
Signed-off-by: Valentin Popov <valentineus@gmail.com>
-rw-r--r-- | _pages/index.md | 163 |
1 files changed, 27 insertions, 136 deletions
diff --git a/_pages/index.md b/_pages/index.md index d0f65ae..4b470f8 100644 --- a/_pages/index.md +++ b/_pages/index.md @@ -1,140 +1,31 @@ --- -permalink: "/index.html" -layout: page -sidebar: false -id: index -title: "Home" +permalink: "/index.html" +layout: default +title: "Home" +id: index --- -There is a significant amount of subtle, yet precisely calibrated, styling to ensure that your content is emphasized while still looking aesthetically pleasing. - -All links are easy to [locate and discern](/), yet don't detract from the [harmony of a paragraph](/). -The _same_ goes for italics and __bold__ elements. -Even the the strikeout works if <del>for some reason you need to update your post</del>. -For consistency's sake, <ins>The same goes for insertions</ins>, of course. - -### Code, with syntax highlighting - -Here's an example of some ruby code with line anchors. - -{% highlight ruby lineanchors %} - # The most awesome of classes - class Awesome < ActiveRecord::Base - include EvenMoreAwesome - - validates_presence_of :something - validates :email, email_format: true - - def initialize(email, name = nil) - self.email = email - self.name = name - self.favorite_number = 12 - puts 'created awesomeness' - end - - def email_format - email =~ /\S+@\S+\.\S+/ - end - end -{% endhighlight %} - -Here's some CSS: - -{% highlight css %} - .foobar { - /* Named colors rule */ - color: tomato; - } -{% endhighlight %} - -Here's some JavaScript: - -{% highlight js %} - var isPresent = require('is-present') - - module.exports = function doStuff(things) { - if (isPresent(things)) { - doOtherStuff(things) - } - } -{% endhighlight %} - -Here's some HTML: - -{% highlight html %} - <div class="m0 p0 bg-blue white"> - <h3 class="h1">Hello, world!</h3> +<div class="page"> + <div class="posts"> + {% for node in site.posts %} + <div class="post"> + <!-- Date --> + <span class="post-date"> + {{ node.latest_update | default: node.date | date_to_long_string }} + </span> + + <!-- Header --> + <h1 class="post-title"> + <a href="{{ node.url | relative_url | uri_escape }}"> + {{ node.title | smartify | strip_html | normalize_whitespace }} + </a> + </h1> + + <!-- Content --> + <span class="post-date"> + {{ node.description | smartify | strip_html | normalize_whitespace }} + </span> + </div> + {% endfor %} </div> -{% endhighlight %} - -# Headings! - -They're responsive, and well-proportioned (in `padding`, `line-height`, `margin`, and `font-size`). -They also heavily rely on the awesome utility, [BASSCSS](http://www.basscss.com/). - -##### They draw the perfect amount of attention - -This allows your content to have the proper informational and contextual hierarchy. -Yay. - -### There are lists, too - -* Apples -* Oranges -* Potatoes -* Milk - -1. Mow the lawn -2. Feed the dog -3. Dance - -### Images look great, too - -![desk](https://cloud.githubusercontent.com/assets/1424573/3378137/abac6d7c-fbe6-11e3-8e09-55745b6a8176.png) - -### There are also pretty colors - -Also the result of -[BASSCSS](http://www.basscss.com/), -you can -<span class="bg-dark-gray white">highlight</span> -certain components of a -<span class="red">post</span> -<span class="mid-gray">with</span> -<span class="green">CSS</span> -<span class="orange">classes</span>. - -I don't recommend using blue, though. It looks like a -<span class="blue">link</span>. - -### Footnotes! - -Markdown footnotes are supported, and they look great! -Simply put e.g. `[^1]` where you want the footnote to appear,[^1] and then add the reference at the end of your markdown. - -### Stylish blockquotes included - -You can use the markdown quote syntax, `>` for simple quotes. - -> Lorem ipsum dolor sit amet, consectetur adipiscing elit. -Suspendisse quis porta mauris. - -However, you need to inject html if you'd like a citation footer. -I will be working on a way to hopefully sidestep this inconvenience. - -<blockquote> - <p>Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.</p> - <footer><cite title="Antoine de Saint-Exupéry">Antoine de Saint-Exupéry</cite></footer> -</blockquote> - -### There's more being added all the time - -Checkout the -[Github repository](https://github.com/johnotander/pixyll) -to request, or add, features. - -Happy writing. - ---- - -[^1]: Important information that may distract from the main text can go in footnotes.
\ No newline at end of file +</div> |