Per T238282#5666593, make the article card in the Suggested edits module display more responsively according to the width of the module container to accommodate mobile tablet users.
Looking at T238279#5680536, the the article card and content inside the Suggested edits module should also display more responsively on Desktop for when the module is narrower than 360px.
=== Proposed design:
**A) Larger Mobile devices**
Utilize media queries to detect when the width of the module is ≥ 600px, increase the card dimensions to image size at 512x256px.
{F31123298}
**B) Narrow Desktop widths**
Utilize media queries to detect when the width of the module is on Desktop becomes too narrow, and shift the style and position of the left and right arrows to be as follows:
{F31123216}
Achieved by applying the following CSS tweaks:
```
@media screen and (max-width: 1280px) and (min-width: 1024px) {
.suggested-edits-previous {
border: solid 1px #C8CCD1;
margin-right: -24px;
background-color: #F8F9FA;
z-index: 1000;
padding-right: 0!important;
padding-left: 0.42857143em!important; /* this offsets the uneven spacing between arrows and card caused by the .oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child */
border-radius: 2px;
margin-bottom: 24px;
}
}
@media screen and (max-width: 1280px) and (min-width: 1024px) {
.suggested-edits-next {
border: solid 1px #C8CCD1;
margin-left: -24px;
z-index: 1000;
background-color: #f8f9fa;
padding-right: 0!important;
padding-left: 0.42857143em!important; /* this offsets the uneven spacing between arrows and card caused by the .oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child */
border-radius: 2px;
margin-bottom: 24px;
}
}
```