marrub
/
snipt
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

New blog styles.

master
Nick Sergeant 2012-06-04 20:57:20 -04:00
parent bcdfee8232
commit 57d9f699dd
11 changed files with 160 additions and 601 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
blogs/templates/blogs/themes/default/base.html
View File

@ -14,9 +14,10 @@
{% block css %}
{% compress css %}
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/bootstrap.css" />
<link rel="stylesheet" type="text/x-scss" href="{{ STATIC_URL }}css/blog-themes/default/style.scss" />
<link rel="stylesheet" type="text/x-scss" href="{{ STATIC_URL }}css/style.scss" />
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/themes.css" />
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/chosen.css" />
<link rel="stylesheet" type="text/x-scss" href="{{ STATIC_URL }}css/blog-themes/default/style.scss" />
{% endcompress %}
{% endblock %}
@ -31,26 +32,22 @@
{% block page-description %}{% endblock %}
{% block sub-header %}{% endblock %}
{% block rochester-made %}{% endblock %}
{% block aside %}{% endblock %}
{% block aside %}
{% if not detail %}
<aside class="main">
<nav class="footer">
<ul>
<li class="blog">
{% if blog_user.username == 'nick' %}
<a href="/">Nick Sergeant</a>
{% else %}
<a href="/">{{ blog_user.username }}'s blog</a>
{% endif %}
</li>
</ul>
</nav>
</aside>
{% endif %}
{% endblock %}
{% block keyboard-shortcuts %}{% endblock %}
{% block header %}{% endblock %}
{% block main %}
<section class="frame">
<h1 class="blog-title">
<a href="/">
{% if blog_user.username == 'nick' %}
Nick Sergeant
{% else %}
{{ blog_user.username }}
{% endif %}
</a>
</h1>
{% if has_snipts %}
<h2 class="blog-title">
&raquo; <a href="/blog/">Blog</a>
</h2>
{% endif %}
{% block content %}{% endblock %}
</section>
{% endblock %}

28
blogs/templates/blogs/themes/default/list.html
View File

@ -1,6 +1,12 @@
{% extends "blogs/themes/default/base.html" %}
{% load compress pagination_tags %}
{% load pagination_tags %}
{% block meta %}
{% if 'page' in request.get_full_path %}
<meta name="robots" content="noindex, follow" />
{% endif %}
{% endblock %}
{% block body-class %}{{ block.super }} blog-list{% endblock %}
@ -20,26 +26,6 @@
</div>
{% endfor %}
{% paginate %}
{% if detail %}
{% with snipts.0 as snipt %}
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = 'snipt-net';
{% if debug %}
var disqus_developer = 1;
{% endif %}
var disqus_url = 'http://{{ request.META.HTTP_HOST }}{{ request.path }}';
var disqus_title = '{{ snipt.title }}';
var disqus_identifier = {{ snipt.id }};
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'https://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
{% endwith %}
{% endif %}
</section>
<script type="text/javascript" id="disqus">
var disqus_shortname = 'snipt-net';

34
blogs/templates/blogs/themes/default/post.html Normal file
View File

@ -0,0 +1,34 @@
{% extends "blogs/themes/default/base.html" %}
{% block html-class %}detail{% endblock %}
{% block body-class %}detail{% endblock %}
{% block js %}
{{ block.super }}
window.detail = true;
{% endblock %}
{% block content %}
<section class="snipts" id="snipts">
{% with 'true' as detail %}
{% include "blogs/themes/default/snipt-list.html" %}
{% endwith %}
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = 'snipt-net';
{% if debug %}
var disqus_developer = 1;
{% endif %}
var disqus_url = '{{ snipt.get_full_absolute_url }}{% if not snipt.public %}?key={{ snipt.key }}{% endif %}';
var disqus_title = '{{ snipt.title }}';
var disqus_identifier = {{ snipt.id }};
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'https://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
</section>
{% endblock %}

7
blogs/templates/blogs/themes/default/snipt-list.html
View File

@ -2,8 +2,9 @@
{% load humanize %}
{% block aside %}{% endblock %}
{% block author %}{% endblock %}
{% block extra-snipt-header %}
<h3>{{ snipt.publish_date|naturaltime }}</h3>
{% block created %}
<li class="created" title="{{ snipt.publish_date|date:"Y-m-d\TH:i:s" }}">{{ snipt.publish_date|naturaltime }}</li>
{% endblock %}
{% block lexer %}{% endblock %}

3
blogs/urls.py
View File

@ -1,6 +1,5 @@
from django.conf.urls.defaults import *
urlpatterns = patterns('',
url(r'^$', views.blog_homepage, name='blog-homepage'),
url(r'^blog/$', views.blog, name='blog'),
url(r'^$', views.blog, name='blog'),
)

32
blogs/views.py
View File

@ -5,26 +5,10 @@ from annoying.decorators import render_to
from snipts.models import Snipt
@render_to('blogs/themes/default/homepage.html')
def blog_homepage(request):
try:
homepage = Snipt.objects.get(user=request.blog_user, title__iexact='Homepage', blog_post=True, public=True)
except Snipt.DoesNotExist:
return blog_list(request)
context = {
'blog_user': request.blog_user,
'homepage': homepage,
'public': True,
}
return context
@render_to('blogs/themes/default/list.html')
def blog_list(request, username_or_custom_slug=None):
if username_or_custom_slug and username_or_custom_slug != 'blog':
if username_or_custom_slug:
return blog_post(request, username_or_custom_slug)
snipts = Snipt.objects.filter(user=request.blog_user, blog_post=True, public=True).order_by('-created').exclude(title__iexact='Homepage')
@ -42,21 +26,21 @@ def blog_list(request, username_or_custom_slug=None):
return context
@render_to('blogs/themes/default/list.html')
@render_to('blogs/themes/default/post.html')
def blog_post(request, username_or_custom_slug):
snipts = Snipt.objects.filter(user=request.blog_user,
blog_post=True,
public=True,
slug=username_or_custom_slug,
).order_by('-created').exclude(title__iexact='Homepage')
snipt = Snipt.objects.get(user=request.blog_user,
blog_post=True,
public=True,
slug=username_or_custom_slug,
)
context = {
'blog_user': request.blog_user,
'detail': True,
'has_snipts': True,
'public': True,
'snipts': snipts,
'snipt': snipt,
}
return context

299
media/css/blog-themes/default/style.scss
View File

@ -1,288 +1,31 @@
// Fonts
$Helvetica: 'Helvetica Neue', Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
$Consolas: Consolas, Menlo, "Courier New", monospace;
// Mixins
@mixin border-radius($radius: 5px) {
-webkit-background-clip: padding-box;
-webkit-border-radius: $radius;
-moz-background-clip: padding-box;
-moz-border-radius: $radius;
border-radius: $radius;
background-clip: padding-box;
}
@mixin box-shadow($horizontal: 0px, $vertical: 1px, $blur: 2px, $color: #CCC) {
-webkit-box-shadow: $horizontal $vertical $blur $color;
-moz-box-shadow: $horizontal $vertical $blur $color;
box-shadow: $horizontal $vertical $blur $color;
}
@mixin inset-box-shadow($horizontal: 0px, $vertical: 1px, $blur: 2px, $color: #CCC) {
-webkit-box-shadow: inset $horizontal $vertical $blur $color;
-moz-box-shadow: inset $horizontal $vertical $blur $color;
box-shadow: inset $horizontal $vertical $blur $color;
}
@mixin multi-color-border($top, $sides, $bottom) {
border-top: 1px solid $top;
border-left: 1px solid $sides;
border-right: 1px solid $sides;
border-bottom: 1px solid $bottom;
}
@mixin multi-border-radius($topLeft: 5px, $topRight: 5px, $bottomRight: 5px, $bottomLeft: 5px) {
-webkit-border-top-left-radius: $topLeft;
-webkit-border-top-right-radius: $topRight;
-webkit-border-bottom-right-radius: $bottomRight;
-webkit-border-bottom-left-radius: $bottomLeft;
-moz-border-radius-topleft: $topLeft;
-moz-border-radius-topright: $topRight;
-moz-border-radius-bottomright: $bottomRight;
-moz-border-radius-bottomleft: $bottomLeft;
border-top-left-radius: $topLeft;
border-top-right-radius: $topRight;
border-bottom-right-radius: $bottomRight;
border-bottom-left-radius: $bottomLeft;
}
@mixin vertical-gradient($start: #000, $stop: #FFF) { background: ($start + $stop) / 2;
background: -webkit-gradient(linear, left top, left bottom, from($start), to($stop));
background: -moz-linear-gradient(center top, $start 0%, $stop 100%);
background: -moz-gradient(center top, $start 0%, $stop 100%);
}
@mixin vertical-gradient-with-image($image, $start: #000, $stop: #FFF) {
background: ($start + $stop) / 2 $image;
background: $image, -webkit-gradient(linear, left top, left bottom, from($start), to($stop));
background: $image, -moz-linear-gradient(center top, $start 0%, $stop 100%);
background: $image, -moz-gradient(center top, $start 0%, $stop 100%);
}
// Page
html, body {
background: #F5F2F3 url('/static/images/bg.gif') top left repeat;
}
body {
color: #666;
font: normal 14px/16px $Helvetica;
text-rendering: optimizeLegibility;
li {
line-height: normal;
}
}
// Utils
.group:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.hidden {
display: none;
}
body {
color: #0F0F0F;
font: normal 17px/24px $Helvetica;
margin: 0;
section.frame {
margin: 0 auto;
padding-top: 50px;
width: 610px;
}
a {
color: #0094AF;
&:hover {
color: #006577;
text-decoration: none;
}
}
h1.blog-title {
display: inline-block;
font-size: 34px;
line-height: 24px;
margin-top: 0;
a {
color: #0094AF;
font-weight: normal;
text-decoration: none;
verticsal-align: -1px;
&:hover {
color: #006577;
}
}
}
h2.blog-title {
display: inline-block;
font-weight: normal;
margin-left: 10px;
a {
color: #0094AF;
margin-left: 5px;
&:hover {
color: #006577;
text-decoration: none;
}
}
}
header.main {
background: none;
border-bottom: 0;
height: auto;
margin: 0 auto;
width: 940px;
h1 {
margin: 0;
padding: 29px 0 0 15px;
}
}
div.pagination {
margin-bottom: 60px;
text-align: center;
}
div.empty-snipts {
margin-top: 20px;
}
}
body.blog-homepage {
color: #B5B5B5;
padding-bottom: 39px;
h1.blog-title {
margin-bottom: 24px;
margin-top: 4px;
}
p {
font: normal 17px/24px $Helvetica;
margin: 17px 0;
}
li {
line-height: 24px;
margin: 5px 15px;
}
img {
display: block;
margin: 53px auto 0 auto;
}
a {
color: #838383;
&:hover {
color: #565656;
}
}
}
article.snipt {
border-top: 1px solid #C9C6C7;
margin: 45px 0;
padding-top: 45px;
div.group {
div.container {
width: 708px;
div.number {
display: none;
header {
min-height: 0;
h1 {
margin: 11px 15px;
}
}
}
}
div.container {
width: auto;
header {
h1 {
font-size: 20px;
line-height: 26px;
a {
color: #0088CC;
&:hover {
color: #006BA0;
}
body.detail {
section.main {
div.inner {
section.snipts {
article.snipt {
div.container {
width: 940px;
}
}
}
h2 {
display: none;
}
h3 {
color: #B5B5B5;
font-size: 16px;
font-weight: normal;
margin-bottom: 20px;
}
}
section.code {
background: transparent;
div.markdown {
p {
font: normal 17px/24px $Helvetica;
line-height: 24px;
}
li {
line-height: 24px;
margin: 5px 15px;
}
div.highlight {
margin: 20px 0;
}
pre {
background: #FFF;
margin: 20px 0;
}
}
div.highlight {
pre {
background: #FFF;
}
}
a.expand {
display: none;
}
}
textarea.raw {
display: none;
}
}
aside {
section.tags {
display: none;
}
ul.options {
display: none;
}
}
footer {
display: none;
}
}
div#disqus_thread {
margin-bottom: 0;
margin-left: 15px;
margin-top: 60px;
width: 610px;
#dsq-content {
margin-top: -38px;
#dsq-global-toolbar {
margin-bottom: 18px;
margin-top: 0;
}
#dsq-sort-by {
display: none;
}
.dsq-comment-text {
color: #666;
}
h3 {
display: none;
}
.dsq-textarea-wrapper {
overflow: hidden;
}
}
#dsq-footer {
display: none;
div#disqus_thread {
width: 925px;
}
}

217
media/css/style.css
View File

@ -1,211 +1,16 @@
html, body {
background: #f5f2f3 url("/static/images/bg.gif") top left repeat;
article.snipt div.group div.container {
width: 708px;
}
article.snipt div.group div.container header {
min-height: 0;
}
article.snipt div.group div.container header h1 {
margin: 11px 15px;
}
body {
color: #666;
font: normal 14px/16px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
text-rendering: optimizeLegibility;
}
body li {
line-height: normal;
}
.group:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.hidden {
display: none;
}
body {
color: #0F0F0F;
font: normal 17px/24px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
margin: 0;
}
body section.frame {
margin: 0 auto;
padding-top: 50px;
width: 610px;
}
body a {
color: #0094AF;
}
body a:hover {
color: #006577;
text-decoration: none;
}
body h1.blog-title {
display: inline-block;
font-size: 34px;
line-height: 24px;
margin-top: 0;
}
body h1.blog-title a {
color: #0094AF;
font-weight: normal;
text-decoration: none;
verticsal-align: -1px;
}
body h1.blog-title a:hover {
color: #006577;
}
body h2.blog-title {
display: inline-block;
font-weight: normal;
margin-left: 10px;
}
body h2.blog-title a {
color: #0094AF;
margin-left: 5px;
}
body h2.blog-title a:hover {
color: #006577;
text-decoration: none;
}
body header.main {
background: none;
border-bottom: 0;
height: auto;
margin: 0 auto;
body.detail section.main div.inner section.snipts article.snipt div.container {
width: 940px;
}
body header.main h1 {
margin: 0;
padding: 29px 0 0 15px;
}
body div.pagination {
margin-bottom: 60px;
text-align: center;
}
body div.empty-snipts {
margin-top: 20px;
}
body.blog-homepage {
color: #B5B5B5;
padding-bottom: 39px;
}
body.blog-homepage h1.blog-title {
margin-bottom: 24px;
margin-top: 4px;
}
body.blog-homepage p {
font: normal 17px/24px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
margin: 17px 0;
}
body.blog-homepage li {
line-height: 24px;
margin: 5px 15px;
}
body.blog-homepage img {
display: block;
margin: 53px auto 0 auto;
}
body.blog-homepage a {
color: #838383;
}
body.blog-homepage a:hover {
color: #565656;
}
article.snipt {
border-top: 1px solid #C9C6C7;
margin: 45px 0;
padding-top: 45px;
}
article.snipt div.number {
display: none;
}
article.snipt div.container {
width: auto;
}
article.snipt div.container header h1 {
font-size: 20px;
line-height: 26px;
}
article.snipt div.container header h1 a {
color: #0088CC;
}
article.snipt div.container header h1 a:hover {
color: #006BA0;
}
article.snipt div.container header h2 {
display: none;
}
article.snipt div.container header h3 {
color: #B5B5B5;
font-size: 16px;
font-weight: normal;
margin-bottom: 20px;
}
article.snipt div.container section.code {
background: transparent;
}
article.snipt div.container section.code div.markdown p {
font: normal 17px/24px "Helvetica Neue", Helvetica, Arial, "Liberation Sans", FreeSans, sans-serif;
line-height: 24px;
}
article.snipt div.container section.code div.markdown li {
line-height: 24px;
margin: 5px 15px;
}
article.snipt div.container section.code div.markdown div.highlight {
margin: 20px 0;
}
article.snipt div.container section.code div.markdown pre {
background: #FFF;
margin: 20px 0;
}
article.snipt div.container section.code div.highlight pre {
background: #FFF;
}
article.snipt div.container section.code a.expand {
display: none;
}
article.snipt div.container textarea.raw {
display: none;
}
article.snipt aside section.tags {
display: none;
}
article.snipt aside ul.options {
display: none;
}
article.snipt footer {
display: none;
}
div#disqus_thread {
margin-bottom: 0;
margin-left: 15px;
margin-top: 60px;
width: 610px;
}
div#disqus_thread #dsq-content {
margin-top: -38px;
}
div#disqus_thread #dsq-content #dsq-global-toolbar {
margin-bottom: 18px;
margin-top: 0;
}
div#disqus_thread #dsq-content #dsq-sort-by {
display: none;
}
div#disqus_thread #dsq-content .dsq-comment-text {
color: #666;
}
div#disqus_thread #dsq-content h3 {
display: none;
}
div#disqus_thread #dsq-content .dsq-textarea-wrapper {
overflow: hidden;
}
div#disqus_thread #dsq-footer {
display: none;
body.detail div#disqus_thread {
width: 925px;
}

14
snipts/models.py
View File

@ -96,25 +96,33 @@ class Snipt(models.Model):
def get_absolute_url(self):
if self.custom_slug:
return '/{}/'.format(self.custom_slug)
if self.blog_post:
if self.user.id == 3:
return 'http://nicksergeant.com/{}/'.format(self.slug)
else:
return 'https://{}.snipt.net/{}/'.format(self.user.username, self.slug)
if self.custom_slug:
return '/{}/'.format(self.custom_slug)
if self.public:
return '/{}/{}/'.format(self.user.username, self.slug)
else:
return '/{}/{}/?key={}'.format(self.user.username, self.slug, self.key)
def get_full_absolute_url(self):
if self.blog_post:
if self.user.id == 3:
return 'http://nicksergeant.com/{}/'.format(self.slug)
else:
return 'https://{}.snipt.net/{}/'.format(self.user.username, self.slug)
if settings.DEBUG:
root = 'http://snipt.localhost'
else:
root = 'https://snipt.net'
return '{}/{}/{}/'.format(root, self.user.username, self.slug)
def get_embed_url(self):

82
snipts/templates/snipts/snipt-list.html
View File

@ -7,7 +7,9 @@
<div class="group">
<div class="container">
<header>
<h2>{{ snipt.lexer_name }}</h2>
{% block lexer %}
<h2>{{ snipt.lexer_name }}</h2>
{% endblock %}
<h1><a href="{{ snipt.get_absolute_url }}">{% if snipt.title %}{{ snipt.title }}{% else %}Untitled{% endif %}</a></h1>
{% block extra-snipt-header %}{% endblock %}
</header>
@ -31,46 +33,48 @@
<div class="ruler top-x"></div>
<div class="ruler bottom-x"></div>
</div>
<aside>
<ul class="options">
{% if snipt.user == request.user %}
{% block aside %}
<aside>
<ul class="options">
{% if snipt.user == request.user %}
<li>
<a class="edit" href="#">Edit</a>
</li>
{% endif %}
<li>
<a class="edit" href="#">Edit</a>
<a class="embed" href="#">Embed</a>
</li>
{% endif %}
<li>
<a class="embed" href="#">Embed</a>
</li>
<li>
<a class="copy" href="#">Copy</a>
</li>
{% if snipt.user != request.user and request.user.is_authenticated %}
<li>
{% if is_favorited %}
<a class="favorite favorited" href="#">Favorited</a>
{% else %}
<a class="favorite unfavorited" href="#">Favorite</a>
{% endif %}
<a class="copy" href="#">Copy</a>
</li>
{% if snipt.user != request.user and request.user.is_authenticated %}
<li>
{% if is_favorited %}
<a class="favorite favorited" href="#">Favorited</a>
{% else %}
<a class="favorite unfavorited" href="#">Favorite</a>
{% endif %}
</li>
{% endif %}
</ul>
{% if snipt.tags.all %}
<section class="tags">
<h2>{{ snipt.tags.all|length }} tag{{ snipt.tags.all|pluralize }}</h2>
<ul>
{% for tag in snipt.sorted_tags %}
<li {% if forloop.counter > 3 and not detail %}class="hidden"{% endif %}>
{% if public %}
<a href="/public/tag/{{ tag.slug }}/">{{ tag }}</a>
{% else %}
<a href="/{{ snipt.user.username }}/tag/{{ tag.slug }}/">{{ tag }}</a>
{% endif %}
</li>
{% endfor %}
</ul>
</section>
{% endif %}
</ul>
{% if snipt.tags.all %}
<section class="tags">
<h2>{{ snipt.tags.all|length }} tag{{ snipt.tags.all|pluralize }}</h2>
<ul>
{% for tag in snipt.sorted_tags %}
<li {% if forloop.counter > 3 and not detail %}class="hidden"{% endif %}>
{% if public %}
<a href="/public/tag/{{ tag.slug }}/">{{ tag }}</a>
{% else %}
<a href="/{{ snipt.user.username }}/tag/{{ tag.slug }}/">{{ tag }}</a>
{% endif %}
</li>
{% endfor %}
</ul>
</section>
{% endif %}
</aside>
</aside>
{% endblock %}
</div>
<footer>
<ul class="attrs">
@ -80,11 +84,9 @@
<a href="{{ snipt.user.get_absolute_url }}">{{ snipt.user.username }}</a>
</li>
{% endblock %}
{% if snipt.blog_post %}
<li class="created" title="{{ snipt.publish_date|date:"Y-m-d\TH:i:s" }}">{{ snipt.publish_date|naturaltime }}</li>
{% else %}
{% block created %}
<li class="created" title="{{ snipt.created|date:"Y-m-d\TH:i:s" }}">{{ snipt.created|naturaltime }}</li>
{% endif %}
{% endblock %}
<li class="comments"><a href="{{ snipt.get_full_absolute_url }}#disqus_thread" data-disqus-identifier="{{ snipt.pk }}"></a></li>
</ul>
</footer>

4
snipts/views.py
View File

@ -7,7 +7,7 @@ from django.template import RequestContext
from annoying.decorators import render_to
from snipts.models import Favorite, Snipt
from django.db.models import Count
from blogs.views import blog_homepage, blog_list
from blogs.views import blog_list
from django.conf import settings
from django.db.models import Q
from taggit.models import Tag
@ -21,7 +21,7 @@ RESULTS_PER_PAGE = getattr(settings, 'HAYSTACK_SEARCH_RESULTS_PER_PAGE', 20)
def home(request):
if request.blog_user:
return blog_homepage(request)
return blog_list(request)
if request.user.is_authenticated():
return HttpResponseRedirect('/%s/' % request.user.username)