1
0
Fork 0

Third Commit

master
Ambrose Chua 2014-08-24 22:56:00 +08:00
parent 61d11efb78
commit 64fa83e82b
4 changed files with 24 additions and 16 deletions

View File

@ -15,10 +15,10 @@
<header class="site-header"> <header class="site-header">
<h1><a href="/"><div class="circle">2punny</div></a></h1> <h1><a href="/"><div class="circle">2punny</div></a></h1>
<nav> <nav>
<a href="/random" {% if page.url contains "/random" %}class="active"{% endif %}><span>random</span></a> <a href="/random" {% if page.url contains "/random" %}class="active"{% endif %}><span>rand<span class="hidewhensmall">om</span></span></a>
<a href="/all" {% if page.url contains "/all" %}class="active"{% endif %}><span>see-'em-all</span></a> <a href="/all" {% if page.url contains "/all" %}class="active"{% endif %}><span><span class="hidewhensmall">see-'em-</span>all</span></a>
<a href="http://facebook.com/2punny" target="_blank"><i class="icon-facebook"></i></a> <a href="http://facebook.com/2punny" target="_blank"><i class="icon-facebook"></i></a>
<a href="/about" {% if page.url contains "/about" %}class="active"{% endif %}><span>about</span></a> <a href="/about" {% if page.url contains "/about" %}class="active"{% endif %}><span>ab<span class="hidewhensmall">ou</span>t</span></a>
</nav> </nav>
</header> </header>
{{ content }} {{ content }}

View File

@ -3,13 +3,13 @@ layout: default
footer: hidden footer: hidden
--- ---
<main class="pun"> <main class="pun">
<div class="puncontent" style="background-color: {{ page.background-color }}; color: {{ page.color }};"> <div class="puncontent" style="background: {{ page.background }}; color: {{ page.color }};">
{{content}} {{content}}
</div> </div>
<div class="share"> <div class="share">
<a class="btn previous" href="#previous"><i class="icon-arrow-left"></i>Prev</a> {% if page.previous %}<a class="btn previous" href="{{ page.previous.url }}"><i class="icon-arrow-left"></i>Prev</a>{% endif %}
<a class="btn" href="#facebook"><i class="icon-facebook"></i>Facebook</a> <a class="btn" href="#facebook"><i class="icon-facebook"></i><span class="hidewhensmall">Facebook</span></a>
<a class="btn" href="#twitter"><i class="icon-twitter"></i>Twitter</a> <a class="btn" href="#twitter"><i class="icon-twitter"></i><span class="hidewhensmall">Twitter</span></a>
<a class="btn next" href="#next"><i class="icon-arrow-right"></i>Next</a> {% if page.next %}<a class="btn next" href="{{ page.next.url }}"><i class="icon-arrow-right"></i>Next</a>{% endif %}
</div> </div>
</main> </main>

View File

@ -1,6 +1,6 @@
--- ---
layout: pun layout: pun
color: "#fff" color: "#fff"
background-color: "#2ecc71" background: "#2ecc71"
--- ---
Theese jokes are too cheesy Theese jokes are too cheesy

View File

@ -16,6 +16,7 @@ body {
background-color: #fff; background-color: #fff;
color: #444; color: #444;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-webkit-tap-highlight-color: none;
} }
main { main {
@ -33,6 +34,7 @@ main {
main.pun { main.pun {
padding: 0; padding: 0;
margin: 0; margin: 0;
max-width: none;
} }
a:not(.btn) { a:not(.btn) {
@ -90,7 +92,10 @@ a:hover, a:focus {
vertical-align: bottom; vertical-align: bottom;
} }
.share .btn i { .share .btn i {
margin-right: 0.3em; margin: 0 0.1em;
}
.share .btn span {
margin-left: 0.3em;
} }
.btn[href="#facebook"] { .btn[href="#facebook"] {
border-color: #3b5998 !important; border-color: #3b5998 !important;
@ -118,11 +123,11 @@ a:hover, a:focus {
} }
.puncontent { .puncontent {
font-size: 50px; font-size: 2.5em;
line-height: 1.2em; line-height: 1.2em;
padding: 2em 1em; padding: 15vh 10vw;
min-height: 80vh; min-height: 70vh;
padding-top: 3em; padding-top: 20vh;
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
@ -304,7 +309,7 @@ th {
font-weight: 300; font-weight: 300;
line-height: 1em; line-height: 1em;
/*height: 100%;*/ /*height: 100%;*/
padding: 0.3em 5%; padding: 0.3em 5vw;
} }
.site-header nav a { .site-header nav a {
box-shadow: none !important; box-shadow: none !important;
@ -315,7 +320,7 @@ th {
transition: 0.25s color, 0.25s background-color; transition: 0.25s color, 0.25s background-color;
} }
.site-header nav span { .site-header nav > a > span {
display: block; display: block;
height: 100%; height: 100%;
} }
@ -371,4 +376,7 @@ footer {
.site-header { .site-header {
font-size: 18px; font-size: 18px;
} }
.hidewhensmall {
display: none;
}
} }