root
156 lines
6.0 KiB
PHP
156 lines
6.0 KiB
PHP
<?php
|
|
|
|
/**
|
|
* Complete Picture Policy Page
|
|
* Contains the full policy with header, text, and consent form
|
|
*/
|
|
?>
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Picture Agreement - Al Rahma Sunday School</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<style>
|
|
body {
|
|
background-color: #f8f9fa;
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
}
|
|
|
|
.policy-container {
|
|
max-width: 800px;
|
|
margin: 2rem auto;
|
|
background: white;
|
|
border-radius: 12px;
|
|
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.policy-header {
|
|
background: linear-gradient(135deg, #4e73df 0%, #224abe 100%);
|
|
color: white;
|
|
padding: 2rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.policy-body {
|
|
padding: 2rem;
|
|
line-height: 1.8;
|
|
color: #444;
|
|
}
|
|
|
|
.policy-text {
|
|
background-color: #f9f9f9;
|
|
border-left: 4px solid #4e73df;
|
|
padding: 1.5rem;
|
|
margin: 1.5rem 0;
|
|
border-radius: 0 4px 4px 0;
|
|
}
|
|
|
|
.signature-section {
|
|
margin-top: 2rem;
|
|
padding-top: 1.5rem;
|
|
border-top: 1px solid #eee;
|
|
}
|
|
|
|
.btn-primary {
|
|
background-color: #4e73df;
|
|
border-color: #4e73df;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background-color: #224abe;
|
|
border-color: #224abe;
|
|
}
|
|
|
|
.permission-badge {
|
|
display: inline-block;
|
|
padding: 0.35em 0.65em;
|
|
font-size: 0.75em;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
color: #fff;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
vertical-align: baseline;
|
|
border-radius: 0.25rem;
|
|
background-color: #1cc88a;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="policy-container">
|
|
<div class="policy-header">
|
|
<h1><i class="fas fa-camera me-2"></i>Media Permission Policy</h1>
|
|
<p class="mb-0">Al Rahma Sunday School</p>
|
|
</div>
|
|
|
|
<div class="policy-body">
|
|
<div class="alert alert-info d-flex align-items-center">
|
|
<i class="fas fa-info-circle fa-2x me-3"></i>
|
|
<div>This policy allows the school to photograph students for educational and promotional purposes</div>
|
|
</div>
|
|
|
|
<h3 class="mb-4">Parent/Guardian Media Consent Form</h3>
|
|
|
|
<div class="policy-text">
|
|
<p class="mb-0">I give permission to the school to take photographs/videos of my child(ren) during the course of the school year in class or during an event the school organizes. I allow the school to share these photographs/videos with me and with other parents and/or school staff through email and Whatsapp. I also allow these photographs/videos to be occasionally used for promotional and educational purposes in the school website and associated social media platforms. I do this with full knowledge and consent and waive all claims for compensation for use, or for damages. I understand that I can opt out at any moment by sending a written request to Al Rahma Sunday School.</p>
|
|
</div>
|
|
|
|
<div class="signature-section">
|
|
<h5 class="mb-3">Parent/Guardian Consent</h5>
|
|
|
|
<div class="row mb-4">
|
|
<div class="col-md-6 mb-3">
|
|
<label for="parentName" class="form-label">Parent/Guardian Name *</label>
|
|
<input type="text" class="form-control" id="parentName" required>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label for="studentName" class="form-label">Student Name(s) *</label>
|
|
<input type="text" class="form-control" id="studentName" required>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label for="signatureDate" class="form-label">Date *</label>
|
|
<input type="date" class="form-control" id="signatureDate" required>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<label for="contactEmail" class="form-label">Email Address *</label>
|
|
<input type="email" class="form-control" id="contactEmail" required>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-check mb-3">
|
|
<input class="form-check-input" type="checkbox" id="consentCheck" required>
|
|
<label class="form-check-label" for="consentCheck">
|
|
I have read and agree to the media permission policy stated above
|
|
</label>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-between align-items-center mt-4">
|
|
<div>
|
|
<span class="permission-badge">Permission Granted</span>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">
|
|
<i class="fas fa-check-circle me-1"></i> Submit Consent
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4 pt-3 border-top">
|
|
<h5>Need to update your preferences?</h5>
|
|
<p>If you need to change your media consent preferences at any time, please contact us at:</p>
|
|
<p class="mb-1"><i class="fas fa-envelope me-2"></i> info@alrahma-school.org</p>
|
|
<p class="mb-0"><i class="fas fa-phone me-2"></i> (123) 456-7890</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/js/all.min.js"></script>
|
|
</body>
|
|
|
|
</html>
|