# data[].attributes.body
<!DOCTYPE html>

<html>

<body bgcolor="CBC3E3">

<style>

h1 {color: #ff0000;

font-size: 30px;

}

</style>

<h1> Project Leader Details</h1>

<form action="submit_application.php" method="post">

<label for="leader_name">1. Name:</label><br>

<input type="text" id="leader_name" name="leader_name" required><br><br>

<label for="identification_no">2. Mykad/Passport No:</label><br>

<input type="number" id="identification_no" name="identification_no" required><br><br>

<label for="staff_id">3. Staff ID:</label><br>

<input type="number" id="staff_id" name="staff_id" required><br><br>

<label for="position">4. Position:</label><br>

<select id="positions" name="positions" required>

<option value="Professor">Professor</option>

<option value="Associate Professor">Associate Professor</option>

<option value="Senior Lecturer">Senior Lecturer</option>

<option value="Lecturer">Lecturer</option>

<option value="Others">Others</option>

</select><br><br>

<label for="department">5. School/Centre:</label><br>

<input type="text" id="department" name="department" required><br><br>

<label for="phone_no">6. Office Phone No:</label><br>

<input type="tel" id="phone_no" name="phone_no" required><br><br>

<label for="mobile_number">7. Mobile Phone No:</label><br>

<input type="tel" id="mobile_number" name="mobile_number" required><br><br>

<label for="email">8. Email Address:</label><br>

<input type="email" id="email" name="email" required><br><br>

<label for="qualification">9. Academic Qualification/Highest Professional/Qualification:</label><br>

<input type="text" id="qualification" name="qualification" required><br><br>

<label for="Employement">10. Employement:</label><br>

<input type="radio" id="permanent" name="Employement" value="Permanent" required>

<label for="permanent">Permanent</label><br>

<input type="radio" id="contract" name="Employement" value="Contract" required>

<label for="contract">Contract</label>

<label for="expiry_date">Contract Expiry Date:</label><br><input type="date" id="expiry_date" name="Expiry Date" required><br><br>

<label for="date_application">11. Date of Appoinment to Academic Position:</label><br>

<input type="date" id="date_application" name="date_application" required><br><br>

<label for="list_publication">12. List of Publication (in 3 years):</label><br>

<textarea id="list_publication" name="list_publication" rows="4" cols="50" required></textarea><br><br>

</form>

</body>

</html>

# data[].attributes.body
https://drive.google.com/file/d/1CVpKbTkQOIbd4Obd86Tgu6EW8PfJ6TLr/view?usp=drivesdk

# data[].attributes.headline
In-Class Activity: Create a Login Button

# data[].attributes.subject
In-Class Activity: Create a Login Button

# data[].attributes.body
Create a simple login interface. When the Login button is clicked:

If both fields are filled: show success message.

If either field is empty: show error message.

Provide the screenshot of the output.

# data[].attributes.body
Based on the above form, add an advanced feature using CSS. Provide a screenshot of your output here.

# data[].attributes.body
in class