Much better styles for blog.
parent
8c0660cb47
commit
d6d4bedbe9
|
@ -9,34 +9,31 @@
|
|||
{% block body-class %}blog-site{% endblock %}
|
||||
{% block html-class %}blog-site{% endblock %}
|
||||
|
||||
{% block page-title %}
|
||||
{% if blog_user.username == 'nick' %}
|
||||
Nick Sergeant
|
||||
{% else %}
|
||||
{{ blog_user.username }}'s blog
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% block page-title %}{% if blog_user.username == 'nick' %}// Nick Sergeant {% else %}// {{ blog_user.username }}{% endif %}{% endblock %}
|
||||
|
||||
{% block page-description %}{% endblock %}
|
||||
{% block sub-header %}{% endblock %}
|
||||
{% block rochester-made %}{% endblock %}
|
||||
{% block keyboard-shortcuts %}{% endblock %}
|
||||
{% block intercom %}{% endblock %}
|
||||
|
||||
{% block sub-header %}
|
||||
<header class="sub">
|
||||
<div class="inner group">
|
||||
<ul class="bcrumb">
|
||||
<li class="prompt">//</li>
|
||||
<li><a href="/">blog</a></li>
|
||||
{% block breadcrumb %}{% endblock %}
|
||||
<li class="rss">
|
||||
<a href="/?rss">RSS</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</header>
|
||||
{% endblock %}
|
||||
{% block aside %}
|
||||
{% if not detail %}
|
||||
<aside class="main">
|
||||
<nav class="footer">
|
||||
<ul>
|
||||
<li class="blog">
|
||||
<a href="/">
|
||||
{% if blog_user.username == 'nick' %}
|
||||
Nick Sergeant
|
||||
{% elif blog_user.username == 'blog' %}
|
||||
Snipt Blog
|
||||
{% else %}
|
||||
{{ blog_user.username }}'s blog
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="powered">
|
||||
<li class="snipt"><a href="https://snipt.net/">Blog powered by Snipt</a></li>
|
||||
</ul>
|
||||
|
@ -44,6 +41,21 @@
|
|||
</aside>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% block keyboard-shortcuts %}{% endblock %}
|
||||
{% block header %}{% endblock %}
|
||||
{% block intercom %}{% endblock %}
|
||||
|
||||
{% block header %}
|
||||
<header class="main">
|
||||
<div class="inner group">
|
||||
<h1>
|
||||
<a href="/">
|
||||
{% if blog_user.username == 'nick' %}
|
||||
Nick Sergeant
|
||||
{% elif blog_user.username == 'blog' %}
|
||||
Snipt Blog
|
||||
{% else %}
|
||||
{{ blog_user.username }}
|
||||
{% endif %}
|
||||
</a>
|
||||
</h1>
|
||||
</div>
|
||||
</header>
|
||||
{% endblock %}
|
||||
|
|
|
@ -1,13 +1,18 @@
|
|||
{% extends "blogs/themes/default/base.html" %}
|
||||
|
||||
{% block html-class %}detail blog-site{% endblock %}
|
||||
{% block body-class %}detail blog-site{% endblock %}
|
||||
{% block html-class %}detail blog-site blog-detail{% endblock %}
|
||||
{% block body-class %}detail blog-site blog-detail{% endblock %}
|
||||
|
||||
{% block js %}
|
||||
{{ block.super }}
|
||||
window.detail = true;
|
||||
{% endblock %}
|
||||
|
||||
{% block page-title %}// {{ snipt.title }} {{ block.super }}{% endblock %}
|
||||
{% block breadcrumb %}
|
||||
<li><span class="prompt">//</span> <a href="{{ snipt.get_absolute_url }}">{{ snipt.title }}</a></li>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="snipts" id="snipts">
|
||||
{% with 'true' as detail %}
|
||||
|
|
|
@ -1,10 +1,3 @@
|
|||
body.blog-detail section.main div.inner section.snipts article.snipt div.container {
|
||||
width: 940px;
|
||||
}
|
||||
body.blog-detail div#disqus_thread {
|
||||
width: 925px;
|
||||
}
|
||||
|
||||
body.blog-site article.snipt div.group div.container {
|
||||
width: 708px;
|
||||
}
|
||||
|
@ -14,10 +7,12 @@ body.blog-site article.snipt div.group div.container header {
|
|||
body.blog-site article.snipt div.group div.container header h1 {
|
||||
margin: 11px 15px;
|
||||
}
|
||||
body.blog-site section.main div.ruler {
|
||||
z-index: 50;
|
||||
}
|
||||
body.blog-site section.main aside.main nav.footer ul.powered {
|
||||
border-top: 1px solid #C0C0C0;
|
||||
margin-top: 40px;
|
||||
padding-top: 40px;
|
||||
border-top: 1px solid #DDDDDD;
|
||||
padding-top: 20px;
|
||||
}
|
||||
body.blog-site section.main aside.main nav.footer ul.powered li {
|
||||
background: transparent url("/static/images/favicon.png") center left no-repeat;
|
||||
|
@ -31,3 +26,47 @@ body.blog-site section.main aside.main nav.footer ul.powered li a:hover {
|
|||
border-bottom: 1px solid #333;
|
||||
color: #333;
|
||||
}
|
||||
body.blog-site header.main {
|
||||
background: transparent url("/static/images/blog-header-bg.png") top left repeat;
|
||||
height: auto;
|
||||
}
|
||||
body.blog-site header.main div.inner {
|
||||
height: auto;
|
||||
}
|
||||
body.blog-site header.main div.inner h1 {
|
||||
float: none;
|
||||
position: static;
|
||||
}
|
||||
body.blog-site header.main div.inner h1 a {
|
||||
background: none;
|
||||
border-bottom: 2px solid transparent;
|
||||
color: #2A535C;
|
||||
font: normal 30px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
|
||||
height: auto;
|
||||
letter-spacing: -1px;
|
||||
line-height: 30px;
|
||||
margin: 17px 0 17px 16px;
|
||||
text-decoration: none;
|
||||
text-indent: 0;
|
||||
width: auto;
|
||||
-webkit-transition: border .08s linear;
|
||||
-moz-transition: border .08s linear;
|
||||
-o-transition: border .08s linear;
|
||||
transition: border .08s linear;
|
||||
}
|
||||
body.blog-site header.main div.inner h1 a:hover {
|
||||
border-bottom: 2px solid #3A5E67;
|
||||
}
|
||||
body.blog-site header.sub div.inner {
|
||||
z-index: 51;
|
||||
}
|
||||
|
||||
body.blog-detail section.main div.inner section.snipts article.snipt div.container {
|
||||
width: 939px;
|
||||
}
|
||||
body.blog-detail div#disqus_thread {
|
||||
width: 925px;
|
||||
}
|
||||
body.blog-detail header.sub div.inner ul.bcrumb {
|
||||
width: 923px;
|
||||
}
|
||||
|
|
|
@ -1,19 +1,5 @@
|
|||
body.blog-detail {
|
||||
section.main {
|
||||
div.inner {
|
||||
section.snipts {
|
||||
article.snipt {
|
||||
div.container {
|
||||
width: 940px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
div#disqus_thread {
|
||||
width: 925px;
|
||||
}
|
||||
}
|
||||
$Helvetica: 'Helvetica Neue', Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
|
||||
|
||||
body.blog-site {
|
||||
article.snipt {
|
||||
div.group {
|
||||
|
@ -31,12 +17,14 @@ body.blog-site {
|
|||
}
|
||||
}
|
||||
section.main {
|
||||
div.ruler {
|
||||
z-index: 50;
|
||||
}
|
||||
aside.main {
|
||||
nav.footer {
|
||||
ul.powered {
|
||||
border-top: 1px solid #C0C0C0;
|
||||
margin-top: 40px;
|
||||
padding-top: 40px;
|
||||
border-top: 1px solid #DDDDDD;
|
||||
padding-top: 20px;
|
||||
|
||||
li {
|
||||
background: transparent url('/static/images/favicon.png') center left no-repeat;
|
||||
|
@ -56,4 +44,67 @@ body.blog-site {
|
|||
}
|
||||
}
|
||||
}
|
||||
header.main {
|
||||
background: transparent url('/static/images/blog-header-bg.png') top left repeat;
|
||||
height: auto;
|
||||
|
||||
div.inner {
|
||||
height: auto;
|
||||
|
||||
h1 {
|
||||
float: none;
|
||||
position: static;
|
||||
|
||||
a {
|
||||
background: none;
|
||||
border-bottom: 2px solid transparent;
|
||||
color: #2A535C;
|
||||
font: normal 30px $Helvetica;
|
||||
height: auto;
|
||||
letter-spacing: -1px;
|
||||
line-height: 30px;
|
||||
margin: 17px 0 17px 16px;
|
||||
text-decoration: none;
|
||||
text-indent: 0;
|
||||
width: auto;
|
||||
-webkit-transition: border .08s linear;
|
||||
-moz-transition: border .08s linear;
|
||||
-o-transition: border .08s linear;
|
||||
transition: border .08s linear;
|
||||
|
||||
&:hover {
|
||||
border-bottom: 2px solid #3A5E67;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
header.sub {
|
||||
div.inner {
|
||||
z-index: 51;
|
||||
}
|
||||
}
|
||||
}
|
||||
body.blog-detail {
|
||||
section.main {
|
||||
div.inner {
|
||||
section.snipts {
|
||||
article.snipt {
|
||||
div.container {
|
||||
width: 939px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
div#disqus_thread {
|
||||
width: 925px;
|
||||
}
|
||||
header.sub {
|
||||
div.inner {
|
||||
ul.bcrumb {
|
||||
width: 923px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 176 B |
Loading…
Reference in New Issue