Carl Maltby Posted July 30, 2018 Posted July 30, 2018 Hi all - thanks to the nice stable framework that Invision have created, I've hardly needed to do any code monkeying for months. Understandably, I prefer to create content than fiddle under the hood. Anyway. We decided on our front page feeds that we should mark out which articles are less than one month old and overlay their thumbnails with a "NEW" label. The problem is, I'm so rusty that I literally can't remember where to start....oops.... Our feeds are generated from Block Feeds where a variety of tests produce the layout we need. The only thing I'm tripping up on is the test for conditionally labelling articles as new or not. I'm so rusty that I am only at the point of knowing that this is either "very easy and I'm an idiot for not keeping my chops up" or it isn't, and my rusty chops are being set up against a nice near-vertical challenge. Changing the Feed Configuration to "From the last X days" will not help, as the feed is meant to drag the latest five records, highlight the most recent at top of the list and our intention now is to mark down any less than a month old with an image overlay. Being spoonfed is not what I am expecting, I'm just currently at the stage where I'm hunting for the first clue....! TIA
opentype Posted July 30, 2018 Posted July 30, 2018 {{$timespan = time() - (60*60*24*30);}} {{if $timespan > $yourArticlePublishingDate}} // Your NEW label {{endif}} Just to give you the general idea.
Carl Maltby Posted July 30, 2018 Author Posted July 30, 2018 Fantastic, thank you general pointers was all I was hoping for but this is right on the mark! I'd come up with a couple of clues and re-warmed my brain, however you've taken it right to the net. ??
Carl Maltby Posted July 30, 2018 Author Posted July 30, 2018 {{$timespan = time() - (60*60*24*30);}} <ul class='feed_image_header feed_image_header_tape{$random_tape}{{if $timespan < $record->mapped('date')}}_new{{endif}} feed_image_header_transform' style='padding: 0px; transform: rotate({$random_angle}deg); -ms-transform: rotate({$random_angle}deg); -webkit-transform: rotate({$random_angle}deg);'> This is how the code works in place, and is more or less as was suggested. What we're doing is to manipulate the CSS classes applied to apply random overlays, add a random tilt to the thumbnail and also add a peeled back "new" label via CSS: It's a nice confluence between the power of what the Invision backbone provides and CSS manipulation of content presentation. Thanks again, @opentype.
Recommended Posts
Archived
This topic is now archived and is closed to further replies.