For the variant tests in {T246533}, there are changes to the Suggested edits module on **desktop** that variant C and D have in common. Changes that apply to mobile are on task T262032
These are as follows:
A. Add an "i" info icon on the top RHS of the module (vertically centered with the module header) which on click re-opens the onboarding overlay (see T258020)
B. Increase space between `suggested-edits-pager` (number of total suggestions) and the card from 5px to 16px;
C. Move difficulty indicator 'ribbon' below the task heading (as per guidance panel)
D. Show the estimated time required next to the indicator ribbon (as per the guidance panel)
E. Suggested edits footer should fill flush to the bottom of the module, achieved by making the suggested-edit-footer `margin: 0px -16px -16px;` (this is part of task T232546#5919621).
F. Increase size of the left and right arrows by 50% (OOUI icons should be 150% of standard icon size, i.e., 30x30px)
G. Remove the border (or change the border color to `transparent`) when the module is initiated. The not-yet-initiated module does keep the existing `@colorGray12` border color (note that the module can only be uninitiated in variant D, because it's initiated from the start in variant C)
H. Article card style updates
-- `.suggested-edits-card-wrapper`
--- Change height from 18em to `height: 288px` (or 20.5em)
-- `.suggested-edits-task-card-wrapper`
--- Change width from 260px to `width: 368px;`
--- Add `padding:8px;`
--- Add `border-radius:2px;`
-- `.se-card-image`
--- Change width from 260px to `width: 368px;`
--- Change height from 9em to `height: 160px;` (or 11.5em)
-- `.se-card-text`
--- Change padding to `padding:0 8px;` (reducing the left and right padding slightly)
--- Change height from 9em to `height: 8em;`
-- `.se-card-extract`
--- Change height from 4.5em to `height:3em;` (this will remove one line of text)
-- `.se-card-pageviews`
--- change padding-top from 10px to `padding-top: 16px`
-- Reduce the size of the pageviews chart icon and update the spacing by amending the following:
```
.growthexperiments-homepage-module-suggested-edits .suggested-edits-module-wrapper .suggested-edits-card-wrapper .suggested-edits-task-card-wrapper .se-card-content .se-card-text .se-card-pageviews .oo-ui-iconWidget {
margin-right: 8px; /*changed from 5px */
opacity: 0.65;
width: 16px; /* added to reduce icon size */
min-width: 16px; /* added to reduce icon size */
height: 16px; /* added to reduce icon size */
min-height: 16px; /* added to reduce icon size */
margin-bottom: 4px; /*added to fix vertical alignment with page views text */
}
```
Mock in Zeplin [[ https://zpl.io/brZjNE3 | here ]]
Note: T238598 will be revisited with updated proposal for a new wide card format.