readme

<!-- @format -->

To import navbar follow these steps

1. Add <script
   src="https://kit.fontawesome.com/fb700f3d70.js"
   crossorigin="anonymous"
   > </script> below title
2. Link <link rel="stylesheet" href="styles/navbar.css" />
3. Write <nav></nav> in body
4. Add <script type="module" src="scripts/navbar.js"></script> at the end of body


steps how to import footer:

1. make a div in html file with id named as "foot-container".
2. then just copy paste this code:
      <script type="module">
         import mainFooter from "./components/main footer.js";
         let footer = document.getElementById("foot-container");
         footer.innerHTML = mainFooter();
      </script>
3. paste this link inside head tag:
      <link rel="stylesheet" href="./styles/mainfooter.css">
NOTE: you can change id-names as per your choice.



###Steps to append survey_templates div:--->

#-Add these tags in head tag:

1. link <link rel="stylesheet" href="./styles/survey_templates_div.css" /> in head tag.
2. add <script
   src="https://kit.fontawesome.com/5ccbe3257d.js"
   crossorigin="anonymous"
   > </script> (if already present in you head tag, skip it).

#-Add these tags in body tag:

1. Add <div id="template_Container"></div> wherever you want append inside page.
2. Add script tag <script type="module" src="./components/export&append_data.js"></script>


###Steps to append input form:--->

#-Add these tags in head tag:

1. Link css file in head tag <link rel="stylesheet" href="./styles/inputForm.css" />
2. add <script
   src="https://kit.fontawesome.com/5ccbe3257d.js" crossorigin="anonymous"></script> (if already present in you head tag, skip it).

#-Add these tags in body tag:

1. Add <form class="input-form-container"></form> where you want to append input form;
   2 Add script file <script type="module" src="./scripts/inputForm.js"></script> next to body tag or after html tag;


###Steps to append page animation loader:--->

#-Add these tags in head tag:

1. Link css file top of every css links-
<link rel="stylesheet" href="./styles/page_loading_animation.css">

2. add <script src="./components/page_loading_animation.js"></script> on top of every script file.

#-Add these tags in body tag:

1. Add this attribute to body tag:
   onload="loaderAnimation()"

2. Add <div id="wrapper"><div class="loader"></div></div> on top of every tag in body tag;