This commit is contained in:
SanjayramVempati 2023-04-15 14:34:55 -04:00
parent ae789df637
commit 34bac0ab73
3 changed files with 78 additions and 10 deletions

View File

@ -21,23 +21,23 @@
<!-- Name -->
<div>
<label for="name" class="block mb-2 text-sm font-medium text-gray-300">Your Name/Organization</label>
<input type="name" id="name" name="name" class="shadow-sm bg-gray-700 border text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 bg-gray border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500 shadow-sm-light" placeholder="Bill Gates (give me money)" required>
<input type="name" id="name" name="name" class="shadow-sm bg-gray-700 border text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 bg-gray border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500 shadow-sm-light" placeholder="Name" required>
</div>
<!-- Email -->
<div>
<label for="email" class="block mb-2 text-sm font-medium text-gray-300">Your email</label>
<input type="email" id="email" name="email" class="shadow-sm bg-gray-700 border text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 bg-gray border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500 shadow-sm-light" placeholder="billGates@gmail.com" required>
<input type="email" id="email" name="email" class="shadow-sm bg-gray-700 border text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 bg-gray border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500 shadow-sm-light" placeholder="email@email.com" required>
</div>
<!-- Subject -->
<div>
<label for="subject" class="block mb-2 text-sm font-medium text-gray-300">Subject</label>
<input type="text" id="subject" name="subject" class="block p-3 w-full text-sm rounded-lg border shadow-sm focus:ring-primary-500 focus:border-primary-500 bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500 shadow-sm-light" placeholder="Watchu on about" required>
<input type="text" id="subject" name="subject" class="block p-3 w-full text-sm rounded-lg border shadow-sm focus:ring-primary-500 focus:border-primary-500 bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500 shadow-sm-light" placeholder="Title of your message" required>
</div>
<!-- Text -->
<div class="sm:col-span-2">
<label for="message" class="block mb-2 text-sm font-medium text-gray-400">Your message</label>
<textarea id="message" name="message" rows="6" class="block p-2.5 w-full text-sm rounded-lg shadow-sm border focus:ring-primary-500 focus:border-primary-500 bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500" placeholder="Gimme some info"></textarea>
<textarea id="message" name="message" rows="6" class="block p-2.5 w-full text-sm rounded-lg shadow-sm border focus:ring-primary-500 focus:border-primary-500 bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-primary-500 focus:border-primary-500" placeholder="Your full message"></textarea>
</div>
<button type="submit" class="py-3 px-5 text-sm bg-blue-900 font-medium text-center text-white rounded-lg bg-primary-700 sm:w-fit hover:bg-primary-800 focus:ring-4 focus:outline-none focus:ring-primary-300 bg-primary-600 hover:bg-primary-700 focus:ring-primary-800">Send message</button>

Binary file not shown.

After

Width:  |  Height:  |  Size: 100 KiB

View File

@ -6,10 +6,11 @@ import Footer from '../components/Footer.astro';
//Component Imports
import PersonCard from '../components/cards/PersonCard.astro';
import Tag from '/src/components/buttons/Tag.astro';
import OutlineButton from '/src/components/buttons/OutlineButton.astro';
// import OutlineButton from '/src/components/buttons/OutlineButton.astro';
//Image imports
import Ram from '/src/images/people/ram.png';
import Anish from '/src/images/people/anish.jpg';
import Sanjay from '/src/images/people/sanjay.png';
@ -27,22 +28,30 @@ import Anish from '/src/images/people/anish.jpg';
<!-- Category buttons -->
<div class="flex flex-row justify-center mb-20 space-x-14">
<!-- Leads -->
<!-- Buttons -->
<button id="lead" class="border-blue-400 text-blue-500 text-lg font-bold font-mono px-2 py-2 border-2 rounded-lg button hid" > Leads</button>
<!-- Engineering -->
<button id="engineering" class="border-blue-400 text-blue-500 text-lg font-bold font-mono px-2 py-2 border-2 rounded-lg button hid" > Engineering</button>
<button id="website" class="border-blue-400 text-blue-500 text-lg font-bold font-mono px-2 py-2 border-2 rounded-lg button hid" > Website</button>
</div>
<div class="grid-cols-3 flex justify-center space-x-10 gap-y-10 mb-20">
<!-- Engineering category -->
<div class=" hidden" id="engineeringDiv">
<PersonCard title="Ram Vempati" id="" image={Ram}>
<PersonCard name="Ram Vempati" id="" image={Ram}>
Hello my name is ram and I am from tech support.
<div slot="tags">
<Tag>Lead</Tag>
@ -52,10 +61,15 @@ import Anish from '/src/images/people/anish.jpg';
</PersonCard>
</div>
<!-- Lead category -->
<div class=" hidden" id="leadDiv">
<PersonCard title="Anish suvurna" id="" image={Anish}>
<PersonCard name="Anish suvurna" id="" image={Anish}>
Hello this is anish and i trap kids in my basement
<div slot="tags">
<Tag>Basement</Tag>
@ -65,7 +79,48 @@ import Anish from '/src/images/people/anish.jpg';
</div>
</PersonCard>
</div>
<!-- website category -->
<div class=" hidden" id="websiteDiv">
<PersonCard name="Sanjay" id="" image={Sanjay}>
yo
<div slot="tags">
<Tag>Website Creator</Tag>
<Tag>Control Systems</Tag>
<Tag>Programming</Tag>
<Tag>Engineering</Tag>
</div>
</PersonCard>
</div>
</div>
@ -85,11 +140,24 @@ import Anish from '/src/images/people/anish.jpg';
document.getElementById("engineering").addEventListener("click", function(){
document.getElementById("engineeringDiv").classList.toggle("hidden");
});
// Lead Divs
document.getElementById("lead").addEventListener("click", function(){
document.getElementById("leadDiv").classList.toggle("hidden");
});
// Website Divs
document.getElementById("website").addEventListener("click", function(){
document.getElementById("websiteDiv").classList.toggle("hidden");
});
// Make buttons red on click
for (var i = 0; i < buttons.length; i++) {