Topic List Previews


(Kris) #293

Which browser (and version) is being used on the Huawei Mediapad M5 7"?


(Luka Renko) #294


(Luka Renko) #295

Also, it is 8.4" and not 7" as I wrote initially.


(Kris) #296

Ah ok, I just looked at your site and I see the problem — there’s a plugin (discourse-topic-previews) doing this:

.mobile-view .topic-list .topic-category {
  display: inline-block;
}

If you remove that rule, or set it to display: block the layout is as expected.


(Luka Renko) #297

OK, this may be Topic List Preview plugin, however I do not have it enabled on mobile views, only on desktop.


#298

The CSS rules would apply in any case. Needs to be managed with a class I suspect.

Yeah looks only the long Category names are being pushed to next line on wider screens.

Luka, in short term suggest you just override in a Theme Component along with any other overrides you maintain as Kris suggests.

FYI just repro-ed on an iPhone in landscape :slight_smile:


(Bank Live) #299

I’m not sure Why is the image not as sharp as the original?


#300

Pushed a tweak. Thanks for reporting. Thanks @awesomerobot for speeding that up.


#301

Thats the point of thumbnails, they are meant to be created in a lower resolution to reduce load and storage hit. You can increase their resolution with the height and width settings.

You can disable them completely by setting this to hotlink, which will force it to use the original. This has the added benefit of maintaining aspect ratio.


(Bank Live) #302

Yes It work. Thank you very much.


(Luka Renko) #303

Thanks for quick fix. This have moved category back to left, but now tags are listed in separate line. On meta.discourse.org this is not the case - category and tags are shown in same line.


#304

That’s not necessarily a bad thing, this gives you more space for tags without wrapping. It’s a trade-off. Tiles view gives tags their own line too.

There’s no setting currently to switch TLP on/off for a specific view, it will affect all views even if you haven’t added a thumbnail. Agree its not consistent with vanilla plugin-less view.


(Luka Renko) #305

Interesting, as on desktop still has category + tags in same line (but I use previews there). For me, it looks much better if categoy and tags are in same line.


#306

That makes sense, desktop browsers have greater breadth.

There’s nothing stopping you customising the CSS in a Theme Component, in many cases you are able to configure things to your own taste but beware users with smaller devices like iPhone 6-8! In portrait mode there is not much space.


(David Kingham) #307

Any idea why the scrollbar is showing up on my featured topics all of the sudden?


#308

There must be an overflow. Feature one less and see if it disappears?

btw, Apple Safari has a much more subtle and less intrusive scrollbar :wink:


(David Kingham) #309

Yes it does, also if I take the size down to 98 instead of 100 it goes away which is fine, you must have changed something by 2px recently :grin:


#310

Ha, not changed anything related to Featured Images … might be a core build container tweak?


(David Kingham) #311

I think a bug was introduced in the latest build, seems to be related with tags and sorting order causing the tiles to only be one column. See this link Topics tagged editors-pick

Edit: it seems to be specifically for that tag as this is the same result without the sorting Topics tagged editors-pick but other tags are working as expected.


(David Kingham) #312

One more unrelated question. I have script which blocks right clicking on images but this does not work with the tiles view. Could you tell me what selector to use so I can add it to this script? I inspected it and tried everything imaginable but nothing seemed to work.

<script type="text/discourse-plugin" version="0.8">

const TopicRoute = require("discourse/routes/topic").default;

TopicRoute.reopen({
	activate: function() {
		this._super();
		Em.run.next(function() {
		    $('body').on('contextmenu', '.cooked img, .mfp-img', function(e){ return false; });
		});
	}
});
</script>