mirror of
https://github.com/PotentiaRobotics/potentia-website.git
synced 2025-04-09 14:50:16 -04:00
improved
This commit is contained in:
parent
b249150651
commit
f3c6d215d3
46
src/components/ContactForm.astro
Normal file
46
src/components/ContactForm.astro
Normal file
|
@ -0,0 +1,46 @@
|
|||
---
|
||||
|
||||
---
|
||||
|
||||
|
||||
<section class=" bg-gray-900">
|
||||
<div class="py-8 lg:py-16 px-4 mx-auto max-w-screen-md">
|
||||
<h2 class="mb-4 text-4xl tracking-tight font-extrabold text-center text-white">Contact Us</h2>
|
||||
<p class="mb-8 lg:mb-16 font-light text-center text-gray-400 sm:text-xl">Contact the Potentia Team for any information, requests, or if you want to sponsor us. (Please give us money)</p>
|
||||
|
||||
<form action="https://formsubmit.co/sanjayram.vempati@gmail.com" method="POST" class="space-y-8">
|
||||
<!-- Honeypot -->
|
||||
<input type="text" name="_honey" style="display:none;">
|
||||
|
||||
<!-- Disable capcha -->
|
||||
<input type="hidden" name="_captcha" value="false">
|
||||
|
||||
<input type="hidden" name="_next" value="http://localhost:3000/success" >
|
||||
|
||||
|
||||
<!-- 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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</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>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
|
@ -6,30 +6,45 @@ import AlertButton from './buttons/AlertButton.astro'
|
|||
---
|
||||
|
||||
|
||||
<ol class="relative border-l border-gray-200 dark:border-gray-700">
|
||||
<ol class="relative border-l border-gray-700 max-md:ml-8 mr-4 ">
|
||||
|
||||
|
||||
<TimelineCard title="Website Finished" date="April 28 2023" >
|
||||
<!-- Event 5 -->
|
||||
<TimelineCard title="Website Finished" date="April 2023" >
|
||||
<div slot="title">
|
||||
<AlertButton>Hello</AlertButton>
|
||||
<AlertButton>Latest</AlertButton>
|
||||
</div>
|
||||
The website has finally been finished after living for 1 month in Anish's basement. He finaly released me. FREEDOM!!!
|
||||
</TimelineCard>
|
||||
|
||||
<TimelineCard title="Website Finished" date="April 28 2023" >
|
||||
<div slot="title">
|
||||
<AlertButton>Hello</AlertButton>
|
||||
</div>
|
||||
The website has finally been finished after living for 1 month in Anish's basement. He finaly released me. FREEDOM!!!
|
||||
<!-- Event 4 -->
|
||||
<TimelineCard title="Gait Generation Algorithm Complete" date="March 2022" >
|
||||
Inverse Kinematics-driven gait generation algorithm demo displayed Olympian walking with a human-like gait in simulation. The highly-scalable algorithm is able to generate a human-like gait trajectory given just a step height and a step length.
|
||||
|
||||
|
||||
|
||||
</TimelineCard>
|
||||
|
||||
<!-- Event 3 -->
|
||||
<TimelineCard title="Lower Body Design Complete" date="February 2022" >
|
||||
|
||||
|
||||
<TimelineCard title="Website Finished" date="April 28 2023" >
|
||||
<div slot="title">
|
||||
<AlertButton>Hello</AlertButton>
|
||||
</div>
|
||||
Lower body design complete in CAD, leg manufacturing begun.
|
||||
|
||||
</TimelineCard>
|
||||
<!-- Event 2 -->
|
||||
|
||||
<TimelineCard title="Blance Algorithm Complete" date="July 2021" >
|
||||
|
||||
|
||||
Modified PID balance algorithm demo showed Olympian balancing in simulation after receiving a 4500 N impact to the chest.
|
||||
</TimelineCard>
|
||||
<!-- Event 1 -->
|
||||
|
||||
<TimelineCard title="Potentia Robotics Created" date="December 2020" >
|
||||
|
||||
|
||||
Potentia Robotics was created with an initial team of 15 people, comprised of students from the Thomas Jefferson High School for Science and Technology.
|
||||
|
||||
The website has finally been finished after living for 1 month in Anish's basement. He finaly released me. FREEDOM!!!
|
||||
</TimelineCard>
|
||||
|
||||
</ol>
|
||||
|
|
|
@ -2,6 +2,6 @@
|
|||
|
||||
---
|
||||
|
||||
<button class="text-sm font-medium mr-2 px-2.5 py-0.5 rounded bg-blue-900 text-blue-300 ml-3">
|
||||
<button class="text-base font-medium mr-2 px-2.5 py-0.5 rounded mb-1 bg-blue-900 text-blue-300 ml-3 ">
|
||||
<slot></slot>
|
||||
</span>
|
||||
|
|
|
@ -2,6 +2,6 @@
|
|||
|
||||
---
|
||||
|
||||
<span class="inline-block bg-gray-300 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">
|
||||
<button class="inline-block bg-gray-300 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">
|
||||
<slot>Text goes here</slot>
|
||||
</span>
|
||||
</button>
|
|
@ -14,7 +14,7 @@ import mountain from "/src/images/mountain.jpg"
|
|||
|
||||
<div class="max-w-sm rounded overflow-hidden shadow-lg bg-slate-200">
|
||||
|
||||
<img class="w-full h-64 " src={image}>
|
||||
<img class="w-full object-cover h-64 " src={image}>
|
||||
<div class="px-6 py-4">
|
||||
<div class="font-bold text-xl mb-2">{name}</div>
|
||||
<p class="text-gray-700 text-base">
|
||||
|
|
|
@ -2,16 +2,22 @@
|
|||
var {title = "Title", date="Jan 1 2023"} = Astro.props;
|
||||
---
|
||||
|
||||
<li class="mb-10 ml-10 ">
|
||||
<span class="absolute flex items-center justify-center w-8 h-8 rounded-full -left-4 ring-8 ring-gray-900 bg-gray-900 text-blue-400 hover:ring-blue-500 hover:bg-blue-500 hover:text-gray-900 duration-300">
|
||||
<svg aria-hidden="true" class="w-5 h-5 " fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd"></path></svg>
|
||||
<li class="mb-12 ml-12 ">
|
||||
<span class="absolute flex items-center justify-center w-10 h-10 rounded-full -left-5 ring-8 ring-gray-900 bg-gray-900 text-blue-400 hover:ring-blue-500 hover:bg-blue-500 hover:text-gray-900 duration-300">
|
||||
<svg aria-hidden="true" class="w-6 h-6 " fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z" clip-rule="evenodd"></path></svg>
|
||||
</span>
|
||||
|
||||
<time class="block mb-2 leading-none ">
|
||||
<button class="text-base font-extrabold mr-2 px-3 py-0.5 rounded-2xl bg-red-500 text-white font-mono shadow-sm ">
|
||||
{date}
|
||||
</button>
|
||||
|
||||
</time>
|
||||
|
||||
<h3 class="flex items-center mb-1 text-lg font-semibold text-white">{title}<slot name="title" ></slot></h3>
|
||||
<h3 class="flex items-center mb-1 text-2xl font-semibold text-blue-300">{title}<slot name="title" ></slot></h3>
|
||||
|
||||
<time class="block mb-2 text-sm font-normal leading-none text-gray-500">{date}</time>
|
||||
|
||||
<p class="mb-4 text-base font-normal text-gray-400">
|
||||
<p class=" w-[40em] max-md:w-full mb-4 text-lg font-normal text-gray-100">
|
||||
<slot>
|
||||
|
||||
</slot>
|
||||
|
|
BIN
src/images/rooms.jpg
Normal file
BIN
src/images/rooms.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 47 KiB |
37
src/pages/404.astro
Normal file
37
src/pages/404.astro
Normal file
|
@ -0,0 +1,37 @@
|
|||
---
|
||||
//Layout imports
|
||||
import Layout from '../layouts/Layout.astro';
|
||||
import Nav from '../components/Nav.astro';
|
||||
import Footer from '../components/Footer.astro';
|
||||
//Component Imports
|
||||
import OutlineButton from '/src/components/buttons/OutlineButton.astro'
|
||||
//Image imports
|
||||
import rooms from '/src/images/rooms.jpg';
|
||||
|
||||
|
||||
---
|
||||
|
||||
<Layout title="| Success!!">
|
||||
<!-- Audio -->
|
||||
|
||||
|
||||
<section class=" bg-gray-800 ">
|
||||
<img src={rooms} class="w-full absolute ">
|
||||
|
||||
<div class="relative py-10 px-4 mx-auto max-w-screen-md ">
|
||||
<div class="relative h-32"></div>
|
||||
<h2 class="mb-4 text-4xl tracking-tight font-extrabold text-center text-black">This page does not exist. Welcome to Anish's basement.</h2>
|
||||
<p class="mb-8 lg:mb-16 font-light text-center text-gray-400 sm:text-xl"></p>
|
||||
|
||||
|
||||
<div class="flex flex-row justify-center space-x-20">
|
||||
<OutlineButton link="/" text="Go Back Home" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Footer -->
|
||||
</Layout>
|
|
@ -4,7 +4,7 @@ import Layout from '../layouts/Layout.astro';
|
|||
import Nav from '../components/Nav.astro';
|
||||
import Footer from '../components/Footer.astro';
|
||||
//Component Imports
|
||||
|
||||
import ContactForm from '/src/components/ContactForm.astro'
|
||||
//Image imports
|
||||
|
||||
|
||||
|
@ -14,7 +14,7 @@ import Footer from '../components/Footer.astro';
|
|||
<Layout title="| Contact">
|
||||
<!-- Navbar -->
|
||||
<Nav> <span slot="contact" class="text-blue-300 shadow-2xl shadow-orange-600 ">CONTACT</span></Nav>
|
||||
|
||||
<ContactForm></ContactForm>
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -37,7 +37,7 @@ import OutlineButton from '../components/buttons/OutlineButton.astro';
|
|||
<h3 class="mr-40 mx-auto text-xl w-[22em] text-blue-300 font-medium font-serif ">Potentia Robotics is the first high school team to design and build a fully-functional humanoid robot entirely from scratch.<br> PLEASE let me out the basement anish 😭 </h3>
|
||||
<!-- Buttons -->
|
||||
<div class="space-x-4 flex flex-row mt-8 ">
|
||||
<OutlineButton text="Help" link="hellp"></OutlineButton>
|
||||
<OutlineButton text="Help" link="/"></OutlineButton>
|
||||
<a href="/">
|
||||
<button class=" px-4 rounded-md
|
||||
shadow-lg py-1 max-md:hidden
|
||||
|
@ -68,10 +68,10 @@ import OutlineButton from '../components/buttons/OutlineButton.astro';
|
|||
|
||||
<!-- Timeline -->
|
||||
<div class="text-center mb-10 mt-36">
|
||||
<h1 class="mb-10 text-4xl text-white font-semibold">Updates</h1>
|
||||
<h1 class="mb-10 text-4xl text-blue-400 underline underline-offset-4 font-semibold">Timeline</h1>
|
||||
</div>
|
||||
|
||||
<div class="justify-center flex ">
|
||||
<div class="justify-center flex ">
|
||||
<Timeline></Timeline>
|
||||
</div>
|
||||
|
||||
|
|
36
src/pages/success.astro
Normal file
36
src/pages/success.astro
Normal file
|
@ -0,0 +1,36 @@
|
|||
---
|
||||
//Layout imports
|
||||
import Layout from '../layouts/Layout.astro';
|
||||
import Nav from '../components/Nav.astro';
|
||||
import Footer from '../components/Footer.astro';
|
||||
//Component Imports
|
||||
import OutlineButton from '/src/components/buttons/OutlineButton.astro'
|
||||
//Image imports
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
<Layout title="| Success!!">
|
||||
<!-- Navbar -->
|
||||
<Nav> <span slot="olympian" class="text-blue-300">O L Y M P I A N</span></Nav>
|
||||
|
||||
<section class=" bg-gray-800 h-screen mt-40">
|
||||
<div class="py-8 lg:py-16 px-4 mx-auto max-w-screen-md">
|
||||
<h2 class="mb-4 text-4xl tracking-tight font-extrabold text-center text-white">Form Successfully Submitted</h2>
|
||||
<p class="mb-8 lg:mb-16 font-light text-center text-gray-400 sm:text-xl">We will get back to you very soon 😏</p>
|
||||
|
||||
|
||||
<div class="flex flex-row justify-center space-x-20">
|
||||
<OutlineButton link="/" text="Go Back Home" />
|
||||
<OutlineButton link="/contact" text="Go Back to Contact" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Footer -->
|
||||
<Footer></Footer>
|
||||
</Layout>
|
|
@ -6,6 +6,7 @@ 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';
|
||||
//Image imports
|
||||
import Ram from '/src/images/people/ram.png';
|
||||
import Anish from '/src/images/people/anish.jpg';
|
||||
|
@ -22,34 +23,76 @@ import Anish from '/src/images/people/anish.jpg';
|
|||
<h1 class="text-blue-300 text-center my-10 font-bold text-3xl font-mono">Meet our team</h1>
|
||||
|
||||
|
||||
<!-- Grid of people -->
|
||||
<div class=" flex flex-col">
|
||||
<!-- Row 1 -->
|
||||
<div class="mx-20 flex flex-row space-x-20">
|
||||
<PersonCard title="Ram Vempati" image={Ram}>
|
||||
|
||||
<!-- Category buttons -->
|
||||
<div class="flex flex-row justify-center mb-20 space-x-14">
|
||||
<!-- Leads -->
|
||||
<button id="lead" class="border-blue-400 text-blue-500 text-lg font-bold font-mono px-2 py-2 border-2 rounded-lg" > 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" > Engineering</button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="grid-cols-3 flex justify-center space-x-10 gap-y-10">
|
||||
<!-- Engineering category -->
|
||||
<div class=" hidden" id="engineeringDiv">
|
||||
|
||||
<PersonCard title="Ram Vempati" id="" image={Ram}>
|
||||
Hello my name is ram and I am from tech support.
|
||||
<div slot="tags">
|
||||
<Tag>Potentia Lead</Tag>
|
||||
<Tag>Lead</Tag>
|
||||
<Tag>Engineering</Tag>
|
||||
<Tag>Gait Generation</Tag>
|
||||
</div>
|
||||
</PersonCard>
|
||||
<PersonCard title="Anish Suvurna" image={Anish}>
|
||||
Hello my name is anish and I trap kids in my basmeent.
|
||||
|
||||
</div>
|
||||
<!-- Engineering category -->
|
||||
<div class=" hidden" id="leadDiv">
|
||||
|
||||
<PersonCard title="Anish suvurna" id="" image={Anish}>
|
||||
Hello this is anish and i trap kids in my basement
|
||||
<div slot="tags">
|
||||
<Tag>Engineering</Tag>
|
||||
<Tag>Computer Vision</Tag>
|
||||
<Tag>Creepy</Tag>
|
||||
<Tag>Basement</Tag>
|
||||
<Tag>CV</Tag>
|
||||
<Tag>Programming</Tag>
|
||||
<Tag>Lead</Tag>
|
||||
</div>
|
||||
</PersonCard>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- Footer -->
|
||||
<Footer></Footer>
|
||||
</Layout>
|
||||
</Layout>
|
||||
|
||||
|
||||
<!-- Script -->
|
||||
|
||||
<!-- Show engineering div when the engineerng button is clicked -->
|
||||
<script>
|
||||
// Engineering divs
|
||||
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");
|
||||
});
|
||||
|
||||
|
||||
// Make buttons red on click
|
||||
var buttons = document.getElementsByClassName("border-blue-400");
|
||||
for (var i = 0; i < buttons.length; i++) {
|
||||
buttons[i].addEventListener("click", function() {
|
||||
this.classList.toggle("border-red-400");
|
||||
this.classList.toggle("text-red-400");
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
|
Loading…
Reference in New Issue
Block a user