Summary

Description of the change(s) you made

This pr does the following;

1. Adds padding around the "Show more" pagination button
2. Streamlines the number of resources show in a particular folder
3. Makes the "Show more" pagination button responsive when more than 25 resources have been uploaded.

Manual verification steps performed

1. Login to studio
2. Navigate to a channel or its folder that has more than 25 resources and observe the behavior
3. Observe that the resource and question count correspond to what is in the folder and exercise respectively
4. Also, upload over 25 resources into a folder and try to use the "Show more" button

Screenshots (if applicable)

Padding

Resource counts

Uploading >25 resources

Does this introduce any tech-debt items?

• No

Reviewer guidance

How can a reviewer test these changes?

• See manual verification above

Are there any risky areas that deserve extra testing?

• The pagination feature
• Critical workflows

References

Fixes #4715
Fixes #4727

Comments

• There appears to be an existing issue with pagination when importing from channels. After the import process, resources are added in 'copying' state, and this process takes time to complete. When the number of resources exceeds 25, all of them are displayed simultaneously, causing inconsistencies with the display of the 'Show more' button, rendering it non-operational in some cases. The expected behavior for this scenario needs to be clarified and addressed in a separate issue. cc @rtibbles @marcellamaki

Contributor's Checklist

PR process:

• If this is an important user-facing change, PR or related issue the CHANGELOG label been added to this PR. Note: items with this label will be added to the CHANGELOG at a later time
• If this includes an internal dependency change, a link to the diff is provided
• The docs label has been added if this introduces a change that needs to be updated in the user docs?
• If any Python requirements have changed, the updated requirements.txt files also included in this PR
• Opportunities for using Google Analytics here are noted
• Migrations are safe for a large db

Studio-specifc:

• All user-facing strings are translated properly
• The notranslate class been added to elements that shouldn't be translated by Google Chrome's automatic translation feature (e.g. icons, user-generated text)
• All UI components are LTR and RTL compliant
• Views are organized into pages, components, and layouts directories as described in the docs
• Users' storage used is recalculated properly on any changes to main tree files
• If there new ways this uses user data that needs to be factored into our Privacy Policy, it has been noted.

Testing:

• Code is clean and well-commented
• Contributor has fully tested the PR manually
• If there are any front-end changes, before/after screenshots are included
• Critical user journeys are covered by Gherkin stories
• Any new interactions have been added to the QA Sheet
• Critical and brittle code paths are covered by unit tests

Reviewer's Checklist

This section is for reviewers to fill out.

• Automated test coverage is satisfactory
• PR is fully functional
• PR has been tested for accessibility regressions
• External dependency files were updated if necessary (yarn and pip)
• Documentation is updated
• Contributor is in AUTHORS.md