SDSS-1273: Add Card Grid responsive image style for News views

[sethprime]

READY FOR REVIEW

Summary

Added Card Grid responsive image style with supporting image styles for News views. Created Card Grid view mode and configured for News content types. Updated News, and Explore More News views with Card Grid content displays.

Review By (Date)

Criticality

1

Review Tasks

Setup tasks and/or behavior to test

1. Check out this branch and import the configuration.
2. Navigate to /news/school-news/all
3. Verify that the new image styles are the loading.

At 768px window width and above these 3:2 variants should be displayed:
1x - (max-width:925px) 240px, (max-width:1385px) 360px, (max-width:1745px) 480px, 637px
2x - (max-width:925px) 480px, (max-width:1385px) 720px, (max-width:1745px) 960px, 1274px
Below 768px these 1:1 images:
1x - 163px
2x - 326px

Front End Validation

• Is the markup using the appropriate semantic tags and passes HTML validation?
• Cross-browser testing has been performed?
• Automated accessibility scans performed?
• Manual accessibility tests performed?
• Design is approved by @ user?

Backend / Functional Validation

Code

• Are the naming conventions following our standards?
• Does the code have sufficient inline comments?
• Is there anything in this code that would be hidden or hard to discover through the UI?
• Are there any code smells?
• Are tests provided? eg (unit, behat, or codeception)

Code security

• Are all forms properly sanitized?
• Any obvious security flaws or new areas for attack?

General

• Is there anything included in this PR that is not related to the problem it is trying to solve?
• Is the approach to the problem appropriate?

Affected Projects or Products

• Does this PR impact any particular projects, products, or modules?

Associated Issues and/or People

• JIRA ticket(s)
• Other PRs
• Any other contextual information that might be helpful (e.g., description of a bug that this PR fixes, new functionality that it adds, etc.)
• Anyone who should be notified? (@mention them here)

Resources

• AMP Tool
• Accessibility Manual Test Script
• HTML Validator
• Browserstack and link to Browserstack Credentials