Fixed arrow alignment in covers modal#10169
Conversation
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #10169 +/- ##
==========================================
+ Coverage 17.12% 17.59% +0.46%
==========================================
Files 89 88 -1
Lines 4752 4769 +17
Branches 831 847 +16
==========================================
+ Hits 814 839 +25
+ Misses 3428 3411 -17
- Partials 510 519 +9 ☔ View full report in Codecov by Sentry. |
|
|
||
| .slick-next | ||
| { | ||
| right: -25px; |
There was a problem hiding this comment.
This may affect the buttons on other pages as well (e.g. the homepage) so we may have to do some testing
There was a problem hiding this comment.
Yeah, some testing may be required, because when the value is:
right: -25px
some part of the arrow actually clips out of the box.
cdrini
left a comment
There was a problem hiding this comment.
Ah, the issue here is that the CSS meant for the "Use this image" button are also applying to the left/right button. Because of this css rule: .ol-cover-form .carousel button. Changing the rule to .ol-cover-form .carousel .cta-btn should fix the issue 👍 That's a preferable approach, since it makes fewer changes, and is less likely to affect other parts of the page and cause bugs.
cdrini
left a comment
There was a problem hiding this comment.
Looks great! Thank you @Craig-Rosario !
|
No worries, glad I could help😊 |



Closes #10134
Align/Fix the navigation arrows, positioning them on the sides of the covers for better usability.
Technical
Testing
Screenshot
Before:

After:

Stakeholders
@mekarpeles