Updated CSS and Responsiveness - Job Posting and Job Postings Summary

[Itsmeeeet]

Job Posting and Job Postings Summary

1. Job Posting page

• Updated CSS and made responsive for mobile, laptop and larger devices.
• Removed the unwanted buttons.

2. Job Posting Summary Page

• Updated CSS with a better table view
• Made responsive for mobile, laptop and other larger devices.
• For mobile devices there is horizontal scroll for the table keeping the Job Title fixed at one place.

• In horizontal scroll Job Title column remains fixed.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
soen-390-team05-w23-front-end	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Apr 18, 2023 5:18pm

[Itsmeeeet]

Added Delete Confirmation box :

And also fixed the scrollbar of JobPosting page

[Aboudik1452]

Here are my comments regarding the conflicts:

In regards to the JobList page, the CSS change was made to prevent the footer from always being visible at the bottom of the browser window. I think it would be better to have the footer at the very bottom of the page.

Here's what I mean. The first gif demonstrates your changes made.

See how the footer is always visible in the browser window? The following gif demonstrates my CSS changes.

To make my trick work, I had to include the Navbar and the Footer inside the component JobList.jsx. The conflict is due to the following image

I added a new div that takes care of the page height, and the navbar at the very top. I also created a new CSS file for the LoginFooter loginfooter.module.css and for this page JobList.module.css which are currently being used in dev_new. Thus, the class names were modified to retrieve the name from the module file.

To solve this conflict, you can either do the following:

• Accept incoming change (JobList code from dev_new), and move your CSS fixes into the module file included in dev_new. You can simply move your css code into the css module file. I changed pageTitle to title, you can revert that change.
• Accept current changes (JobList code from your branch), and add the navbar and footer of JobList back to App.jsx, which were removed to make my trick work.

I hope this was helpful. Let me know if you have more questions 🙂

[imran1289-ah]

Accept your changes as the navbar and footer was added to the jobList page in App.js in PR #222