Added sent message to contact form

project/pages/views.py

@@ -36,6 +36,11 @@ class AboutIndexView(CustomFormTemplate):
     success_url = '/about/?sent'
     form_class = ContactForm
 
+    def get_context_data(self, **kwargs):
+        context = super().get_context_data(**kwargs)
+        context['sent'] = 'sent' not in self.request.GET
+        return context
+
     def form_valid(self, form):
         form.send_email()
         return super().form_valid(form)

static/src/less/style.less

@@ -174,7 +174,6 @@ footer {
 /* @end content base */
 
 .panel {
-  .box-shadow(0px 4px 4px 3px rgba(0,0,0,0.6));
   margin-bottom: 40px;
 }
 

templates/about/index.html

@@ -46,14 +46,16 @@
 </div>
 
 <div class="container">
+  <h2>Contact Me</h2>
+  <p>Send me a message using the form below, please don't spam! Simply click the button below to see the form.</p>
   <div class="row">
-    <div class="col-sm-10 col-sm-push-1">
+    <div class="col-xs-12">
       <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
-        <div class="panel panel-default">
+        <div class="panel {% if sent %}panel-default{% else %}panel-success{% endif %}">
           <div class="panel-heading" role="tab" id="heading1">
             <h4 class="panel-title" style="font-size: 21px;">
               <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapse1" aria-expanded="false" aria-controls="collapse1">
-                Contact Me<i class="icon ion-ios-arrow-down"></i>
+                Contact Me {% if sent %}<i class="icon ion-ios-arrow-down"></i>{% else %}<i class="icon ion-android-done"></i>{% endif %}
               </a>
             </h4>
           </div>
@@ -63,7 +65,11 @@
                 {% csrf_token %}
                 {{ form | bootstrap }}
                 <div class="form-group">
+                  {% if sent %}
                     <button type="submit" class="btn btn-primary">Send</button>
+                  {% else %}
+                    <button type="button" class="btn btn-success">Already Sent</button>
+                  {% endif %}
                 </div>
               </form>
             </div>