Working on Pro

blogs/templates/blogs/themes/pro-adams/base.html

@@ -57,7 +57,7 @@
                         {% endif %}
                     </a>
                     <p>
-                        I'm a front-end developer in Rochester, NY working on the <a href="http://amara.org/">Amara</a> project for <a href="http://pculture.org/">PCF</a>. I also built <a href="https://snipt.net/">Snipt</a>.
+                        I'm a front-end web developer in Rochester, NY working on the <a href="http://amara.org/">Amara</a> project for <a href="http://pculture.org/">PCF</a>. I also built <a href="https://snipt.net/">Snipt</a>.
                     </p>
                 </div>
             </header>

blogs/templates/blogs/themes/pro-adams/snipt-list.html

@@ -1,9 +1,9 @@
-{% load snipt_tags %}
+{% load snipt_tags typogrify_tags %}
 
 <article class="group {% if detail %}detail{% endif %}">
     <div class="gutter"></div>
     <div class="content-inner">
-        <h1><a href="{{ snipt.get_full_absolute_url }}">{% firstof snipt.title 'Untitled' %}</a></h1>
+        <h1><a href="{{ snipt.get_full_absolute_url }}">{% firstof snipt.title|typogrify 'Untitled' %}</a></h1>
         <div class="post-content autumn">
             {% if snipt.lexer == 'markdown' %}
                 <div class="markdown">

media/css/blog-themes/pro-adams/style.scss

@@ -41,7 +41,7 @@ $Consolas: Consolas, Menlo, "Courier New", monospace;
     border-bottom-right-radius: $bottomRight;
     border-bottom-left-radius: $bottomLeft;
 }
-@mixin vertical-gradient($start: #000, $stop: #FFF) { background: ($start + $stop) / 2;
+@mixin vertical-gradient($start: #000, $stop: #FFF) { background: ($start);
     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%);
@@ -163,6 +163,7 @@ header.main {
             a {
                 color: #B7B7B7;
                 font-weight: bold;
+                text-decoration: underline;
                 -webkit-transition: color .05s linear;
                 -moz-transition: color .05s linear;
                 -o-transition: color .05s linear;
@@ -200,7 +201,7 @@ section.main {
             margin-bottom: 40px;
 
             h1 {
-                color: #999;
+                color: #666;
                 font: bold 12px $Helvetica;
                 margin-bottom: 10px;
             }
@@ -243,10 +244,12 @@ section.main {
 }
 div.pagination {
     clear: left;
-    margin-left: 96px;
+    margin-bottom: 40px;
+    margin-left: 40px;
+    text-align: center;
 }
 article {
-    margin: 50px 0;
+    margin: 40px 0;
 
     h1 {
         margin-bottom: 20px;
@@ -263,17 +266,24 @@ article {
 
             &:hover {
                 color: #000;
+                text-decoration: none;
             }
         }
     }
     div.post-content {
         color: #666;
         font: normal 14px/22px $Helvetica;
+        max-height: 200px;
+        position: relative;
+        overflow: hidden;
 
         p {
             margin: 20px 0;
 
-            &:last-of-type {
+            &:first-child {
+                margin-top: 0;
+            }
+            &:last-child {
                 margin-bottom: 0;
             }
         }
@@ -285,7 +295,6 @@ article {
             }
         }
         table.highlighttable {
-            background: #F7F7F7;
             height: 100%;
         }
         td {
@@ -293,74 +302,69 @@ article {
             vertical-align: top;
 
             &.linenos {
-                border-right: 1px solid #EEEEEE;
+                display: none;
-                min-width: 24px;
-
-                div.linenodiv {
-                    pre {
-                        border: 0;
-                        line-height: 16px;
-                        margin: 0;
-                        padding: 5px 3px 0 7px;
-                        white-space: normal;
-                        @include border-radius(0);
-
-                        span {
-                            color: #AAA;
-                            display: block;
-                            font: normal 12px/16px $Consolas;
-                            line-height: 16px;
-                            margin: 0;
-                            padding: 0;
-                            text-align: right;
-                            text-decoration: none;
-                            white-space: nowrap;
-                        }
-                    }
-                }
             }
-            &.code {
+        }
-                background: #FFFFFF;
+        div.highlight, div.markdown {
+            pre {
+                background: #F7F7F7;
+                border: 1px solid #EAEAEA;
+                font: normal 12px/16px $Consolas;
+                margin: 0;
+                overflow-x: auto;
+                padding: 10px;
+                white-space: pre;
+                word-wrap: normal;
+                width: 609px;
+                @include border-radius(5px);
 
-                div.highlight {
+                &::-webkit-scrollbar {
-                    pre {
+                    background: #F7F7F7;
-                        background: transparent;
+                    height: 16px;
-                        border: none;
+                    width: 16px;
-                        font: normal 12px/16px $Consolas;
+                    -webkit-appearance: none;
-                        margin: 0;
+                    @include border-radius(5px);
-                        overflow-x: auto;
+                }
-                        padding: 5px;
+                &::-webkit-scrollbar-thumb {
-                        white-space: pre;
+                    border: 4px solid #F7F7F7;
-                        word-wrap: normal;
+                    border-radius: 16px;
-                        width: 583px;
+                    background-color: #C7C7C7;
-                        @include border-radius(0);
-
-                        &::-webkit-scrollbar {
-                            background: #F7F7F7;
-                            height: 16px;
-                            width: 16px;
-                            -webkit-appearance: none;
-                        }
-                        &::-webkit-scrollbar-thumb {
-                            border: 4px solid #F7F7F7;
-                            border-radius: 16px;
-                            background-color: #C7C7C7;
-                        }
-                    }
                 }
             }
         }
         div.markdown {
-            pre {
+            p {
-                min-height: 0;
+                strong {
-                margin: 20px 0 !important;
+                    font-weight: bold;
+                }
             }
+            pre {
+                margin: 20px 0;
+
+                &:first-child {
+                    margin-top: 0;
+                }
+                &:last-child {
+                    margin-bottom: 0;
+                }
+            }
+        }
+        &:after {
+            bottom: 0;
+            content: "";
+            height: 60px;
+            left: 0;
+            position: absolute;
+            width: 100%;
+            @include vertical-gradient(rgba(255, 255, 255, 0), white);
         }
     }
     &:first-of-type {
         margin-top: 0;
     }
-    &:last-of-type {
+    &.detail {
-        margin-bottom: 0;
+        div.post-content {
+            max-height: none;
+        }
     }
 }

media/css/compile-css.sh

@@ -1,6 +1,7 @@
 #!/bin/bash
 
-cat media/css/reset.css \
+cat media/css/bootstrap.css \
+    media/css/reset.css \
     media/css/blog-themes/pro-adams/style.css \
     media/css/themes.css \
     > media/css/pro.css

requirements.txt

@@ -30,3 +30,4 @@ git+https://github.com/toastdriven/django-haystack.git@master#egg=django-haystac
 hg+https://bitbucket.org/ubernostrum/django-registration#egg=django-registration
 git+https://github.com/toastdriven/django-tastypie.git#egg=django-tastypie
 git+git://github.com/jbalogh/django-cache-machine.git#egg=django-cache-machine
+git+git://github.com/mintchaos/typogrify.git#egg=typogrify

settings.py

@@ -126,7 +126,6 @@ TEMPLATE_DIRS = (
 
 INSTALLED_APPS = (
     'gunicorn',
-    #'grappelli',
 
     'django.contrib.auth',
     'django.contrib.contenttypes',
@@ -146,6 +145,7 @@ INSTALLED_APPS = (
     'south',
     'taggit',
     'tastypie',
+    'typogrify',
 
     'accounts',
     'blogs',
@@ -182,9 +182,6 @@ SERVER_EMAIL = 'support@snipt.net'
 EMAIL_BACKEND = 'postmark.django_backend.EmailBackend'
 POSTMARK_API_KEY = '608d3101-1706-4a96-819f-f2f36fe00fe0'
 
-# Grappelli settings
-GRAPPELLI_ADMIN_TITLE = '<a href="/">Snipt</a>'
-
 # Virtualenv
 if DEBUG:
     VIRTUALENV_PATH = '/Users/Nick/.virtualenvs/snipt/lib/python2.7/site-packages/'