Redesigned news feed page, did cleanup of shortcuts generator.

misago/markdown/factory.py

@@ -10,23 +10,28 @@ class ClearHTMLParser(HTMLParser):
     def __init__(self):
         HTMLParser.__init__(self)
         self.clean_text = ''
+        self.lookback = []
         
     def handle_starttag(self, tag, attrs):
+        self.lookback.append(tag)
+
+    def handle_endtag(self, tag):
         try:
-            if tag == 'img':
-                for attr in attrs:
-                    if attr[0] == 'src':
-                        self.clean_text += attr[1]
-            if tag == 'a':
-                for attr in attrs:
-                    if attr[0] == 'href':
-                        self.clean_text += attr[1]
-        except IndexError, KeyError:
+            if self.lookback[-1] == tag:
+                self.lookback.pop()
+        except IndexError:
             pass
+
         
     def handle_data(self, data):
+        # String does not repeat itself
         if self.clean_text[-len(data):] != data:
-            self.clean_text += ' %s' % data
+            # String is not "QUOTE"
+            try:
+                if not (data == 'Quote' and self.lookback[-1] == 'h3' and self.lookback[-2] == 'blockquote'):
+                    self.clean_text += ' %s' % data
+            except IndexError:
+                self.clean_text += ' %s' % data
 
 
 def clear_markdown(text):

static/cranefly/css/cranefly.css

@@ -5769,6 +5769,8 @@ footer .credits a:hover {
 .navbar .navbar-inner .navbar-blocks li .btn-link .label {
   background-color: #cf402e;
   margin-left: 4px;
+  padding-left: 6px;
+  padding-right: 5px;
   position: relative;
   bottom: 1px;
 }
@@ -6789,6 +6791,41 @@ a.btn-link:focus {
   color: #999999;
   text-align: right;
 }
+.news-feed .media {
+  overflow: auto;
+}
+.news-feed .media .media-object {
+  border-radius: 3px;
+  width: 52px;
+  height: 52px;
+}
+.news-feed .media .media-body {
+  margin-left: 66px;
+}
+.news-feed .media .media-body .post-preview:link,
+.news-feed .media .media-body .post-preview:active,
+.news-feed .media .media-body .post-preview:visited,
+.news-feed .media .media-body .post-preview:hover {
+  display: block;
+  margin-top: 7px;
+  color: #333333;
+  font-size: 16.8px;
+  text-decoration: none;
+}
+.news-feed .media .media-body .media-footer {
+  margin: 0px;
+  color: #999999;
+  font-size: 10.5px;
+  font-weight: normal;
+}
+.news-feed .media .media-body .media-footer a {
+  color: #555555;
+}
+.news-feed hr {
+  border: none;
+  border-top: 1px solid #eeeeee;
+  margin: 20px 0px;
+}
 .category-forums-list {
   background-color: #ffffff;
   border: 1px solid #d5d5d5;

static/cranefly/css/cranefly.less

@@ -83,6 +83,7 @@
 @import "cranefly/popularthreads.less";
 @import "cranefly/watchedthreads.less";
 @import "cranefly/alerts.less";
+@import "cranefly/newsfeed.less";
 @import "cranefly/category.less";
 
 // Keep ranks last for easy overrides!

static/cranefly/css/cranefly/navbar.less

@@ -78,6 +78,8 @@
           .label {
             background-color: @red;
             margin-left: 4px;
+            padding-left: 6px;
+            padding-right: 5px;
             position: relative;
             bottom: 1px;
           }

static/cranefly/css/cranefly/newsfeed.less

@@ -0,0 +1,47 @@
+// News feed
+// -------------------------
+
+.news-feed {
+  .media {
+    overflow: auto;
+
+    .media-object {
+      border-radius: @baseBorderRadius;
+      width: 52px;
+      height: 52px;
+    }
+
+    .media-body {
+      margin-left: 52px + @baseFontSize;
+
+      .post-preview {
+        &:link, &:active, &:visited, &:hover {
+          display: block;
+          margin-top: @baseFontSize / 2;
+
+          color: @textColor;
+          font-size: @baseFontSize * 1.2;
+          text-decoration: none;
+        }
+      }
+
+      .media-footer {
+        margin: 0px;
+
+        color: @grayLight;
+        font-size: @fontSizeMini;
+        font-weight: normal;
+
+        a {
+          color: @gray;
+        }
+      }
+    }
+  }
+
+  hr {
+    border: none;
+    border-top: 1px solid @grayLighter;
+    margin: @baseLineHeight 0px;
+  }
+}

templates/cranefly/newsfeed.html

@@ -6,47 +6,56 @@
 
 {% block title %}{{ macros.page_title(_('Your News Feed')) }}{% endblock %}
 
-{% block content %}
-<div class="page-header">
-  <h1>{% trans %}Your News Feed{% endtrans %}</h1>
+{% block container %}
+<div class="page-header header-primary">
+  <div class="container">
+    {% if messages %}
+    <div class="messages-list">
+      {{ messages_list(messages) }}
+    </div>
+    {% endif %}
+    <h1>{% trans %}Your News Feed{% endtrans %}</h1>
+  </div>
 </div>
 
-{% if follows %}
-<p class="lead">{% trans count=follows|length -%}
-    You are following one member, find out what he posted recently:
-    {%- pluralize -%}
-    You are following {{ count }} members, find out what they posted recently:
-    {%- endtrans %}</p>
-{% if posts %}
-<ul class="unstyled shorts-list">
-  {% for item in posts %}
-  <li>
-    <img src="{{ item.user.get_avatar(36) }}" class="avatar">
-    <p class="message"><a href="{% url 'thread_find' thread=item.thread.pk, slug=item.thread.slug, post=item.pk %}">{{ item.post_preparsed|markdown_short(300) }}</a></p>
-    <p class="location">{% if item.thread.start_post_id == item.pk -%}
+<div class="container container-primary">
+  {% if follows %}
+  {% if posts %}
+  <div class="news-feed">
+    {% for item in posts %}
+    <div class="media">
+      <a href="{% url 'user' user=item.user.pk, username=item.user.username_slug %}" class="pull-left">
+        <img class="media-object" src="{{ item.user.get_avatar(52) }}">
+      </a>
+      <div class="media-body">
+        <a href="{% url 'thread_find' thread=item.thread.pk, slug=item.thread.slug, post=item.pk %}" class="post-preview">{{ item.post_preparsed|markdown_short(300) }}</a>
+        <div class="media-footer">{% if item.thread.start_post_id == item.pk -%}
         {% trans thread=thread(item), forum=forum(item.forum), user=username(item.user), date=item.date|reldate|low %}Thread {{ thread }} posted in {{ forum }} by {{ user }} {{ date }}{% endtrans %}
         {%- else -%}
         {% trans thread=thread(item), forum=forum(item.forum), user=username(item.user), date=item.date|reldate|low %}Reply to {{ thread }} posted in {{ forum }} by {{ user }} {{ date }}{% endtrans %}
-        {%- endif %}</p>
-  </li>
-  {% endfor %}
-</ul>
-{% else %}
-<p class="lead">{% trans username=user.username %}{{ username }}, there is nothing to display in your news feed... yet!{% endtrans %}</p>
-{% endif %}
-{% else %}
-<p class="lead">{% trans username=user.username %}{{ username }}, you have to follow other users in order to fill your news feed.{% endtrans %}</p>
-{% endif %}
+        {%- endif %}</div>
+      </div>
+    </div>
+    <hr>
+    {% endfor %}
+  </div>
+  {% else %}
+  <p class="lead">{% trans username=user.username %}{{ username }}, there is nothing to display in your news feed... yet!{% endtrans %}</p>
+  {% endif %}
+  {% else %}
+  <p class="lead">{% trans username=user.username %}{{ username }}, you have to follow other users in order to fill your news feed.{% endtrans %}</p>
+  {% endif %}
+</div>
 {% endblock %}
 
 {% macro thread(item) -%}
-<a href="{% url 'thread_find' thread=item.thread.pk, slug=item.thread.slug, post=item.pk %}">{{ item.thread.name }}</a>
+<a href="{% url 'thread_find' thread=item.thread.pk, slug=item.thread.slug, post=item.pk %}" class="thread-link">{{ item.thread.name }}</a>
 {%- endmacro %}
 
 {% macro forum(forum) -%}
-<a href="{% url 'forum' forum=forum.pk, slug=forum.slug %}">{{ forum.name }}</a>
+<a href="{% url 'forum' forum=forum.pk, slug=forum.slug %}" class="forum-link">{{ forum.name }}</a>
 {%- endmacro %}
 
 {% macro username(user) -%}
-<a href="{% url 'user' user=user.pk, username=user.username_slug %}">{{ user.username }}</a>
+<a href="{% url 'user' user=user.pk, username=user.username_slug %}" class="user-link">{{ user.username }}</a>
 {%- endmacro %}