public-mirrors/NewsBlur
1
0
Fork 0
mirror of https://github.com/samuelclay/NewsBlur.git synced 2025-08-31 05:25:00 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Only apply full bleed images on narrow viewports. And default to non-large image, making large images pop into their full bleed.

Browse source
This commit is contained in:
Samuel Clay 2021-07-07 13:09:02 -04:00
parent b74fc79266
commit 24e15d8d34
2 changed files with 11 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
media/css/reader.css
View file

@ -3086,36 +3086,26 @@ body {
max-width: 100%;
}
.NB-feed-story .NB-feed-story-content img {
max-width: max-content !important;
margin-left: -28px;
width: calc(100% - 56px * -1) !important;
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 {
max-width: max-content !important;
margin: 0;
width: auto !important;
}
.NB-feed-story .NB-feed-story-content img.NB-small-image {
max-width: max-content !important;
margin: 0;
width: auto !important;
}
.NB-feed-story .NB-feed-story-content img.NB-large-image {
}
.NB-feed-story .NB-feed-story-content img.NB-table-image.NB-large-image,
.NB-feed-story .NB-feed-story-content img.NB-table-image.NB-medium-image {
max-width: max-content !important;
margin-left: -28px !important;
width: calc(100% - 56px * -1) !important;
}
.NB-feed-story .NB-feed-story-content img.NB-table-image.NB-large-image {
margin: 0;
width: 100% !important;
}
.NB-feed-story .NB-feed-story-content img.NB-table-image.NB-small-image {
max-width: max-content !important;
margin: 0;
width: auto !important;
}
.NB-feed-story .NB-feed-story-content figure {
margin: 0;
}

7
media/js/newsblur/views/story_detail_view.js
View file

@ -153,12 +153,13 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
largest = this.width;
$largest = $(this);
}
// Can't even calculate widths because with tables, nothing fits
$(this).removeClass('NB-large-image').removeClass('NB-medium-image').removeClass('NB-small-image');
if (pane_width >= 900) return;
if (has_tables) {
// Can't even calculate widths because with tables, nothing fits
$(this).addClass('NB-table-image');
}
if (this.naturalWidth >= pane_width && this.naturalHeight >= 50) {
$(this).addClass('NB-large-image');
} else if (this.naturalWidth >= 100 && this.naturalHeight >= 50) {