Adding small border radius to story images.

This commit is contained in:
Samuel Clay 2022-04-28 12:54:21 -04:00
parent df30cd36f1
commit f42b26b18c
4 changed files with 41 additions and 10 deletions

View file

@ -1863,6 +1863,13 @@ background-color: #E6ECE8;}
left: -31px;
top: 12px;
}
.NB-theme-feed-size-xs .NB-storytitles-sentiment {
top: 9px;
}
.NB-theme-feed-size-s .NB-storytitles-sentiment {
top: 10px;
}
.NB-density-compact .NB-story-title .NB-storytitles-sentiment {
top: 3px;
}
@ -3306,7 +3313,7 @@ body {
.NB-pref-story-position-center .NB-feed-story-feed {
margin: 0 auto;
width: 700px;
max-width: 700px;
}
.NB-pref-story-position-right .NB-feed-story-feed {
margin: 0 0 0 auto;
@ -3349,7 +3356,8 @@ body {
border-left: 2px solid #ECEFE9;
padding: .5em 1.5em;
margin: 0px;
background-color: #F4F6F2;
background-color: #f7faf6;
border-radius: 4px;
}
.NB-feed-story .NB-feed-story-content iframe,
@ -3368,21 +3376,26 @@ body {
max-width: 100% !important;
width: auto !important;
height: auto;
/* See http://www.newsblur.com/site/1031643/le-21me for width: auto, height: auto */
}
.NB-feed-story .NB-feed-story-content img.NB-medium-image {
border-radius: 4px;
}
.NB-feed-story .NB-feed-story-content img.NB-small-image {
}
.NB-feed-story .NB-feed-story-content img.NB-large-image {
border-radius: 4px;
}
.NB-feed-story .NB-feed-story-content img.NB-large-image.NB-large-image-widen {
max-width: max-content !important;
margin-left: -28px !important;
width: calc(100% - 56px * -1) !important;
/* border-radius: 0; */
}
.NB-feed-story .NB-feed-story-content img.NB-table-image.NB-large-image {
margin: 0;
width: 100% !important;
border-radius: 0;
}
.NB-feed-story .NB-feed-story-content figure {
@ -3777,7 +3790,7 @@ body {
}
.NB-feed-story .NB-feed-story-content {
padding: 12px 0 0;
padding: 24px 0 0;
max-width: 700px;
min-height: 12px;
}

View file

@ -3112,7 +3112,7 @@
this.show_story_titles_above_intelligence_level({ 'animate': true, 'follow': true });
NEWSBLUR.app.dashboard_rivers.left.redraw();
NEWSBLUR.app.dashboard_rivers.right.redraw();
NEWSBLUR.app.story_titles.render();
NEWSBLUR.app.story_titles.render({"maintain_scroll": true});
}
this.load_theme();

View file

@ -152,8 +152,17 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
largest = this.width;
$largest = $(this);
}
$(this).removeClass('NB-large-image').removeClass('NB-medium-image').removeClass('NB-small-image');
if (pane_width >= 900) return;
$(this)
.removeClass('NB-large-image')
.removeClass('NB-large-image-widen')
.removeClass('NB-medium-image')
.removeClass('NB-medium-image-widen')
.removeClass('NB-small-image')
.removeClass('NB-small-image-widen');
var auto_widen = true;
if (pane_width >= 900) {
auto_widen = false;
}
if (has_tables) {
// Can't even calculate widths because with tables, nothing fits
@ -161,10 +170,19 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
}
if (this.naturalWidth >= pane_width && this.naturalHeight >= 50) {
$(this).addClass('NB-large-image');
if (auto_widen) {
$(this).addClass('NB-large-image-widen');
}
} else if (this.naturalWidth >= 100 && this.naturalHeight >= 50) {
$(this).addClass('NB-medium-image');
if (auto_widen) {
$(this).addClass('NB-medium-image-widen');
}
} else {
$(this).addClass('NB-small-image');
if (auto_widen) {
$(this).addClass('NB-small-image-widen');
}
}
});
if ($largest) {

View file

@ -26,7 +26,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
// = Render =
// ==========
render: function() {
render: function(options) {
// console.log(['render story_titles', this.options.override_layout, this.collection.length, this.$story_titles[0]]);
this.clear();
this.$story_titles.scrollTop(0);
@ -56,7 +56,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
this.fill_out();
this.override_grid();
this.scroll_to_selected_story();
this.scroll_to_selected_story(null, options);
},
add: function(options) {
@ -331,7 +331,7 @@ NEWSBLUR.Views.StoryTitlesView = Backbone.View.extend({
// console.log(["scroll_to_selected_story 3", position]);
this.$story_titles.stop().scrollTo(position, {
duration: NEWSBLUR.assets.preference('animations') ? 260 : 0,
duration: !options.maintain_scroll && NEWSBLUR.assets.preference('animations') ? 260 : 0,
queue: false
});
}