search

scratchfoundation / scratch-www

Standalone web client for Scratch
https://scratch.mit.edu
BSD 3-Clause "New" or "Revised" License
1.6k stars 845 forks source link

The carousel component on the Starter Projects page thinks it's showing 5 projects, but only 4 are visible #6548

Open mxmou opened 2 years ago

mxmou commented 2 years ago

Expected Behavior

If the viewport is wide enough, all projects on the Starter Projects page would be visible.

Actual Behavior

https://github.com/LLK/scratch-www/pull/2748#issuecomment-465130250 suggested either increasing the number of projects in each category to five or adjusting the carousels to display four projects at once. Both suggestions were implemented (extra projects here and padding between projects here), which results in strange behavior. It could be fixed by removing the additional projects or the padding.

Steps to Reproduce

  1. Open https://scratch.mit.edu/starter-projects on desktop
  2. Note that four projects are visible in each category and there are no scroll arrows
  3. Use the mouse to drag one of the rows of projects towards the left. A fifth projects is visible, but releasing the mouse hides it again because scrolling is only possible if there are more than 5 projects (probably depends on this value).

System Details

Windows 11, Edge 98

lankybox02 commented 2 years ago

https://github.com/LLK/scratch-www/blob/59d0ae9542f8d01d5263aed40686ae64d49c66ef/src/views/starter-projects/starter-projects.scss#L8 It is by default 30px, but this line makes it 90px. I tried removing this attribute using inspect element and it seems to solve the issue.