You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
146 lines
4.2 KiB
146 lines
4.2 KiB
6 months ago
|
<?php
|
||
|
|
// Handle form submission (if needed)
|
||
|
|
if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||
|
|
// Collect form data
|
||
|
|
// $food_type = $_POST['food-type'];
|
||
|
|
// $quantity = $_POST['quantity'];
|
||
|
|
// $pickup = $_POST['pickup'];
|
||
|
|
// $pickup_address = $_POST['pickup-address'];
|
||
|
|
// $comments = $_POST['comments'];
|
||
|
|
|
||
|
|
// You can process or store the data here, such as saving it to a database
|
||
|
|
// For now, let's display a thank-you message
|
||
|
|
// echo "<p>Thank you for your donation of $quantity units of $food_type.</p>";
|
||
|
|
// echo "<p>Pickup Address: $pickup_address</p>";
|
||
|
|
// echo "<p>Preferred Pickup Time: $pickup</p>";
|
||
|
|
// echo "<p>Additional Comments: $comments</p>";
|
||
|
|
}
|
||
|
|
?>
|
||
|
|
|
||
|
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
|
|
<title>Donate to Organization</title>
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
margin: 0;
|
||
|
|
font-family: Arial, sans-serif;
|
||
|
|
color: #333; /* Dark green text */
|
||
|
|
}
|
||
|
|
header {
|
||
|
|
text-align: center;
|
||
|
|
padding: 20px;
|
||
|
|
}
|
||
|
|
h1 {
|
||
|
|
color: #5cae5c; /* Medium green for the title */
|
||
|
|
}
|
||
|
|
h2 {
|
||
|
|
color: #4cae4c; /* Slightly lighter green for section headings */
|
||
|
|
}
|
||
|
|
p {
|
||
|
|
color: #555; /* Darker grey for paragraph text */
|
||
|
|
}
|
||
|
|
#donation-form {
|
||
|
|
max-width: 600px;
|
||
|
|
margin: 20px auto;
|
||
|
|
padding: 20px;
|
||
|
|
background-color: #ffffff; /* White background for the form */
|
||
|
|
border-radius: 8px;
|
||
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||
|
|
}
|
||
|
|
label {
|
||
|
|
display: block;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #2d572c; /* Dark green for labels */
|
||
|
|
}
|
||
|
|
select,
|
||
|
|
input[type="text"],
|
||
|
|
input[type="number"],
|
||
|
|
input[type="datetime-local"],
|
||
|
|
textarea {
|
||
|
|
width: 100%;
|
||
|
|
padding: 10px;
|
||
|
|
border: 1px solid #b2d3b2; /* Light green border */
|
||
|
|
border-radius: 4px;
|
||
|
|
font-size: 16px;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
button {
|
||
|
|
width: 100%;
|
||
|
|
padding: 10px;
|
||
|
|
background-color: #5cb85c; /* Button green */
|
||
|
|
color: #ffffff; /* White text on button */
|
||
|
|
border: none;
|
||
|
|
border-radius: 4px;
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: bold;
|
||
|
|
cursor: pointer;
|
||
|
|
transition: background-color 0.3s ease;
|
||
|
|
}
|
||
|
|
button:hover {
|
||
|
|
background-color: #4cae4c; /* Darker green on hover */
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<section id="donation-form-page">
|
||
|
|
<header>
|
||
|
|
<h1>
|
||
|
|
Donate to <span id="organization-name-display">Organization</span>
|
||
|
|
</h1>
|
||
|
|
<p>
|
||
|
|
Thank you for your willingness to help. Please fill out the donation
|
||
|
|
details below.
|
||
|
|
</p>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<!-- Donation Form -->
|
||
|
|
<div id="donation-form">
|
||
|
|
<h2>Donate Food</h2>
|
||
|
|
<form id="donationForm" action="thankyou.php" method="POST">
|
||
|
|
<label for="food-type">Food Type:</label>
|
||
|
|
<select id="food-type" name="food-type" required>
|
||
|
|
<option value="canned">Canned Goods</option>
|
||
|
|
<option value="fresh">Fresh Produce</option>
|
||
|
|
<option value="prepared">Prepared Meals</option>
|
||
|
|
</select>
|
||
|
|
|
||
|
|
<label for="quantity">Quantity:</label>
|
||
|
|
<input
|
||
|
|
type="number"
|
||
|
|
id="quantity"
|
||
|
|
name="quantity"
|
||
|
|
placeholder="Enter quantity"
|
||
|
|
required
|
||
|
|
/>
|
||
|
|
|
||
|
|
<label for="pickup">Preferred Pickup/Drop-off Time:</label>
|
||
|
|
<input type="datetime-local" id="pickup" name="pickup" required />
|
||
|
|
|
||
|
|
<label for="pickup-address">Pickup Address:</label>
|
||
|
|
<input
|
||
|
|
type="text"
|
||
|
|
id="pickup-address"
|
||
|
|
name="pickup-address"
|
||
|
|
placeholder="Enter pickup address"
|
||
|
|
required
|
||
|
|
/>
|
||
|
|
|
||
|
|
<label for="comments">Additional Comments:</label>
|
||
|
|
<textarea
|
||
|
|
id="comments"
|
||
|
|
name="comments"
|
||
|
|
placeholder="Any additional information"
|
||
|
|
rows="4"
|
||
|
|
></textarea>
|
||
|
|
|
||
|
|
<button type="submit">Submit Donation</button>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
</body>
|
||
|
|
</html>
|