From c02ccaf2720682e6ca14adf021d12cd31adcef50 Mon Sep 17 00:00:00 2001 From: Vegard Bieker Matthey Date: Thu, 23 Oct 2025 20:10:40 +0200 Subject: [PATCH] intial --- .gitignore | 1 + form.html | 141 ++++++++++++++++++++++++++++++++++++++++++++++++ responsive.html | 44 +++++++++++++++ script.js | 17 ++++++ style.css | 59 ++++++++++++++++++++ 5 files changed, 262 insertions(+) create mode 100644 .gitignore create mode 100644 form.html create mode 100644 responsive.html create mode 100644 script.js create mode 100644 style.css diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..a136337 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +*.pdf diff --git a/form.html b/form.html new file mode 100644 index 0000000..a565486 --- /dev/null +++ b/form.html @@ -0,0 +1,141 @@ + + + + User registration + + + + + +
+

User registration

+ +
+
+
+
+ What is your personal information? + +
+ +
+ +
+ +
+ +
+ +
+ +
+
+ Gender: + +
+ +
+ +
+
+ Interests: + +
+ +
+ +
+ +
+ +
+ +
+ +
+ + +
+
+
+ + + + diff --git a/responsive.html b/responsive.html new file mode 100644 index 0000000..5eaf021 --- /dev/null +++ b/responsive.html @@ -0,0 +1,44 @@ + + + + A title + + + + +
+

Responsive Website Design

+ +
+
+
+

Welcome to our site

+

This is a demonstration of a responsive website using HTML5 and CSS3.

+
+
+
+

Feature 1

+

Description of feature 1.

+
+
+

Feature 2

+

Description of feature 2.

+
+
+

Feature 3

+

Description of feature 3.

+
+
+
+ + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..f4851bb --- /dev/null +++ b/script.js @@ -0,0 +1,17 @@ +const value = document.querySelector("#satisfaction_level"); +const input = document.querySelector("#satisfaction"); +value.textContent = input.value; +input.addEventListener("input", (event) => { + value.textContent = event.target.value; +}); +const form = document.getElementById('userinfo'); + +const checkboxes = form.querySelectorAll('input[name="interests"]'); +const checkedCount = Array.from(checkboxes).some(cb => cb.checked); + +form.addEventListener('submit', (event) => { + if (checkedCount < 1) { + event.preventDefault(); + alert('Please select at least one country.'); + } +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..9ccb4b1 --- /dev/null +++ b/style.css @@ -0,0 +1,59 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: Arial, sans-serif; + line-height: 1.6; +} + +header { + background: #333; + color: #fff; + padding: 20px; + text-align: center; +} + +nav ul { + list-style: none; + padding: 0; +} + +nav ul li { + display: inline; + margin-right: 10px; +} + +nav ul li a { + color: #fff; + text-decoration: none; +} + +.intro { + text-align: center; + padding: 40px; + background: #f4f4f4; +} + +.features { + display: flex; + justify-content: space-around; + padding: 20px; +} + +.feature-item { + background: #fff; + padding: 20px; + border: 1px solid #ddd; + width: 30%; +} + +footer { + text-align: center; + padding: 20px; + background: #333; + color: #fff; +} +