benny/Portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wqInitial Commit

Browse Source
This commit is contained in:
benny
2026-04-23 01:24:24 +00:00
parent 0925125422
commit 2ccc1d0292
3474 changed files with 787147 additions and 647 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
templates/contact.html
View File

@@ -1,58 +1,64 @@
{% extends "base.html" %}
{% block title %}Contact{% endblock %}
{% block content %}
<section class="text-center py-20 bg-gradient-to-br from-red-800 to-orange-400 text-white">
<!-- Hero -->
<section class="text-center py-20 bg-gradient-to-br from-orange-500/20 via-rose-500/10 to-fuchsia-500/10 text-white shadow-inner">
<h1 class="text-5xl font-extrabold mb-4">Contact Me</h1>
<p class="text-xl mb-6">Looking to connect? Here's where you can reach me!</p>
<p class="text-lg opacity-90">Here’s my professional contact card — let’s connect!</p>
</section>
<section class="bg-black text-white py-16 px-6 md:px-20">
<!-- vCard Section -->
<section class="py-16 px-6 md:px-20 bg-black text-white">
<div class="max-w-4xl mx-auto">
<div class="grid md:grid-cols-2 gap-12">
<div class="card flex flex-col md:flex-row items-center md:items-start gap-8">
<!-- Avatar / Photo -->
<div class="flex-shrink-0">
<img src="{{ url_for('static', filename='Headshot.jpg') }}" alt="{{ CONTACT.name }}"
class="w-40 h-40 rounded-full border-4 border-[rgb(var(--accent))] shadow-glass object-cover">
</div>
<!-- Contact Info -->
<div>
<h2 class="text-3xl font-bold mb-4 text-orange-600">Get in Touch</h2>
<p class="mb-4">Feel free to drop me a message via the form or through any of the channels below:</p>
<ul class="space-y-3 text-lg">
<li><strong>Email:</strong> <a href="mailto:you@example.com" class="text-blue-600 hover:underline">ben@bennyshouse.net</a></li>
<li><strong>Business Website:</strong> <a href="https://bennyshouse.net" class="text-blue-600 hover:underline">bennyshouse.net</a></li>
<li><strong>Location:</strong> Canyon, Texas</li>
</ul>
<div class="mt-6 flex space-x-4">
<a href="https://www.instagram.com/bennyshousefr/" class="text-orange-600 hover:text-orange-800 transition"><i class="fab fa-instagram fa-lg"></i></a>
<a href="https://www.linkedin.com/in/benjamin-mosley-849643329/" class="text-orange-600 hover:text-orange-800 transition"><i class="fab fa-linkedin fa-lg"></i></a>
<a href="https://github.com/Benny-ui-ux" class="text-orange-600 hover:text-orange-800 transition"><i class="fab fa-github fa-lg"></i></a>
<div class="flex-1 space-y-4">
<h2 class="text-3xl font-bold">{{ CONTACT.name }}</h2>
<p class="text-[rgb(var(--muted))]">{{ CONTACT.title }}</p>
<div class="grid sm:grid-cols-2 gap-4 text-sm sm:text-base">
<div>
<p class="font-semibold text-[rgb(var(--accent))]">Email</p>
<a href="mailto:{{ CONTACT.email }}" class="hover:underline">{{ CONTACT.email }}</a>
</div>
<div>
<p class="font-semibold text-[rgb(var(--accent))]">Phone</p>
<a href="tel:{{ CONTACT.phone|replace(' ', '') }}" class="hover:underline">{{ CONTACT.phone }}</a>
</div>
<div>
<p class="font-semibold text-[rgb(var(--accent))]">City / Region</p>
<p>{{ CONTACT.city }}</p>
</div>
<div>
<p class="font-semibold text-[rgb(var(--accent))]">Hours</p>
<p>{{ CONTACT.hours }}</p>
</div>
</div>
<div class="pt-4 flex flex-wrap gap-3">
<a href="{{ CONTACT.site }}" target="_blank" class="btn btn-primary items-center">
<i class="fa fa-globe mr-2 text-[rgb(var(--accent))]"></i> Website
</a>
<a href="{{ CONTACT.link }}" target="_blank" class="btn btn-primary border-none bg-[rgb(var(--card))] hover:bg-[rgb(var(--border))]">
<i class="fab fa-linkedin mr-2 text-[rgb(var(--accent))]"></i> LinkedIn
</a>
<a href="{{ CONTACT.cal }}" target="_blank" class="btn btn-primary border-none bg-[rgb(var(--card))] hover:bg-[rgb(var(--border))]">
<i class="fa fa-calendar mr-2 text-[rgb(var(--accent))]"></i> Schedule Meeting
</a>
</div>
</div>
<div>
<form method="POST" action="/contact" class="space-y-4">
<div>
<label for="name" class="block font-semibold mb-1">Name</label>
<input type="text" id="name" name="name" required class="text-black w-full border border-gray-300 rounded px-4 py-2 focus:ring-2 focus:ring-orange-400 focus:outline-none">
</div>
<div>
<label for="email" class="block font-semibold mb-1">Email</label>
<input type="email" id="email" name="email" required class="text-black w-full border border-gray-300 rounded px-4 py-2 focus:ring-2 focus:ring-orange-400 focus:outline-none">
</div>
<div>
<label for="message" class="block font-semibold mb-1">Message</label>
<textarea id="message" name="message" rows="5" required class="text-black w-full border border-gray-300 rounded px-4 py-2 focus:ring-2 focus:ring-orange-400 focus:outline-none"></textarea>
</div>
<div class="text-right">
<button type="submit" class="bg-orange-600 text-white px-6 py-2 rounded hover:bg-orange-700 transition">Send</button>
</div>
</form>
</div>
</div>
</div>
</section>
{% endblock %}