Moredetails box, Issue 113 fixed

[amalrzv]

Fixes #113 113 What was changed? Prior to Nhi helping me rearrange the files, I created the area for the data to be placed in the shift details page. Here you can see the start time, end time, requested volunteers, needed volunteers, etc. and I populated it with some raw data in a few categories. Here, describe what part of the application you changed (e.g. login page, database, etc.). If possible, mention what specific components were added, removed, or modified. The shift details page has been changed to produce more details about the shift. A new file was created in order to have this information appear called MoreDetailsBox.js Why was it changed? It was changed because there was no place to find additional information on the shift. Here, describe the issue that you are fixing with this code, and why your code fixes it. A new file, reorganized by Nhi, displays the data for the shift with "more details" such as the start and end times, requested and required number of volunteers, etc. that was not there before. How was it changed? It was changed by creating a new file that showed the information on the shift details page. The file MoreDetailsBox has information needed on that page. There is text that demonstrates the necessary information about each shift and its currently populated with raw data. It also has a place to press where you can request more voluteers, close sign up of volunteers, close request, and close the modal. Here, get into detail about what files you modified, and talk about the most important lines in regards to fixing the issue. The file modified was creating the MoreDetailsBox, originally, it was placed in a different file but reorganized. This file is the biggest file modified because it placed the information in the Shift Details section. **Screenshots that sho

w the changes (if applicable):**

[Brijitha1609]

@amalrzv The component doesn't match the original design, so please ensure the following adjustments are made: Align all fields and buttons properly with even spacing, and use the correct font size and style for the text. The buttons should match the design in terms of size, borders, and centered text. Additionally, the modal layout needs better organization, clearly separating the details from the action buttons. Make sure the correct colors from the design are applied, and the component looks good across different screen sizes. These changes will make the component cleaner and more user-friendly.

[cbiddle3]

We are splitting this issue into 2 issues. It is too large for Amal's first time since she hasn't used React before and has minimal JavaScript experience. She hasn't done CSS styling either so this issue is being split into making the component with the required content, this next sprint she will implement the correct styling for the component.

[kate-holdener]

We are splitting this issue into 2 issues. It is too large for Amal's first time since she hasn't used React before and has minimal JavaScript experience. She hasn't done CSS styling either so this issue is being split into making the component with the required content, this next sprint she will implement the correct styling for the component.

@Brijitha1609 @cbiddle3 @amalrzv Splitting up the work that's too much for one sprint into multiple issues is a great way to make progress! Please make sure the other issue clearly states the remaining work that needs to be done.

[cbiddle3]

We are splitting this issue into 2 issues. It is too large for Amal's first time since she hasn't used React before and has minimal JavaScript experience. She hasn't done CSS styling either so this issue is being split into making the component with the required content, this next sprint she will implement the correct styling for the component.

@Brijitha1609 @cbiddle3 @amalrzv Splitting up the work that's too much for one sprint into multiple issues is a great way to make progress! Please make sure the other issue clearly states the remaining work that needs to be done.

Hi, I made the new issue: https://github.com/oss-slu/shelter_volunteers/issues/120

Should the original issue also be altered?

[kate-holdener]

We are splitting this issue into 2 issues. It is too large for Amal's first time since she hasn't used React before and has minimal JavaScript experience. She hasn't done CSS styling either so this issue is being split into making the component with the required content, this next sprint she will implement the correct styling for the component.

@Brijitha1609 @cbiddle3 @amalrzv Splitting up the work that's too much for one sprint into multiple issues is a great way to make progress! Please make sure the other issue clearly states the remaining work that needs to be done.

Hi, I made the new issue: #120

Should the original issue also be altered?

I'd update the original issue to indicate what it includes and that the rest of it is covered by issue #120