This repository has been archived on 2018-10-12. You can view files and clone it, but cannot push or open issues or pull requests.
ProgBlog/app/views/index.stache

134 lines
2.8 KiB
Plaintext
Raw Normal View History

2016-02-24 14:09:22 -05:00
<header class="w930">
<div class="heading">
<a href="#"><span class="title">Tim's Blog</span></a>
<span class="tagline">Random musings and rantings</span>
</div>
</header>
<main class="w930">
<section class="pagebody">
<section class="grid grid-fit grid-gutters">
<article class="main cell no-top-padding">
<div class="title">
<h2>Article Title</h2>
</div>
<div class="subtitle">Feb 18, 2016</div>
Here are some random code examples:
<p>HTML is always fun to look at, right?</p>
<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta charset="utf-8" /&gt;
&lt;title&gt;Some Random Title&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;&lt;/body&gt;
&lt;/html&gt;
</code></pre>
<p>Javascript has several ways of making a self-executing function.</p>
<pre><code>// ES5 IIFE
(function() {
var x = 'foo';
}());
// ES5 Alternate IIFE
(function() {
var y = 'bar';
})();
// ES6 IIFE
(() => {
let x = 'foo';
const y = 'bar';
})();</code></pre>
Or, how about some php magic methods?
<pre><code>&lt;?php
class Foo {
/**
* A Constructor
*/
public function __construct()
{
2016-02-19 16:17:59 -05:00
2016-02-24 14:09:22 -05:00
}
/**
* A Destructor
*/
public function __destruct()
{
}
/**
* Dynamically get class properties
*
* @param string $key - the key of the item to get
* @return mixed - the value of the item
*/
public function __get($key)
{
}
/**
* Dynamically set class properties
*
* @param string $key - the key of the item to set
* @param mixed $value - the value of the item to set
*/
public function __set($key, $value)
{
}
}</code></pre>
<p>Or, you could even showcase CSS</p>
<pre><code>:root {
--body-font: 'Slabo 27px', serif;
--header-fonts: 'PT Serif', serif;
background:whitesmoke;
font-family: var(--body-font);
box-sizing: border-box;
cursor: default;
line-height: 1.4;
-ms-overflow-style: -ms-autohiding-scrollbar;
overflow-y: scroll;
text-rendering: optimizeLegibility;
text-size-adjust: 100%
}
/*
*! Flexbox grid
*/
section {
flex: 0;
}</code></pre>
</article>
<aside class="sidebar cell cell-1of3 no-top-padding">
<div class="bio">
<img class="logo" src="https://secure.gravatar.com/avatar/2ea65d51f854de868d4e94de8583ed96.jpg?r=g&s=100&d=wavatar" />
<div class="title">Timothy J. Warren</div>
<div class="tagline">Web Developer, Programmer, and all-around Technology Enthusiast</div>
</div>
<div class="recent-posts">
<div class="title">Recent Posts <a class="showall" href="#">show all</a></div>
<div>
<a class="post" href="#">Hello, this is a sample post!</a>
</div>
</div>
</aside>
</section>
2016-02-19 16:17:59 -05:00
<footer>
<p>&copy; Timothy J. Warren</p>
</footer>
2016-02-24 14:09:22 -05:00
</section>
</main>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.1.0/highlight.min.js"></script>
<script>
hljs.initHighlightingOnLoad();
</script>