Much better styles for blog.
parent
8c0660cb47
commit
d6d4bedbe9
|
@ -9,34 +9,31 @@
|
||||||
{% block body-class %}blog-site{% endblock %}
|
{% block body-class %}blog-site{% endblock %}
|
||||||
{% block html-class %}blog-site{% endblock %}
|
{% block html-class %}blog-site{% endblock %}
|
||||||
|
|
||||||
{% block page-title %}
|
{% block page-title %}{% if blog_user.username == 'nick' %}// Nick Sergeant {% else %}// {{ blog_user.username }}{% endif %}{% endblock %}
|
||||||
{% if blog_user.username == 'nick' %}
|
|
||||||
Nick Sergeant
|
|
||||||
{% else %}
|
|
||||||
{{ blog_user.username }}'s blog
|
|
||||||
{% endif %}
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
{% block page-description %}{% endblock %}
|
{% block page-description %}{% endblock %}
|
||||||
{% block sub-header %}{% endblock %}
|
|
||||||
{% block rochester-made %}{% 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 %}
|
{% block aside %}
|
||||||
{% if not detail %}
|
{% if not detail %}
|
||||||
<aside class="main">
|
<aside class="main">
|
||||||
<nav class="footer">
|
<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">
|
<ul class="powered">
|
||||||
<li class="snipt"><a href="https://snipt.net/">Blog powered by Snipt</a></li>
|
<li class="snipt"><a href="https://snipt.net/">Blog powered by Snipt</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
@ -44,6 +41,21 @@
|
||||||
</aside>
|
</aside>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
{% block keyboard-shortcuts %}{% endblock %}
|
|
||||||
{% block header %}{% endblock %}
|
{% block header %}
|
||||||
{% block intercom %}{% endblock %}
|
<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" %}
|
{% extends "blogs/themes/default/base.html" %}
|
||||||
|
|
||||||
{% block html-class %}detail blog-site{% endblock %}
|
{% block html-class %}detail blog-site blog-detail{% endblock %}
|
||||||
{% block body-class %}detail blog-site{% endblock %}
|
{% block body-class %}detail blog-site blog-detail{% endblock %}
|
||||||
|
|
||||||
{% block js %}
|
{% block js %}
|
||||||
{{ block.super }}
|
{{ block.super }}
|
||||||
window.detail = true;
|
window.detail = true;
|
||||||
{% endblock %}
|
{% 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 %}
|
{% block content %}
|
||||||
<section class="snipts" id="snipts">
|
<section class="snipts" id="snipts">
|
||||||
{% with 'true' as detail %}
|
{% 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 {
|
body.blog-site article.snipt div.group div.container {
|
||||||
width: 708px;
|
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 {
|
body.blog-site article.snipt div.group div.container header h1 {
|
||||||
margin: 11px 15px;
|
margin: 11px 15px;
|
||||||
}
|
}
|
||||||
|
body.blog-site section.main div.ruler {
|
||||||
|
z-index: 50;
|
||||||
|
}
|
||||||
body.blog-site section.main aside.main nav.footer ul.powered {
|
body.blog-site section.main aside.main nav.footer ul.powered {
|
||||||
border-top: 1px solid #C0C0C0;
|
border-top: 1px solid #DDDDDD;
|
||||||
margin-top: 40px;
|
padding-top: 20px;
|
||||||
padding-top: 40px;
|
|
||||||
}
|
}
|
||||||
body.blog-site section.main aside.main nav.footer ul.powered li {
|
body.blog-site section.main aside.main nav.footer ul.powered li {
|
||||||
background: transparent url("/static/images/favicon.png") center left no-repeat;
|
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;
|
border-bottom: 1px solid #333;
|
||||||
color: #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 {
|
$Helvetica: 'Helvetica Neue', Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
|
||||||
section.main {
|
|
||||||
div.inner {
|
|
||||||
section.snipts {
|
|
||||||
article.snipt {
|
|
||||||
div.container {
|
|
||||||
width: 940px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
div#disqus_thread {
|
|
||||||
width: 925px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
body.blog-site {
|
body.blog-site {
|
||||||
article.snipt {
|
article.snipt {
|
||||||
div.group {
|
div.group {
|
||||||
|
@ -31,12 +17,14 @@ body.blog-site {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
section.main {
|
section.main {
|
||||||
|
div.ruler {
|
||||||
|
z-index: 50;
|
||||||
|
}
|
||||||
aside.main {
|
aside.main {
|
||||||
nav.footer {
|
nav.footer {
|
||||||
ul.powered {
|
ul.powered {
|
||||||
border-top: 1px solid #C0C0C0;
|
border-top: 1px solid #DDDDDD;
|
||||||
margin-top: 40px;
|
padding-top: 20px;
|
||||||
padding-top: 40px;
|
|
||||||
|
|
||||||
li {
|
li {
|
||||||
background: transparent url('/static/images/favicon.png') center left no-repeat;
|
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