Adds the Blog-List Cards and Sidebar

[dustinnewman]

Fixes Issue #94

• Adds the blog-list article format for the blogging department. These are displayed as "cards."

• Integrates the sidebar of the blog-list cards with the ScrollToFixed plugin. This plugin is a more robust and developed version of an earlier script (formerly found in js/list-script.js) that was causing issues.

• The following problems still remain:

1. If you resize the window vertically, the sidebar will go below the card

2. If the post is smaller than the sidebar, the sidebar does not resize accordingly

Demo GIF:

[nathanmsmith]

Awesome @dustinnewman98! Just a couple of PR things:

• Could you add the issue (hint: it's #94) you're fixing in the body of you PR?
• It's awesome that you described still remaining issues, but could you also say what you added in your PR?
• A more descriptive title—maybe something like "Add Blog List Article Format"—would be nice 🙂
• Screenshots of the feature are fun! (On Mac, this is super easy with ⌘-⇧-4-Space, which takes a screenshot of a currently running application)

Thanks for all your work! I'm really happy with what we've got right now 😊

[nathanmsmith]

Everything looks good to me! Thanks to @dustinnewman98 @binerys @tanzeelak and @ashleyshine! You're all amazing! @H-Huang, you think this is ready to go?

[nathanmsmith]

Mmm css/list-style.css was the original css file @tanzeelak and @ashleyshine wrote for the static version of the blog lists. I copied that all over into scss/app.scss, we should be able to just remove it. css/main.css appears to be some HTML5 Boilerplate code, which is probably left over from when Byron created Gryphondor from Roots. Not sure if using a HTML5 Boilerplate class was intentional or not though, perhaps @ashleyshine or @tanzeelak could answer?

[tanzeelak]

sidebar1 was created when testing with different versions of a sidebar for the bloglist template. We ended up never changing the name of the class, and were weary of changing it later on. The scss/app.scss file has another class called sidebar that is separate from the one we made.

[nathanmsmith]

Given that, I just renamed .sidebar1 to .blog-list-sidebar and everything seems to be working the same. Are we ready to merge?

[H-Huang]

I tried it on our production servers and its looking like this. Any ideas?

[nathanmsmith]

Sizing can get weird when there isn't much content. Try adding a few paragraphs of lorem ipsum.

[H-Huang]

cool it looks fine that then. Couple more questions:

1. is there any way to fix the issue where it has very little text?
2. can we change it so it does not reset the page view to the top whenever you hit "last" or "next"
3. is there some sort of CSS conflict with our related posts because they look like this now:

[nathanmsmith]

1. Yeah we can fix the little text issue. How do you want us to handle that design-wise? Should we:

   • remove the sidebar completely if the article isn't a certain length
   • vertically shrink the sidebar to the height of (or less than) the article if the article isn't a certain length
   • something else?

2. From a reading perspective, I think it makes more sense for the article to go to the beginning when a user clicks "next" or "previous". (This is how Vox does it.) We can change if you want though.

3. Did not notice that! Will look into.

[H-Huang]

1. maybe make the card a minimum size? (just as long as it doesn't overflow over the footer anything will be fine I think).

2. oh yeah you are right, its fine as it is.

[H-Huang]

@nathunsmitty hows the progress on this

[nathanmsmith]

Sorry--got busy with midterms last week and didn't get around to working on this. Just pushed the article height fix.

[nathanmsmith]

As for related posts, I'm not able to see them on any article I have in my virtual machine. When did we add related posts? My assumption is that we don't have related post data for articles from 2013, because articles from 2013 show an empty related post box on the site.

No related posts on article locally.

Empty related posts box on dailybruin.com for same article from 2013.

Perfectly fine related posts on article from 2016.

Tangentially related to this issue, if we don't have any related posts for an article, we probably shouldn't show a box at all. (This issue goes hand in hand with #102)

[nathanmsmith]

Alright should be fixed now--just an incorrectly placed close brace lol.