Implement the mobile view of ScholarX archive page

[janithlahirukariyawasam]

Purpose

The purpose of this PR is to fix #1538

Goals

The goal of this PR is to implement the mobile view of the ScholarX archive page.

Preview Link

https://pr-1539-sef-site.surge.sh/ https://pr-1539-sef-site.surge.sh/scholarx/archive/

Checklist

• [x] I have read and understood the development best practices guidelines
• [x] I have performed a self-review of my own code
• [ ] I have commented my code, particularly in hard-to-understand areas

Related PRs

## Learning

[janithlahirukariyawasam]

@anjula-sack Can you go through this pull request. I think we can improve CSS little bit. Any ideas or suggestions?

[anjula-sack]

Let's align the search bar @janithlahirukariyawasam