From 04dc3ecbd823ce596730e17b2594ca593a9b0f2c Mon Sep 17 00:00:00 2001 From: Nick Sergeant Date: Mon, 20 Aug 2012 21:48:37 -0400 Subject: [PATCH] Header for pro-adams theme. --- .kick | 2 +- .../blogs/themes/pro-adams/base.html | 30 +++---- .../blogs/themes/pro-adams/list.html | 41 +++------- .../blogs/themes/pro-adams/post.html | 49 +++++------- .../blogs/themes/pro-adams/snipt-list.html | 10 +-- blogs/views.py | 20 ++--- media/css/blog-themes/pro-adams/style.css | 2 +- media/css/blog-themes/pro-adams/style.scss | 79 ++++++++++++++++++- media/css/compile-css.sh | 4 + media/css/pro.css | 34 ++++++++ media/css/reset.css | 33 ++++++++ snipts/models.py | 5 +- 12 files changed, 207 insertions(+), 102 deletions(-) create mode 100644 media/css/pro.css create mode 100644 media/css/reset.css diff --git a/.kick b/.kick index 964570f..70faa1c 100644 --- a/.kick +++ b/.kick @@ -1,7 +1,7 @@ process do |files| files.take_and_map do |file| case file - when %r{^(.+).scss$} + when %r{^(.+).s?css$} execute "scss -t compressed media/css/style.scss media/css/style.css" execute "scss -t compressed media/css/blog-themes/default/style.scss media/css/blog-themes/default/style.css" execute "scss -t compressed media/css/blog-themes/pro-adams/style.scss media/css/blog-themes/pro-adams/style.css" diff --git a/blogs/templates/blogs/themes/pro-adams/base.html b/blogs/templates/blogs/themes/pro-adams/base.html index d7515bb..dfa517c 100644 --- a/blogs/templates/blogs/themes/pro-adams/base.html +++ b/blogs/templates/blogs/themes/pro-adams/base.html @@ -13,7 +13,7 @@ - + {% if has_snipts and not detail %} @@ -37,11 +37,15 @@
- +
+
{% block header %}
-

- + +

+

+ I'm a front-end developer in Rochester, NY working full-time on the Amara project for PCF. I founded Snipt. +

+
{% endblock %} - + {% if not debug %} @@ -70,17 +77,6 @@ s.parentNode.insertBefore(t, s); })(); - {% endif %} diff --git a/blogs/templates/blogs/themes/pro-adams/list.html b/blogs/templates/blogs/themes/pro-adams/list.html index c9c3de7..5542d29 100644 --- a/blogs/templates/blogs/themes/pro-adams/list.html +++ b/blogs/templates/blogs/themes/pro-adams/list.html @@ -2,44 +2,23 @@ {% load pagination_tags %} -{% block body-class %}{{ block.super }} blog-list{% endblock %} - -{% block js %} - {{ block.super }} - window.detail = false; -{% endblock %} +{% block body-class %}list{% endblock %} {% block content %} -
- {% autopaginate snipts 10 %} - {% for snipt in snipts %} - {% include "blogs/themes/pro-adams/snipt-list.html" %} - {% empty %} -
- {{ blog_user.username }} has no public blog posts. -
- {% endfor %} - {% paginate %} -
+ {% autopaginate snipts 10 %} + {% for snipt in snipts %} + {% include "blogs/themes/pro-adams/snipt-list.html" %} + {% empty %} +
+ {{ blog_user.username }} has no public blog posts. +
+ {% endfor %} + {% paginate %} - - + (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); + })(); + {% endblock %} diff --git a/blogs/templates/blogs/themes/pro-adams/snipt-list.html b/blogs/templates/blogs/themes/pro-adams/snipt-list.html index bb9c120..fd5e0b2 100644 --- a/blogs/templates/blogs/themes/pro-adams/snipt-list.html +++ b/blogs/templates/blogs/themes/pro-adams/snipt-list.html @@ -1,7 +1,5 @@ -{% extends "snipts/snipt-list.html" %} +{{ snipt.title }}
-{% load humanize %} - -{% block aside %}{% endblock %} -{% block author %}{% endblock %} -{% block lexer %}{% endblock %} +{% if detail %} + {{ snipt.stylized|safe }} +{% endif %} diff --git a/blogs/views.py b/blogs/views.py index 5e6a43f..467850d 100644 --- a/blogs/views.py +++ b/blogs/views.py @@ -35,12 +35,10 @@ def blog_list(request, username_or_custom_slug=None): context['snipts'] = context['snipts'][:20] return rss(request, context) - #if request.blog_user.profile.is_pro and settings.DEBUG: - #template = 'blogs/themes/pro-adams/list.html' - #else: - #template = 'blogs/themes/default/list.html' - - template = 'blogs/themes/default/list.html' + if request.blog_user.profile.is_pro and settings.DEBUG: + template = 'blogs/themes/pro-adams/list.html' + else: + template = 'blogs/themes/default/list.html' return render_to_response( template, @@ -70,12 +68,10 @@ def blog_post(request, username_or_custom_slug): 'snipt': snipt, } - #if request.blog_user.profile.is_pro and settings.DEBUG: - #template = 'blogs/themes/pro-adams/post.html' - #else: - #template = 'blogs/themes/default/post.html' - - template = 'blogs/themes/default/post.html' + if request.blog_user.profile.is_pro and settings.DEBUG: + template = 'blogs/themes/pro-adams/post.html' + else: + template = 'blogs/themes/default/post.html' return render_to_response( template, diff --git a/media/css/blog-themes/pro-adams/style.css b/media/css/blog-themes/pro-adams/style.css index 2fc64d0..825c728 100644 --- a/media/css/blog-themes/pro-adams/style.css +++ b/media/css/blog-themes/pro-adams/style.css @@ -1 +1 @@ -html,body{background:#F2F2F2;margin:0;padding:0}body{color:#666;font:normal 14px/16px "Helvetica Neue",Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;text-rendering:optimizeLegibility}.group:after{content:".";display:block;height:0;clear:both;visibility:hidden}.hidden{display:none} +html,body{background:#FFF}body{color:#666;font:normal 14px/16px "Helvetica Neue",Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;text-rendering:optimizeLegibility}.group:after{content:".";display:block;height:0;clear:both;visibility:hidden}.hidden{display:none}div.frame{margin:0 auto;position:relative;width:980px}div.frame div.ruler{background:#EAEAEA;height:100%;position:fixed;top:0;width:1px;z-index:49}div.frame div.left-y{margin-left:40px}div.frame div.right-y{margin-left:760px}header.main{padding:20px 0;position:relative;z-index:50}header.main a.logo{display:inline-block}header.main a.logo span.avatar{display:inline-block;height:80px;width:80px;-webkit-background-clip:padding-box;-webkit-border-radius:80px;-moz-background-clip:padding-box;-moz-border-radius:80px;border-radius:80px;background-clip:padding-box}header.main div.bio{display:inline-block;margin:9px 0 0 12px;vertical-align:top}header.main div.bio a.name{color:#666;font:500 18px "Helvetica Neue",Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;text-decoration:none;-webkit-transition:color .08s linear;-moz-transition:color .08s linear;-o-transition:color .08s linear;transition:color .08s linear}header.main div.bio a.name:hover{color:black}header.main div.bio p{color:#B7B7B7;font:500 12px "Helvetica Neue",Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;line-height:18px;margin-top:1px;max-width:400px}header.main div.bio p a{color:#B7B7B7;font-weight:bold;-webkit-transition:color .08s linear;-moz-transition:color .08s linear;-o-transition:color .08s linear;transition:color .08s linear}header.main div.bio p a:hover{color:#666} diff --git a/media/css/blog-themes/pro-adams/style.scss b/media/css/blog-themes/pro-adams/style.scss index 4b749d3..d2fa3b9 100644 --- a/media/css/blog-themes/pro-adams/style.scss +++ b/media/css/blog-themes/pro-adams/style.scss @@ -60,9 +60,7 @@ $Consolas: Consolas, Menlo, "Courier New", monospace; // Page html, body { - background: #F2F2F2; - margin: 0; - padding: 0; + background: #FFF; } body { color: #666; @@ -83,3 +81,78 @@ body { } // Global +div.frame { + margin: 0 auto; + position: relative; + width: 980px; + + div.ruler { + background: #EAEAEA; + height: 100%; + position: fixed; + top: 0; + width: 1px; + z-index: 49; + } + div.left-y { + margin-left: 40px; + } + div.right-y { + margin-left: 760px; + } +} +header.main { + padding: 20px 0; + position: relative; + z-index: 50; + + a.logo { + display: inline-block; + + span.avatar { + display: inline-block; + height: 80px; + width: 80px; + @include border-radius(80px); + } + } + div.bio { + display: inline-block; + margin: 9px 0 0 12px; + vertical-align: top; + + a.name { + color: #666; + font: 500 18px $Helvetica; + text-decoration: none; + -webkit-transition: color .08s linear; + -moz-transition: color .08s linear; + -o-transition: color .08s linear; + transition: color .08s linear; + + &:hover { + color: black; + } + } + p { + color: #B7B7B7; + font: 500 12px $Helvetica; + line-height: 18px; + margin-top: 1px; + max-width: 400px; + + a { + color: #B7B7B7; + font-weight: bold; + -webkit-transition: color .08s linear; + -moz-transition: color .08s linear; + -o-transition: color .08s linear; + transition: color .08s linear; + + &:hover { + color: #666; + } + } + } + } +} diff --git a/media/css/compile-css.sh b/media/css/compile-css.sh index fd3bf45..c8ff053 100755 --- a/media/css/compile-css.sh +++ b/media/css/compile-css.sh @@ -1,5 +1,9 @@ #!/bin/bash +cat media/css/reset.css \ + media/css/blog-themes/pro-adams/style.css \ + > media/css/pro.css + cat media/css/bootstrap.css \ media/css/style.css \ media/css/themes.css \ diff --git a/media/css/pro.css b/media/css/pro.css new file mode 100644 index 0000000..dd3f676 --- /dev/null +++ b/media/css/pro.css @@ -0,0 +1,34 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} +html,body{background:#FFF}body{color:#666;font:normal 14px/16px "Helvetica Neue",Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;text-rendering:optimizeLegibility}.group:after{content:".";display:block;height:0;clear:both;visibility:hidden}.hidden{display:none}div.frame{margin:0 auto;position:relative;width:980px}div.frame div.ruler{background:#EAEAEA;height:100%;position:fixed;top:0;width:1px;z-index:49}div.frame div.left-y{margin-left:40px}div.frame div.right-y{margin-left:760px}header.main{padding:20px 0;position:relative;z-index:50}header.main a.logo{display:inline-block}header.main a.logo span.avatar{display:inline-block;height:80px;width:80px;-webkit-background-clip:padding-box;-webkit-border-radius:80px;-moz-background-clip:padding-box;-moz-border-radius:80px;border-radius:80px;background-clip:padding-box}header.main div.bio{display:inline-block;margin:9px 0 0 12px;vertical-align:top}header.main div.bio a.name{color:#666;font:500 18px "Helvetica Neue",Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;text-decoration:none;-webkit-transition:color .08s linear;-moz-transition:color .08s linear;-o-transition:color .08s linear;transition:color .08s linear}header.main div.bio a.name:hover{color:black}header.main div.bio p{color:#B7B7B7;font:500 12px "Helvetica Neue",Helvetica,Arial,"Liberation Sans",FreeSans,sans-serif;line-height:18px;margin-top:1px;max-width:400px}header.main div.bio p a{color:#B7B7B7;font-weight:bold;-webkit-transition:color .08s linear;-moz-transition:color .08s linear;-o-transition:color .08s linear;transition:color .08s linear}header.main div.bio p a:hover{color:#666} diff --git a/media/css/reset.css b/media/css/reset.css new file mode 100644 index 0000000..d42aa09 --- /dev/null +++ b/media/css/reset.css @@ -0,0 +1,33 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} diff --git a/snipts/models.py b/snipts/models.py index 4bda44c..dcbda3c 100644 --- a/snipts/models.py +++ b/snipts/models.py @@ -134,7 +134,10 @@ class Snipt(models.Model): if self.blog_post: if self.user.id == 3: - return 'http://nicksergeant.com/{}/'.format(self.slug) + if settings.DEBUG: + return 'http://nick.snipt.localhost/{}/'.format(self.slug) + else: + return 'http://nicksergeant.com/{}/'.format(self.slug) elif self.user.id == 2156: return 'http://rochacbruno.com.br/{}/'.format(self.slug) elif self.user.id == 10325: