Tags

snipt/media/css/style.less

@@ -487,7 +487,7 @@ article.snipt {
         margin: 29px 30px 0 0;
         width: 100px;
 
-        ul {
+        ul.options {
             li {
                 margin: 2px 0;
 
@@ -526,6 +526,28 @@ article.snipt {
                 }
             }
         }
+        section.tags {
+            padding-top: 15px;
+
+            h2 {
+                background: transparent url('/media/images/snipt-tags-icon.png') 15px center no-repeat;
+                color: #999999;
+                font: bold 12px @Helvetica;
+                padding: 7px 0 7px 35px;
+            }
+            ul {
+                li {
+                    margin: 6px 10px 6px 35px;
+
+                    a {
+                        border-bottom: 1px solid #999;
+                        color: #999;
+                        font: normal 12px @Helvetica;
+                        text-decoration: none;
+                    }
+                }
+            }
+        }
     }
     footer {
         clear: both;

snipt/snipts/templates/snipts/snipt-list.html

@@ -22,7 +22,7 @@
             <div class="ruler bottom-x"></div>
         </div>
         <aside>
-            <ul>
+            <ul class="options">
                 {% if snipt.user == request.user %}
                     <li>
                         <a class="edit" href="#">Edit</a>
@@ -35,6 +35,16 @@
                     <a class="copy" href="#">Copy</a>
                 </li>
             </ul>
+            <section class="tags">
+                <h2>Tags</h2>
+                <ul>
+                    {% for tag in snipt.tags.all %}
+                        <li>
+                            <a href="">{{ tag }}</a>
+                        </li>
+                    {% endfor %}
+                </ul>
+            </section>
         </aside>
     </div>
     <footer>