contact frontend done

This commit is contained in:
Idaapayo 2021-07-27 20:13:44 +03:00
parent 096813bdd3
commit 51ff2ddfba
6 changed files with 182 additions and 8 deletions

View File

@ -1,2 +1,2 @@
Contact us
############
:title: Contact us
:template: contactpage

View File

@ -0,0 +1,43 @@
.container-contact{
width: 50%
}
.contact-center{
text-align: center;
}
.contact-link{
color: black;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-color: black;
text-decoration-thickness: 3px;
}
.contact-wrap{
width: 250px;
margin: auto;
}
.btn-custom{
width: 100%;
background: #141f1f;
border: 1px solid #141f1f;
color: white;
padding: 0.5em;
text-align: center;
}
.btn-custom:hover{
color: white;
}
@media only screen and (max-width: 480px){
.container-contact{
width: 100%
}
}
@media (min-width: 600px) and (max-width: 1024px){
.container-contact{
width: 80%
}
}

View File

@ -0,0 +1,47 @@
{% extends "base.html" %}
{% block head %}
{{ super() }}
<link rel="stylesheet" type="text/css" href="{{SITEURL}}/theme/css/contactpage.css">
{% endblock %}
{% block content %}
<div class="container container-contact">
<div class="row pt-5">
<div class="col-lg-6 col-md-6 col-sm-12 pt-5">
<h1 class="contact-center">Get in touch</h1>
<div class="contact-center contact-wrap pt-3">
<p>We would love to hear your feedback about our work, queries and your story!</p>
<p>WhatsApp / Phone number: +254-757-628-885</p>
<p><a class="contact-link" href="https://chat.grassrootseconomics.net/cic/channels/town-square">Join our
chat server!</a></p>
<p><a class="contact-link" href="https://discord.gg/ud32KMgH76">Join us
on discord!</a></p>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-12">
<form class="pt-5" action="sendemail.py" method="post">
<div class="mb-3">
<label for="email" class="form-label">Email address</label>
<input type="email" class="form-control" id="email" name="email" aria-describedby="emailHelp">
<div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div>
</div>
<div class="mb-3">
<label for="name-contact" class="form-label">Name</label>
<input type="text" class="form-control" id="name-contact" name="name">
</div>
<div class="mb-3">
<label for="subject" class="form-label">Subject</label>
<input type="text" class="form-control" id="subject" name="subject">
</div>
<div class="mb-3">
<label for="exampleFormControlTextarea1" class="form-label">Message</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="5" name="message"></textarea>
</div>
<button type="submit" class="btn btn-custom btn-block">Send us a message!</button>
</form>
</div>
</div>
</div>
{% endblock %}

View File

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>grassroots-pelican - Contact us</title>
<title>grassroots-pelican</title>
<meta charset="utf-8"/>
<meta name="ida" content="Pelican"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@ -22,7 +22,7 @@
<script src="https://use.fontawesome.com/5932321f98.js"></script>
<link rel="stylesheet" type="text/css" href="../theme/css/contactpage.css">
</head>
<body id="base-index" class="base-home">
@ -70,10 +70,43 @@
</div>
</nav>
<h1>Contact us</h1>
<div class="container container-contact">
<div class="row pt-5">
<div class="col-lg-6 col-md-6 col-sm-12 pt-5">
<h1 class="contact-center">Get in touch</h1>
<div class="contact-center contact-wrap pt-3">
<p>We would love to hear your feedback about our work, queries and your story!</p>
<p>WhatsApp / Phone number: +254-757-628-885</p>
<p><a class="contact-link" href="https://chat.grassrootseconomics.net/cic/channels/town-square">Join our
chat server!</a></p>
<p><a class="contact-link" href="https://discord.gg/ud32KMgH76">Join us
on discord!</a></p>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-12">
<form class="pt-5" action="sendemail.py" method="post">
<div class="mb-3">
<label for="email" class="form-label">Email address</label>
<input type="email" class="form-control" id="email" name="email" aria-describedby="emailHelp">
<div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div>
</div>
<div class="mb-3">
<label for="name-contact" class="form-label">Name</label>
<input type="text" class="form-control" id="name-contact" name="name">
</div>
<div class="mb-3">
<label for="subject" class="form-label">Subject</label>
<input type="text" class="form-control" id="subject" name="subject">
</div>
<div class="mb-3">
<label for="exampleFormControlTextarea1" class="form-label">Message</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="5" name="message"></textarea>
</div>
<button type="submit" class="btn btn-custom btn-block">Send us a message!</button>
</form>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12 base-footer">

View File

@ -0,0 +1,43 @@
.container-contact{
width: 50%
}
.contact-center{
text-align: center;
}
.contact-link{
color: black;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-color: black;
text-decoration-thickness: 3px;
}
.contact-wrap{
width: 250px;
margin: auto;
}
.btn-custom{
width: 100%;
background: #141f1f;
border: 1px solid #141f1f;
color: white;
padding: 0.5em;
text-align: center;
}
.btn-custom:hover{
color: white;
}
@media only screen and (max-width: 480px){
.container-contact{
width: 100%
}
}
@media (min-width: 600px) and (max-width: 1024px){
.container-contact{
width: 80%
}
}

8
sendemail.py Normal file
View File

@ -0,0 +1,8 @@
import cgi
import cgitb
cgitb.enable()
form_inputs = cgi.FieldStorage()
email = form_inputs.getvalue('name')
print(str(email))