diff --git a/media/css/reader.css b/media/css/reader.css index f6262748a..50c443cfc 100644 --- a/media/css/reader.css +++ b/media/css/reader.css @@ -1496,6 +1496,7 @@ body { text-decoration: none; color: #272727; line-height: 14px; + font-size: 12px; /* background-color: white; border-top: 1px solid #E7EDF6; border-bottom: 1px solid #FFF; @@ -1618,13 +1619,43 @@ body { #story_titles .NB-story-title .story_title .NB-storytitles-author { padding-left: 12px; color: #808080; - font-size: 9px; + font-size: 10px; } #story_titles .NB-story-title.NB-selected .story_title .NB-storytitles-author { /* text-shadow: 1px 1px 0 rgba(255, 255, 255, .5);*/ } +#story_titles .NB-storytitles-content-preview { + color: #737C75; + font-size: 11px; + line-height: 2.2em; + overflow: hidden; + font-weight: normal; + height: 20px; + text-overflow: ellipsis; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; + + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + display: -webkit-box; + +} +.NB-story-pane-west #story_titles .NB-storytitles-content-preview { + -webkit-line-clamp: 2; + line-height: 14px; + height: 36px; + padding: 6px 0 0; +} + +.NB-story-layout-list #story_titles .NB-selected .NB-storytitles-content-preview { + display: none; +} +#story_titles .read .NB-storytitles-content-preview { + color: #A2B2A5; +} #story_titles .NB-storytitles-shares { position: absolute; height: 16px; @@ -1663,7 +1694,7 @@ body { position: absolute; } .NB-story-pane-west #story_titles .NB-story-title .NB-story-feed { - left: -22px; + left: -18px; } .NB-view-river #story_titles .NB-story-title .NB-story-feed { display: block; @@ -1673,10 +1704,13 @@ body { top: -2px; left: 0; vertical-align: text-bottom; - opacity: .6; + opacity: .65; height: 16px; width: 16px; } +#story_titles .NB-story-title.read .feed_favicon { + opacity: .4; +} #story_titles .NB-story-title .NB-story-feed .feed_title { display: block; @@ -1753,16 +1787,18 @@ body { right: 4px; width: 200px; top: 5px; + font-size: 11px; } .NB-story-pane-west #story_titles .NB-story-title .story_date { position: static; margin: 0 0 4px 4px; - color: #888C9B; + color: #9197B1; top: 0; left: 0; right: 0; display: block; - font-size: 9px; + font-size: 10px; + font-weight: normal; clear: both; } #story_titles .NB-story-title.NB-selected .story_date { diff --git a/media/js/newsblur/models/stories.js b/media/js/newsblur/models/stories.js index 5589834b9..3da960562 100644 --- a/media/js/newsblur/models/stories.js +++ b/media/js/newsblur/models/stories.js @@ -33,6 +33,13 @@ NEWSBLUR.Models.Story = Backbone.Model.extend({ return score_name; }, + content_preview: function() { + var content = this.get('story_content'); + content = content && Inflector.stripTags(content); + + return _.string.prune(content, 150, "..."); + }, + formatted_short_date: function() { var timestamp = this.get('story_timestamp'); var dateformat = NEWSBLUR.assets.preference('dateformat'); @@ -181,7 +188,7 @@ NEWSBLUR.Models.Story = Backbone.Model.extend({ return tags || []; }, - + unused_story_tags: function() { var tags = _.reduce(this.get('user_tags') || [], function(m, t) { return _.without(m, t); diff --git a/media/js/newsblur/reader/reader.js b/media/js/newsblur/reader/reader.js index b29108ba0..d8b836eb2 100644 --- a/media/js/newsblur/reader/reader.js +++ b/media/js/newsblur/reader/reader.js @@ -477,6 +477,10 @@ this.$s.$body.toggleClass('NB-is-anonymous', NEWSBLUR.Globals.is_anonymous); this.$s.$body.toggleClass('NB-is-authenticated', NEWSBLUR.Globals.is_authenticated); this.$s.$body.toggleClass('NB-pref-hide-changes', !!this.model.preference('hide_story_changes')); + this.$s.$body.removeClass('NB-story-layout-full') + .removeClass('NB-story-layout-split') + .removeClass('NB-story-layout-list') + .addClass('NB-story-layout-'+NEWSBLUR.assets.preference('story_layout')); }, hide_splash_page: function() { @@ -1479,7 +1483,7 @@ this.switch_to_correct_view(); this.make_feed_title_in_stories(); - + this.add_body_classes(); _.defer(function() { NEWSBLUR.app.story_titles.scroll_to_selected_story(); diff --git a/media/js/newsblur/views/story_title_view.js b/media/js/newsblur/views/story_title_view.js index cd7b1a753..b7090ee36 100644 --- a/media/js/newsblur/views/story_title_view.js +++ b/media/js/newsblur/views/story_title_view.js @@ -27,7 +27,8 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({ story : this.model, feed : (NEWSBLUR.reader.flags.river_view || NEWSBLUR.reader.flags.social_view) && NEWSBLUR.assets.get_feed(this.model.get('story_feed_id')), - options : this.options + options : this.options, + show_content_preview : NEWSBLUR.assets.preference('show_content_preview') })); this.$st = this.$(".NB-story-title"); this.toggle_classes(); @@ -53,6 +54,9 @@ NEWSBLUR.Views.StoryTitleView = Backbone.View.extend({
\ <%= story.get("story_title") %>\ <%= story.get("story_authors") %>\ + <% if (show_content_preview) { %>\ +
<%= story.content_preview() %>
\ + <% } %>\ \ <%= story.formatted_short_date() %>\ <% if (story.get("comment_count_friends")) { %>\ diff --git a/templates/base.html b/templates/base.html index 0fbf8d236..4a9ffdc79 100644 --- a/templates/base.html +++ b/templates/base.html @@ -73,6 +73,7 @@ 'title_counts' : true, 'truncate_story' : 'social', 'autoopen_folder' : false, + 'show_content_preview' : true, 'doubleclick_feed' : 'open', 'doubleclick_unread' : 'markread', 'story_share_twitter' : true,