Please answer correctly for guranteed upvoting!!

Last time it was incorrectly answered

SYST24444 Assignment \#1 Assignment \#1 (10\%) This assignment will be used to test your knowledge of native JavaScript, Local Storage and simple JSON retrieval. Follow all details carefully and be sure to follow instructions for submitting your work. NOTE: jQuery MUST not be used Create a mobile web site (Note: Create a new folder to hold all your files/folders). You will need to include: index.html Be sure you have a viewport META tag Include your login name-student number in the ctitles tags A folder to hold other HTML pages (ex. poges or other) A folder to hold stylesheet(s) (ex. css) Your main stylesheet MusT be called yourUserName.css (ex. doejane.css) and must be linked in the index.html file. It is your choice what to name any other stylesheets (for example, you may have a separate stylesheet for the 24 page of this assignment). A folder to hold your script files (ex, js or scripts) Your main script file MuST be called yourloginName.js (ex. doejane.js) and must be linked in index.html It is your choice what to name the is file for the 2% page if you use a separate file A folder to hold any images needed for the assignment. (Your image plus those included in A1-ZIP) A folder to hold your JSON file (ex. dota) / Included in the A1-zIP Update and include your personal information in the ISON file where indicated Script setup (yourtoginName.js) and start-up: Include an onload in your cbodys tag to call a function for start-up Include a call to retrieve the A1-JSON.json file included in your data folder The layout of initial page will include the following: Header section - Displays on load Winter 2023 / Assignment 1 for Your Full Name - Name MUST be pulled from ISON - Template Literal Must be used to build output string. - MUST include some formatting for header area (your choice); C5S or IS can be used Footer section - Displays on load Anchor tag formatted to look like a button that will SAVE all RECIPE data AND CITE data from the JSON file to local storage then proceed to a new page (Optionally, you can save the entire ISON file) Must include some formatting for footer area (your choice); CSS or is can be used Content section - Will consist of 2 areas side-by-side on the page. (EX. you can use CSS Grids). Left Panel - Make the entire area a section or a div and give it a unique ID. This will make it easer for use in the Grid Area and for formatting. - Include your picture from ISON file name; include an ID for later formatting - Make sure you use relative referencing correctly so image displays when published - Hint: Include the tog within tags for help with plocement - Template Literal MUST be used to bulld output HTML 1 SYST24444 Assignment \#1 - Add 2 buttons under the image: - Button (include formatting) that will change the CSS class of your picture - Button (include formattingl that will remove CSS called by first button - Add a CSS Class in your css file called yourusename - border-radius of 50px - border of thick solid colour (colour of your choice) - box shadow on any corner of colour of your choice (at least 10px offset and blur) - When change button is clicked, your image will be changed to use the new formatting based on your CSS class - When the remove button is clicked, remove the formatting based on your CSS class Right Panel - Make the entire area a section or a div and give it a unique lD. This will make it easer for use in the Grid Area and for formatting. - Display ALL personal information from JSON; your choice of layout but all information MUST include descriptive labels - Template Literal MUST be used to build output HTML. - All data MUST come from the JSON file The layout of 2 nd page will include the following: Script setup and start-up: Retrieve all data (Recipe and CITE or entire 150N file based on how you saved) from local storage NOTE: If you retrieve the ISON file again for this page and do not use local storage exclusively, marks will be deducted Include a Back Button that will return to the first page (your choice of where and how it looks) Header section - Displays on load Winter 2023/Assignment H1 / Recipes - MUST indude some formatting for header area (your choice), CSS or 15 can be used Footer section - Displays on load CITE information from Local Storage as an anchor tag that opens site in a new tab MUST include some formatting for footer area (your choice); CSS or IS can be used Left Panel Create 3 buttons from Local Storage Recipe data that includes the Recipe Name as button text. Each button will also call a function passing in the index number (0,1,2) : Must use a for/of loop Format buttons Do NOT include a separate function for each button Right Panel When a button is clicked, display all recipe data for the button chosen based on the index number passed as the argument Ingredients must be in an unordered list NOTE: Remember, images must disploy when published so review relative reference for displaying images on a web site 2