Re-designed footer. Adding footer to homepage.

apps/social/models.py

@@ -427,7 +427,7 @@ class MSocialProfile(mongo.Document):
         self.count_follows()
         self.save()
         
-        if followee.protected and not force:
+        if followee.protected and user_id != self.user_id and not force:
             if self.user_id not in followee.requested_follow_user_ids:
                 followee.requested_follow_user_ids.append(self.user_id)
                 MFollowRequest.add(self.user_id, user_id)
@@ -436,7 +436,7 @@ class MSocialProfile(mongo.Document):
         followee.count_follows()
         followee.save()
 
-        if followee.protected and not force:
+        if followee.protected and user_id != self.user_id and not force:
             from apps.social.tasks import EmailFollowRequest
             EmailFollowRequest.apply_async(kwargs=dict(follower_user_id=self.user_id,
                                                        followee_user_id=user_id),
@@ -448,9 +448,10 @@ class MSocialProfile(mongo.Document):
         follower_key = "F:%s:f" % (user_id)
         r.sadd(follower_key, self.user_id)
 
-        if self.user_id != user_id:
+        if user_id != self.user_id:
             MInteraction.new_follow(follower_user_id=self.user_id, followee_user_id=user_id)
             MActivity.new_follow(follower_user_id=self.user_id, followee_user_id=user_id)
+        
         socialsub, _ = MSocialSubscription.objects.get_or_create(user_id=self.user_id, 
                                                                  subscription_user_id=user_id)
         socialsub.needs_unread_recalc = True

media/css/reader.css

@@ -3869,6 +3869,8 @@ form.opml_import_form input {
     z-index: 1;
     margin: 0;
     padding: 0;
+    font-weight: 300;
+    font-family: "Lucida Sans", "Lucida Grande", Verdana, "Helvetica Neue", Helvetica, sans-serif;
 }
 
 .NB-splash-info .NB-splash-links .NB-splash-link {
@@ -3890,6 +3892,8 @@ form.opml_import_form input {
   -ms-transition: all .12s ease-out;
   background: transparent url('/media/embed/reader/spacer_16.png') no-repeat 0 -17px;
   background-size: 16px;
+  font-weight: bold;
+  text-rendering: optimizeLegibility;
 }
 
 @media screen and (max-width: 1150px) {
@@ -3898,21 +3902,34 @@ form.opml_import_form input {
         padding-left: 19px;
     }
 }
+@media screen and (max-width: 950px) {
+    .NB-splash-info .NB-splash-links .NB-splash-link a {
+        padding-right: 6px;
+        padding-left: 6px;
+    }
+    .NB-splash-info .NB-splash-links .NB-splash-link a:hover {
+        background: none !important;
+    }
+}
+.NB-splash-info .NB-splash-link-logo {
+    display: none;
+}
+.NB-body-main .NB-splash-info .NB-splash-link-logo {
+    float: right;
+    display: block;
+}
 .NB-splash-info .NB-splash-links .NB-splash-link.NB-splash-link-logo a {
     padding-top: 0;
     padding-bottom: 0;
     margin-top: -1px;
 }
 
+.NB-splash-info .NB-splash-links .NB-splash-link.NB-active a,
 .NB-splash-info .NB-splash-links .NB-splash-link-about a:hover,
 .NB-splash-info .NB-splash-links .NB-splash-link-faq a:hover,
 .NB-splash-info .NB-splash-links .NB-splash-link-api a:hover,
 .NB-splash-info .NB-splash-links .NB-splash-link-press a:hover {
-  background: transparent url('/media/embed/favicon_32.png') no-repeat 0 6px;
+  background: transparent url('/media/embed/favicon_32.png') no-repeat 0 7px;
-  background-size: 16px;
-}
-.NB-splash-info .NB-splash-links .NB-splash-link-github a:hover {
-  background: transparent url('/media/embed/reader/github.png') no-repeat 0 6px;
   background-size: 16px;
 }
 .NB-splash-info .NB-splash-links .NB-splash-link-ios a:hover {
@@ -3920,7 +3937,11 @@ form.opml_import_form input {
   background-size: 16px;
 }
 .NB-splash-info .NB-splash-links .NB-splash-link-android a:hover {
-  background: transparent url('/media/embed/reader/android_icon_round.png') no-repeat 0 6px;
+  background: transparent url('/media/embed/reader/android_icon_round.png') no-repeat 0 7px;
+  background-size: 16px;
+}
+.NB-splash-info .NB-splash-links .NB-splash-link-github a:hover {
+  background: transparent url('/media/embed/reader/github.png') no-repeat 0 6px;
   background-size: 16px;
 }
 .NB-splash-info .NB-splash-links .NB-splash-link-getsatisfaction a:hover {
@@ -3932,7 +3953,7 @@ form.opml_import_form input {
   background-size: 16px;
 }
 .NB-splash-info .NB-splash-links .NB-splash-link-twitter a:hover {
-  background: transparent url('/media/embed/reader/twitter_bird.png') no-repeat 0 6px;
+  background: transparent url('/media/embed/reader/twitter_bird.png') no-repeat 0 7px;
   background-size: 16px;
 }
 

media/css/welcome.css

@@ -18,11 +18,28 @@
     background-color: rgba(0, 0, 0, .4);
 }
 .NB-welcome .NB-splash-info.NB-splash-bottom {
-    position: static;
+    position: relative;
-    display: none !important;
+    height: auto;
+    float: left;
+    overflow: hidden;
+    border-top: 1px solid rgba(0, 0, 0, .4);
 }
-.NB-welcome .NB-splash-info.NB-splash-bottom .NB-splash-links {
+.NB-welcome .NB-splash-info .NB-splash-links {
-    display: none;
+    position: relative;
+    left: 50%;
+    width: auto;
+    float: left;
+}
+.NB-welcome .NB-splash-info .NB-splash-links li {
+    position: relative;
+    right: 50%;
+}
+.NB-welcome .NB-splash-info .NB-splash-links a {
+    color: rgba(255, 255, 255, .7);
+    text-shadow: 0 1px 0 rgba(0, 0, 0, .2);
+}
+.NB-welcome .NB-splash-info .NB-splash-links a:hover {
+    color: #F4DD43;
 }
 
 /* ========== */
@@ -35,9 +52,6 @@
     position: relative;
     height: 100%;
 }
-.NB-welcome .NB-splash-links {
-    overflow: hidden;
-}
 .NB-button {
     border: 1px solid #07360F;
     font-size: 12px;
@@ -599,16 +613,18 @@
 .NB-welcome-footer {
     overflow: hidden;
     clear: both;
-    padding: 42px 0 52px;
+    padding: 42px 0 0;
     color: #363C53;
     text-shadow: 0 1px 0 rgba(255, 255, 255, .7);
     line-height: 24px;
     background-color: #FAFAFA;
-    background: #F1E0D0 url(/media/img/welcome/footer_background.jpg) repeat center bottom;
+    background: #F1E0D0 url(/media/img/welcome/footer_background.jpg) repeat center top;
     background-size: 1438px 150px;
 
-    border-top: 4px solid rgba(0, 0, 0, .1);
+    border-top: 2px solid rgba(0, 0, 0, .1);
-    border-bottom: 6px solid rgba(0, 0, 0, .4);
+}
+.NB-welcome-footer .NB-welcome-footer-content {
+    margin-bottom: 46px;
 }
 .NB-welcome-footer .NB-footer-logo {
     vertical-align: text-bottom;

templates/base.html

@@ -118,22 +118,10 @@
       </div>
   
       {% block content %}{% endblock %}
-
+      
-      <div class="NB-splash-info NB-splash-bottom">
+      {% block footer %}
-        <ul class="NB-splash-links NB-inner">
+        {% render_footer "welcome" %}
-          <li class="NB-splash-link NB-splash-link-logo"><a href="{% url "index" %}"><img src="{{ MEDIA_URL }}/img/logo_newsblur_blur.png" style="height: 32px; width: 183px;" /></a></li>
+      {% endblock footer %}
-          <li class="NB-splash-link NB-splash-link-about"><a href="{% url "about" %}">About</a></li>
-          <li class="NB-splash-link NB-splash-link-faq"><a href="{% url "faq" %}">FAQ</a></li>
-          <li class="NB-splash-link NB-splash-link-api"><a href="{% url "api" %}">API</a></li>
-          <li class="NB-splash-link NB-splash-link-press"><a href="{% url "press" %}">Press</a></li>
-          <li class="NB-splash-link NB-splash-link-ios"><a href="{% url "ios-static" %}">iOS</a></li>
-          <li class="NB-splash-link NB-splash-link-android"><a href="{% url "android-static" %}">Android</a></li>
-          <li class="NB-splash-link NB-splash-link-github"><a href="http://github.com/samuelclay">GitHub</a></li>
-          <li class="NB-splash-link NB-splash-link-getsatisfaction"><a href="https://getsatisfaction.com/newsblur">Support</a></li>
-          <li class="NB-splash-link NB-splash-link-blog"><a href="http://blog.newsblur.com">The Blog</a></li>
-          <li class="NB-splash-link NB-first NB-splash-link-twitter"><a href="http://twitter.com/newsblur">@newsblur</a></li>
-        </ul>
-      </div>
       
   </div>
   

templates/reader/footer.xhtml

@@ -0,0 +1,17 @@
+<div class="NB-splash-info NB-splash-bottom">
+    <ul class="NB-splash-links NB-inner">
+        <li class="NB-splash-link NB-splash-link-about {% if page == "about" %}NB-active{% endif %}"><a href="{% url "about" %}">About</a></li>
+        <li class="NB-splash-link NB-splash-link-faq {% if page == "faq" %}NB-active{% endif %}"><a href="{% url "faq" %}">FAQ</a></li>
+        <li class="NB-splash-link NB-splash-link-api {% if page == "api" %}NB-active{% endif %}"><a href="{% url "api" %}">API</a></li>
+        <li class="NB-splash-link NB-splash-link-press {% if page == "press" %}NB-active{% endif %}"><a href="{% url "press" %}">Press</a></li>
+        <li class="NB-splash-link NB-splash-link-ios {% if page == "ios" %}NB-active{% endif %}"><a href="{% url "ios-static" %}">iOS</a></li>
+        <li class="NB-splash-link NB-splash-link-android {% if page == "android" %}NB-active{% endif %}"><a href="{% url "android-static" %}">Android</a></li>
+        <li class="NB-splash-link NB-splash-link-github"><a href="http://github.com/samuelclay">GitHub</a></li>
+        <li class="NB-splash-link NB-splash-link-getsatisfaction"><a href="https://getsatisfaction.com/newsblur">Support</a></li>
+        <li class="NB-splash-link NB-splash-link-blog"><a href="http://blog.newsblur.com">The Blog</a></li>
+        <li class="NB-splash-link NB-first NB-splash-link-twitter"><a href="http://twitter.com/newsblur">@newsblur</a></li>
+    </ul>
+
+    <div class="NB-splash-link NB-splash-link-logo"><a href="{% url "index" %}"><img src="{{ MEDIA_URL }}/img/logo_newsblur_blur.png" style="height: 32px; width: 183px;" /></a></div>
+
+</div>

templates/reader/welcome.xhtml

@@ -231,8 +231,14 @@
         </div>
     </div>
     
+</div>
+
+{% endblock %}
+
+{% block footer %}
+
     <footer class="NB-welcome-footer">
-        <div class="NB-inner">
+        <div class="NB-welcome-footer-content NB-inner">
             <div class="NB-footer-icons">
                 <a href="http://github.com/samuelclay" title="GitHub"><img src="{{ MEDIA_URL }}img/welcome/github_favicon.png"></a>
                 <a href="http://twitter.com/newsblur" title="Twitter"><img src="{{ MEDIA_URL }}img/welcome/twitter_favicon.png"></a>
@@ -244,7 +250,8 @@
                 @samuelclay
             </a>
         </div>
+        
+        {% render_footer "welcome" %}
+        
     </footer>
-</div>
+{% endblock footer %}
-
-{% endblock %}

templates/static/about.xhtml

@@ -1,5 +1,7 @@
 {% extends 'base.html' %}
 
+{% load utils_tags %}
+
 {% block bodyclass %}NB-static NB-static-about{% endblock %}
 
 {% block title %}About NewsBlur{% endblock %}
@@ -93,4 +95,9 @@
     </div>
   </div>
 
-{% endblock content %}
+{% endblock content %}
+
+
+{% block footer %}
+    {% render_footer "about" %}
+{% endblock footer %}

templates/static/android.xhtml

@@ -1,5 +1,7 @@
 {% extends 'base.html' %}
 
+{% load utils_tags %}
+
 {% block bodyclass %}NB-static NB-static-iphone NB-static-android{% endblock %}
 
 {% block title %}The NewsBlur Android App{% endblock %}
@@ -179,3 +181,7 @@ $(document).ready(function() {
 });
 </script>
 {% endblock %}
+
+{% block footer %}
+    {% render_footer "android" %}
+{% endblock footer %}

templates/static/api.xhtml

@@ -1,5 +1,7 @@
 {% extends 'base.html' %}
 
+{% load utils_tags %}
+
 {% block bodyclass %}NB-static NB-static-api{% endblock %}
 
 {% block title %}The NewsBlur API{% endblock %}
@@ -147,4 +149,8 @@
     </div>
   </div>
   
-{% endblock content %}
+{% endblock content %}
+
+{% block footer %}
+    {% render_footer "api" %}
+{% endblock footer %}

templates/static/faq.xhtml

@@ -1,5 +1,7 @@
 {% extends 'base.html' %}
 
+{% load utils_tags %}
+
 {% block bodyclass %}NB-static NB-static-faq{% endblock %}
 
 {% block title %}Frequently Asked Questions{% endblock %}
@@ -157,4 +159,8 @@
     </div>
 </div>
 
-{% endblock content %}
+{% endblock content %}
+
+{% block footer %}
+    {% render_footer "faq" %}
+{% endblock footer %}

templates/static/feedback.xhtml

@@ -1,5 +1,7 @@
 {% extends 'base.html' %}
 
+{% load utils_tags %}
+
 {% block bodyclass %}NB-static{% endblock %}
 
 {% block title %}Feedback on NewsBlur{% endblock %}

templates/static/ios.xhtml

@@ -1,5 +1,7 @@
 {% extends 'base.html' %}
 
+{% load utils_tags %}
+
 {% block bodyclass %}NB-static NB-static-iphone{% endblock %}
 
 {% block title %}The NewsBlur iPad & iPhone App{% endblock %}
@@ -179,3 +181,7 @@ $(document).ready(function() {
 });
 </script>
 {% endblock %}
+
+{% block footer %}
+    {% render_footer "ios" %}
+{% endblock footer %}

templates/static/press.xhtml

@@ -1,5 +1,7 @@
 {% extends 'base.html' %}
 
+{% load utils_tags %}
+
 {% block bodyclass %}NB-static NB-static-press{% endblock %}
 
 {% block title %}Press Kit and Recent Press{% endblock %}
@@ -562,4 +564,8 @@
     </div>
   </div>
 
-{% endblock content %}
+{% endblock content %}
+
+{% block footer %}
+    {% render_footer "press" %}
+{% endblock footer %}

utils/templatetags/utils_tags.py

@@ -78,6 +78,13 @@ def render_account_module(context):
         'social_profile': context['social_profile'],
         'feed_count': context['feed_count'],
     }
+    
+@register.inclusion_tag('reader/footer.xhtml', takes_context=True)
+def render_footer(context, page=None):
+    return {
+        'page': page,
+        'MEDIA_URL': settings.MEDIA_URL,
+    }
 
 @register.filter
 def get(h, key):