diff --git a/web-frontend/src/Accessibilty.html b/web-frontend/src/Accessibilty.html new file mode 100644 index 000000000..a95e37669 --- /dev/null +++ b/web-frontend/src/Accessibilty.html @@ -0,0 +1,43 @@ + + + + + + Accessibility Settings + + + +
+

Accessibility Settings

+
+ +
+
+

Font Size

+ +
+ +
+

Color Blind Mode

+ +
+ +
+

Voiceover

+ +
+ +
+ + + + \ No newline at end of file diff --git a/web-frontend/src/Accessibilty.js b/web-frontend/src/Accessibilty.js new file mode 100644 index 000000000..e99c21ca4 --- /dev/null +++ b/web-frontend/src/Accessibilty.js @@ -0,0 +1,25 @@ +// script.js +const fontSizeToggle = document.getElementById("font-size-toggle"); +const colorBlindToggle = document.getElementById("color-blind-toggle"); +const voiceoverToggle = document.getElementById("voiceover-toggle"); + +// Handle font size toggle +fontSizeToggle.addEventListener("change", () => { + document.body.classList.toggle("large-font"); +}); + +// Handle color blind mode toggle +colorBlindToggle.addEventListener("change", () => { + document.body.classList.toggle("color-blind-mode"); +}); + +// Handle voiceover toggle +voiceoverToggle.addEventListener("change", () => { + if (voiceoverToggle.checked) { + // Enable voiceover functionality (you can add your implementation here) + alert("Voiceover enabled"); + } else { + // Disable voiceover functionality + alert("Voiceover disabled"); + } +}); \ No newline at end of file diff --git a/web-frontend/src/CreateAcount.css b/web-frontend/src/CreateAcount.css new file mode 100644 index 000000000..ee9b82d37 --- /dev/null +++ b/web-frontend/src/CreateAcount.css @@ -0,0 +1,71 @@ +/* styles.css */ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #f0f0f0; +} + +header { + background-color: #9370DB; + color: #fff; + text-align: center; + padding: 20px; +} + +header h1 { + margin: 0; +} + +main { + max-width: 800px; + margin: 0 auto; + padding: 20px; + background-color: #fff; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} + +.registration-form { + text-align: center; +} + +h2 { + font-size: 24px; + color: #333; +} + +.form-group { + margin-bottom: 20px; + text-align: left; +} + +label { + font-size: 18px; + color: #333; + display: block; +} + +input[type="text"], +input[type="email"], +input[type="password"] { + width: 100%; + padding: 10px; + font-size: 16px; + border: 1px solid #ccc; + border-radius: 5px; +} + +button { + background-color: #9370DB; + color: #fff; + padding: 10px 20px; + border: none; + border-radius: 5px; + cursor: pointer; + font-size: 16px; +} + +button:hover { + background-color: #9370DB; +} \ No newline at end of file diff --git a/web-frontend/src/CreateAcount.html b/web-frontend/src/CreateAcount.html new file mode 100644 index 000000000..509a28913 --- /dev/null +++ b/web-frontend/src/CreateAcount.html @@ -0,0 +1,45 @@ + + + + + + Create Account - NutriHelp + + + +
+

Create Account

+
+ +
+
+

Registration

+
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+
+
+ + + + \ No newline at end of file diff --git a/web-frontend/src/CreateAcount.js b/web-frontend/src/CreateAcount.js new file mode 100644 index 000000000..902c5424f --- /dev/null +++ b/web-frontend/src/CreateAcount.js @@ -0,0 +1,13 @@ +// script.js +const registrationForm = document.getElementById("registration-form"); + +registrationForm.addEventListener("submit", function (e) { + e.preventDefault(); + // Validate and process the registration data here + const username = document.getElementById("username").value; + const email = document.getElementById("email").value; + const password = document.getElementById("password").value; + const confirmPassword = document.getElementById("confirm-password").value; + + +}); \ No newline at end of file diff --git a/web-frontend/src/Disclaimer.css b/web-frontend/src/Disclaimer.css new file mode 100644 index 000000000..d8d7dc0b2 --- /dev/null +++ b/web-frontend/src/Disclaimer.css @@ -0,0 +1,54 @@ +/* styles.css */ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #fff; +} + +header { + background-color: #9370DB; + color: #fff; + text-align: center; + padding: 20px; +} + +.main-heading { + font-size: 36px; + margin: 0; +} + +main { + padding: 20px; +} + +.get-started { + background-color: #fff; + padding: 20px; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} + +h2 { + font-size: 24px; + color: #333; +} + +p { + font-size: 16px; + color: #777; +} + +button { + background-color: #9370DB; + color: #fff; + padding: 10px 20px; + border: none; + border-radius: 5px; + cursor: pointer; + font-size: 16px; +} + +button:hover { + background-color: #0056b3; +} \ No newline at end of file diff --git a/web-frontend/src/Disclaimer.html b/web-frontend/src/Disclaimer.html new file mode 100644 index 000000000..4bbb5826f --- /dev/null +++ b/web-frontend/src/Disclaimer.html @@ -0,0 +1,29 @@ + + + + + + Legal Disclaimer - NutriHelp + + + + +
+

NutriHelp

+
+ +
+
+

Legal Disclaimer

+

The information provided on this website is for general informational purposes only. It is not intended as medical advice and should not be used as a substitute for consulting with a qualified healthcare professional.

+

By using this website, you agree to the terms and conditions outlined in this disclaimer. NutriHelp is not responsible for any actions taken based on the information provided on this site.

+ +
+ +
+ + + + \ No newline at end of file diff --git a/web-frontend/src/Disclaimer.js b/web-frontend/src/Disclaimer.js new file mode 100644 index 000000000..f45d9fd9b --- /dev/null +++ b/web-frontend/src/Disclaimer.js @@ -0,0 +1,5 @@ +// script.js +document.getElementById("agreeButton").addEventListener("click", function () { + alert("Let's agree with NutriHelp Legal Disclaimer!"); + +}); \ No newline at end of file diff --git a/web-frontend/src/Welcome.html b/web-frontend/src/Welcome.html new file mode 100644 index 000000000..0311e66c7 --- /dev/null +++ b/web-frontend/src/Welcome.html @@ -0,0 +1,26 @@ + + + + + + NutriHelp - Get Started + + + + + +
+

NutriHelp

+
+ +
+
+

Get Started

+

Welcome to NutriHelp! Start your journey to better nutrition and health today.

+ +
+
+ + + + \ No newline at end of file diff --git a/web-frontend/src/welcome.css b/web-frontend/src/welcome.css new file mode 100644 index 000000000..d8d7dc0b2 --- /dev/null +++ b/web-frontend/src/welcome.css @@ -0,0 +1,54 @@ +/* styles.css */ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #fff; +} + +header { + background-color: #9370DB; + color: #fff; + text-align: center; + padding: 20px; +} + +.main-heading { + font-size: 36px; + margin: 0; +} + +main { + padding: 20px; +} + +.get-started { + background-color: #fff; + padding: 20px; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} + +h2 { + font-size: 24px; + color: #333; +} + +p { + font-size: 16px; + color: #777; +} + +button { + background-color: #9370DB; + color: #fff; + padding: 10px 20px; + border: none; + border-radius: 5px; + cursor: pointer; + font-size: 16px; +} + +button:hover { + background-color: #0056b3; +} \ No newline at end of file diff --git a/web-frontend/src/welcome.js b/web-frontend/src/welcome.js new file mode 100644 index 000000000..3027e5637 --- /dev/null +++ b/web-frontend/src/welcome.js @@ -0,0 +1,5 @@ +// script.js +document.getElementById("startButton").addEventListener("click", function () { + alert("Let's get started with NutriHelp!"); + // You can add more functionality here. +}); \ No newline at end of file