oacpl/main/templates/index.html

243 lines
10 KiB
HTML
Raw Normal View History

2017-08-17 13:20:57 -04:00
{% extends 'base.html' %}
{% load static %}
2017-09-16 15:58:49 -04:00
{% block head %}
<script>
$(function() {
// Show modal for live youtube conference
{% if youtube %}
$('#liveModal').modal('show');
{% endif %}
2018-01-23 20:54:20 -05:00
2017-09-16 16:26:58 -04:00
$('#top').click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
});
2017-09-16 15:58:49 -04:00
$('#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 %}
2017-08-17 13:20:57 -04:00
{% block body %}
<!-- Home -->
<div class="container-fluid baby">
<div class="row h-100">
2017-08-17 14:27:54 -04:00
<div class="col-sm-6 col-md-5 py-5" style="background-color: rgba(0, 48, 91, 0.65)">
2017-08-17 13:20:57 -04:00
<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>
2017-09-16 16:12:29 -04:00
<div class="col-sm-12 col-md-4" style="font-size: 22px">
2017-08-17 13:20:57 -04:00
<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>
2017-09-16 16:12:29 -04:00
<div class="col-sm-12 col-md-4" style="font-size: 22px">
2017-08-17 13:20:57 -04:00
<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>
2017-09-16 16:12:29 -04:00
<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>
2017-08-17 13:20:57 -04:00
</div>
</div>
</div>
<!-- Page Brake -->
<div class="cotainer-fluid hands"></div>
{% if attorneys %}
2017-08-17 13:20:57 -04:00
<!-- 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 %}
2017-08-18 21:24:33 -04:00
<a class="col-4 text-center pt-5" href="{% url 'attorney' attorney.id %}">
2017-08-17 13:20:57 -04:00
<div>
<img class="pb-3" src="/media/{{ attorney.image }}" style="width: auto; max-width: 100%; height: 200px"/>
2018-01-25 00:18:13 -05:00
<h5 class="text-dark-primary">{{ attorney.first_name }} {{ attorney.last_name }}</h5>
2017-08-17 13:20:57 -04:00
<span class="text-light-primary">{{ attorney.position }}</span>
<hr>
</div>
</a>
{% endfor %}
</div>
2018-01-14 17:55:35 -05:00
<div class="col-12 mt-3 text-center">
<a class="text-dark-primary" href="{% url 'members' %}">View All</a>
</div>
2017-08-17 13:20:57 -04:00
</div>
</div>
{% endif %}
2017-08-17 13:20:57 -04:00
<!-- Contact -->
<div class="container-fluid architecture text-white">
<div class="row h-100">
2017-09-29 17:20:02 -04:00
<div class="col-lg-5 py-5 d-none d-sm-block" style="background-color: rgba(0, 63, 120, 0.95)">
2017-08-17 13:20:57 -04:00
<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 }}
2017-08-17 13:20:57 -04:00
<br>
<br>
<br>
For any general inquiries, please fill in the following contact form:
<br>
<br>
2018-01-23 20:21:19 -05:00
<div class="form-row">
2017-09-16 15:58:49 -04:00
<div id="contact-success" class="col-12 collapse" aria-expanded="false">
<div class=" alert alert-success">Successfully sent email!</div>
</div>
2018-01-23 20:21:19 -05:00
<div class="form-group col-12 col-md-6">
2017-09-16 15:58:49 -04:00
<input id="contact-name" class="form-control" placeholder="Name">
2018-01-23 20:21:19 -05:00
</div>
<div class="form-group col-12 col-md-6">
2017-09-16 15:58:49 -04:00
<input id="contact-email" class="form-control" placeholder="Email">
2018-01-23 20:21:19 -05:00
</div>
<div class="form-group col-12">
2017-09-16 15:58:49 -04:00
<input id="contact-subject" class="form-control" placeholder="Subject">
2017-08-17 13:20:57 -04:00
</div>
2018-01-23 20:21:19 -05:00
<div class="col-12">
2017-09-16 15:58:49 -04:00
<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>
2017-08-17 13:20:57 -04:00
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Back to top -->
<div class="container-fluid bg-dark-primary text-center py-4">
2017-09-16 16:26:58 -04:00
<a id="top" class="text-white curs-pointer">
2017-08-17 13:20:57 -04:00
<img class="mx-auto" src="{% static 'main/img/arrow.png' %}" style="transform: rotate(180deg)">
<br>
BACK TO TOP
</a>
</div>
2018-01-23 20:54:20 -05:00
{% if youtube %}
<div id="liveModal" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel"><i class="fa fa-circle text-danger"></i> Live Conference</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<iframe width="100%" height="400px" src="{{ youtube }}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
2018-01-23 20:54:20 -05:00
</div>
</div>
</div>
{% endif %}
2017-08-17 13:20:57 -04:00
{% endblock %}