Moonbar update in loading screen instead of loading bar

[jt-09]

Description

Task: Replace the loading bar with a moon that fills as progress is made.
Feature: #335

This task involves replacing the old loading bar UI component on the loading screen with a moon that gradually fills up as loading progresses. The moon will be static in the middle of the screen and will visually fill from bottom to top. The moon should blend into the background with some transparency to maintain aesthetic harmony with the loading screen. Additionally, ensure that the text remains on top of the moon.

Example (optional)

• Old vs. New: Previously, the loading progress was displayed via a standard progress bar. Now, the moon graphic will act as the progress indicator, gradually filling up with each stage of loading.
• Visual Representation: The moon will be centred on the screen, static in size, and fill from bottom to top, blending into the background with opacity control. The text showing loading messages will be displayed on top of the moon.

Dependencies

None

Milestones

• Moon Image chosen (Sept. 17th)
• Functionality implementation (Sept. 19th)
• Updates to image if needed and finalised design (Sept. 18th)
• Testing accordance and appropriate documentation added to wiki(Sept. 20th)

Completion Deadline: (Sept. 20th)

Documentation

• Loading screen documentation
• More documentation for loadingdisplay (With updated UML)

Member

• Name (@jt-09 ) Jay Thakkar