oacpl/main/templates/index.html

210 lines
8.9 KiB
HTML

{% extends 'base.html' %}
{% load static %}
{% block head %}
<script>
$(function() {
$('#top').click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
});
$('#contact-submit').click(function() {
var name = $('#contact-name');
var email = $('#contact-email');
var subject = $('#contact-subject');
var body = $('#contact-body');
function validateEmail($email) {
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
return emailReg.test( $email );
}
if(!name.val()) name.effect('shake');
if(!email.val() || !validateEmail(email.val())) email.effect('shake');
if(!subject.val()) subject.effect('shake');
if(!body.val()) body.effect('shake');
if(name.val() && email.val() && validateEmail(email.val()) && subject.val() && body.val()) {
$.post({% url 'contact' %}, {
csrfmiddlewaretoken:$("[name='csrfmiddlewaretoken']").val(),
name: name.val(),
email: email.val(),
subject: subject.val(),
body: body.val()
}).done(function(resp) {
if(resp['success']) {
name.val('');
email.val('');
subject.val('');
body.val('');
$('#contact-success').collapse('show');
setTimeout(function() {$('#contact-success').collapse('hide');}, 5000);
}
});
}
});
});
</script>
{% endblock %}
{% block body %}
<!-- Home -->
<div class="container-fluid baby">
<div class="row h-100">
<div class="col-sm-6 col-md-5 py-5" style="background-color: rgba(0, 48, 91, 0.65)">
<h1 class="float-right d-inline-block mr-5 pl-4 text-white"><strong>
Ontario<br>Association Of<br>Child<br>Protection<br>Lawyers
</strong></h1>
</div>
</div>
</div>
<!-- Information -->
<div class="container-fluid bg-light-blue py-5">
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-4">
<h2 class="text-dark-primary">INFORMATION FOR THE PUBLIC</h2>
</div>
<div class="col-sm-12 col-md-4" style="font-size: 22px">
<ul class="mb-0">
<li class="text-dark-primary">FIND A CHILD PROTECTION LAWYER</li>
<li class="text-dark-primary">FIND AN EXPERT</li>
<li class="text-dark-primary">RESEARCH</li>
</ul>
</div>
<div class="col-sm-12 col-md-4" style="font-size: 22px">
<ul class="mb-0">
<li class="text-dark-primary">BECOME A MEMBER</li>
<li class="text-dark-primary">HOT TOPICS IN CHILD PROTECTION</li>
<li class="text-dark-primary">SEMINARS AND CLE</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Our Objectives -->
<div class="container-fluid bg-dark-primary text-white py-5">
<div class="container">
<div class="row text-center">
<h2 class="mx-auto mb-5">OUR OBJECTIVES</h2>
<div style="font-size: 22px">
<p>
The Ontario Association of Child Protection Lawyers started in Spring 2017 in Windsor, Ontario with a
group
of Family Lawyers who saw a need to increase the level of advocacy for children, families, and
communities
that were struggling in terms of Child Welfare.
</p>
<p>
The OACPL as an organization seeks to:
</p>
<p>
- increase the efficiency and level of professional expertise offered by Child Protection Lawyers in
Ontario
</p>
<p>
- provide public and professional education and input from Recognized Child Protection Lawyers on Child
Welfare Reform and Practice
</p>
<p>
- provide an organized body of Recognized Child Protection Lawyers that advocate politically and
socially on Child Welfare Matters in Ontario
</p>
<p>
- encourage the highest standards of practice and support for children, families and communities
affected by Child Protection Litigation.
</p>
</div>
</div>
</div>
</div>
<!-- Page Brake -->
<div class="cotainer-fluid hands"></div>
{% if attorneys %}
<!-- Attorneys -->
<div class="cotainer-fluid bg-light-blue py-5">
<div class="container">
<div class="row">
<h2 class="mx-auto text-dark-primary">CHARTER MEMBERS</h2>
</div>
<div class="row">
{% for attorney in attorneys %}
<a class="col-4 text-center pt-5" href="{% url 'attorney' attorney.id %}">
<div>
<img class="pb-3" src="/media/{{ attorney.image }}" style="max-width: 100%; max-height: 200px"/>
<h5 class="text-dark-primary">{{ attorney.name }}</h5>
<span class="text-light-primary">{{ attorney.position }}</span>
<hr>
</div>
</a>
{% endfor %}
</div>
</div>
</div>
{% endif %}
<!-- Contact -->
<div class="container-fluid architecture text-white">
<div class="row h-100">
<div class="col-lg-5 py-5 d-none d-sm-block" style="background-color: rgba(0, 63, 120, 0.95)">
<h1 class="float-lg-right pl-4 d-inline-block mr-5 text-white"><strong>
Ontario <br class="d-none d-lg-inline">Association Of <br class="d-none d-lg-inline"> Child<br class="d-none d-lg-inline"> Protection<br class="d-none d-lg-inline"> Lawyers
</strong></h1>
</div>
<div class="col-lg-7 py-5" style="background-color: rgba(0, 63, 120, 0.8)">
<div class="col-lg-8 pl-4">
P.O. BOX 33010
<br>
LAKEVIEW R.O.
<br>
WINDSOR, ONTARIO
<br>
N8Y 0A2
<br>
Phone: (519) 566-1677
<br>
Fax: 1-226-318-0665
<br>
Email Care of David A. Sandor, Barrister & Solicitor, Acting Director:
<br>
{{ contact }}
<br>
<br>
<br>
For any general inquiries, please fill in the following contact form:
<br>
<br>
<div class="row">
<div id="contact-success" class="col-12 collapse" aria-expanded="false">
<div class=" alert alert-success">Successfully sent email!</div>
</div>
<div class="col-lg-6">
<input id="contact-name" class="form-control" placeholder="Name">
<input id="contact-email" class="form-control" placeholder="Email">
<input id="contact-subject" class="form-control" placeholder="Subject">
</div>
<div class="col-lg-6">
<textarea id="contact-body" class="form-control h-100" placeholder="Message" rows="4"></textarea>
</div>
<div class="col-12 mt-2">
<button id="contact-submit" class="btn btn-primary float-right">Send</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Back to top -->
<div class="container-fluid bg-dark-primary text-center py-4">
<a id="top" class="text-white curs-pointer">
<img class="mx-auto" src="{% static 'main/img/arrow.png' %}" style="transform: rotate(180deg)">
<br>
BACK TO TOP
</a>
</div>
{% endblock %}