servala/website
1
0
Fork 0
Code Issues 10 Pull requests Projects 1 Packages 1 Activity Actions

style contact form

Browse source
This commit is contained in:
Tobias Brunner 2025-02-25 11:16:39 +01:00
parent b5599b3e0e
commit ba6f9b0c65
No known key found for this signature in database
3 changed files with 102 additions and 85 deletions
Download patch file Download diff file Expand all files Collapse all files

125
hub/services/templates/services/lead_form.html
View file

@ -1,46 +1,22 @@
{% extends 'services/base.html' %} {% extends 'services/base.html' %}
{% load form_tags %}
{% block content %} {% block content %}
<div class="row justify-content-center"> <section class="section">
<div class="col-md-8"> <div class="container mx-auto px-20 px-lg-0 pt-80 pb-60">
<div class="card"> <div class="d-lg-flex">
<div class="card-body"> <div class="flex-1 pr-lg-40 mb-40 mb-lg-0">
<h2 class="card-title mb-4">Interested in {{ service.name }}</h2> <div class="bg-gray-50 rounded-20 p-40">
<header>
{% if selected_offering %} <h2 class="fs-44 fw-semibold mb-40">Enter your details</h2>
<div class="mb-4"> </header>
<h5>Service Details</h5>
{% if selected_offering %}
<p><strong>Provider:</strong> {{ selected_offering.cloud_provider.name }}</p>
{% endif %}
{% if selected_plan %}
<p><strong>Plan:</strong> {{ selected_plan.name }}</p>
{% if selected_plan.prices.exists %}
<p><strong>Pricing:</strong></p>
<ul class="list-unstyled">
{% for price in selected_plan.prices.all %}
<li>{{ price.currency.symbol }}{{ price.price }} {{ price.currency.code }} per {{ price.term.name }}</li>
{% endfor %}
</ul>
{% endif %}
{% endif %}
</div>
{% endif %}
{% if messages %}
{% for message in messages %}
<div class="alert alert-{{ message.tags }}">
{{ message }}
</div>
{% endfor %}
{% endif %}
<form method="post"> <form method="post">
{% csrf_token %} {% csrf_token %}
<div class="mb-3"> <div class="mb-40">
<label for="{{ form.name.id_for_label }}" class="form-label">Name</label> <label for="{{ form.name.id_for_label }}" class="form-label text-purple">Your Name</label>
{{ form.name }} {{ form.name|addclass:"form-control" }}
{% if form.name.errors %} {% if form.name.errors %}
<div class="invalid-feedback d-block"> <div class="invalid-feedback d-block">
{{ form.name.errors }} {{ form.name.errors }}
@ -48,19 +24,9 @@
{% endif %} {% endif %}
</div> </div>
<div class="mb-3"> <div class="mb-40">
<label for="{{ form.company.id_for_label }}" class="form-label">Company</label> <label for="{{ form.email.id_for_label }}" class="form-label text-purple">Your Email Address</label>
{{ form.company }} {{ form.email|addclass:"form-control" }}
{% if form.company.errors %}
<div class="invalid-feedback d-block">
{{ form.company.errors }}
</div>
{% endif %}
</div>
<div class="mb-3">
<label for="{{ form.email.id_for_label }}" class="form-label">Email</label>
{{ form.email }}
{% if form.email.errors %} {% if form.email.errors %}
<div class="invalid-feedback d-block"> <div class="invalid-feedback d-block">
{{ form.email.errors }} {{ form.email.errors }}
@ -68,9 +34,9 @@
{% endif %} {% endif %}
</div> </div>
<div class="mb-3"> <div class="mb-40">
<label for="{{ form.phone.id_for_label }}" class="form-label">Phone</label> <label for="{{ form.phone.id_for_label }}" class="form-label text-purple">Your Phone Number</label>
{{ form.phone }} {{ form.phone|addclass:"form-control" }}
{% if form.phone.errors %} {% if form.phone.errors %}
<div class="invalid-feedback d-block"> <div class="invalid-feedback d-block">
{{ form.phone.errors }} {{ form.phone.errors }}
@ -78,9 +44,19 @@
{% endif %} {% endif %}
</div> </div>
<div class="mb-3"> <div class="mb-40">
<label for="{{ form.message.id_for_label }}" class="form-label">Message (Optional)</label> <label for="{{ form.company.id_for_label }}" class="form-label text-purple">Your Company</label>
{{ form.message }} {{ form.company|addclass:"form-control" }}
{% if form.company.errors %}
<div class="invalid-feedback d-block">
{{ form.company.errors }}
</div>
{% endif %}
</div>
<div class="mb-40">
<label for="{{ form.message.id_for_label }}" class="form-label text-purple">Message (Optional)</label>
{{ form.message|addclass:"form-control" }}
{% if form.message.errors %} {% if form.message.errors %}
<div class="invalid-feedback d-block"> <div class="invalid-feedback d-block">
{{ form.message.errors }} {{ form.message.errors }}
@ -89,12 +65,45 @@
</div> </div>
<div class="mt-4"> <div class="mt-4">
<button type="submit" class="btn btn-primary">Submit</button> <button type="submit" class="btn btn-primary btn-lg w-100">Submit</button>
<a href="{% url 'services:service_detail' service.slug %}" class="btn btn-secondary">Cancel</a>
</div> </div>
</form> </form>
</div> </div>
</div> </div>
{% if selected_offering %}
<div class="w-lg-34 bg-purple-50 rounded-16 p-24 d-flex flex-column">
<div class="d-flex align-items-center mb-24">
<div class="card__image mb-0">
{% if selected_offering.service.logo %}
<img class="img-fluid" src="{{ selected_offering.service.logo.url }}" alt="">
{% endif %}
</div> </div>
</div> <div class="card__header ps-16">
<h3 class="card__title">{{ service.name }}</h3>
<p class="card__subtitle mb-0">on {{ selected_offering.cloud_provider.name }}</p>
</div>
</div>
{% if selected_plan %}
<div class="mb-24">
<div class="bg-white border-all rounded-7 p-20">
<h3 class="text-purple fs-18 fw-semibold lh-1-7 mb-0">{{ selected_plan.name }}</h3>
{% if selected_plan.prices.exists %}
<div>
<ul class="list-unstyled text-gray-500 fs-14 lh-1-7 ps-0 mb-0">
{% for price in selected_plan.prices.all %}
<li>{{ price.currency.symbol }}{{ price.price }} {{ price.currency.code }} per {{ price.term.name }}</li>
{% endfor %}
</ul>
</div>
{% endif %}
</div>
</div>
{% endif %}
</div>
{% endif %}
</div>
</div>
</section>
{% endblock %} {% endblock %}

0
hub/services/templatetags/__init__.py Normal file
View file

8
hub/services/templatetags/form_tags.py Normal file
View file

@ -0,0 +1,8 @@
from django import template
register = template.Library()
@register.filter(name="addclass")
def addclass(value, arg):
return value.as_widget(attrs={"class": arg})