Skip to content

Alvaro Carvajal Personal Website #4

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added Boq-and-I.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
94 changes: 94 additions & 0 deletions about.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>About Me</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<nav>
<header>
<script src="index.js"></script>
</header>
<div>
<a class="links" href="home.html">Home</a>
<a class="links" href="about.html">About Me</a>
<a class="links" href="portfolio.html">Portfolio</a>
</div>
</nav>
<main class="mainAbout">
<article class="aboutArticle">
<section>
<h1 class="abt">Hobbies</h1>
<img
class="pic"
src="https://hotel-kaya.com/assets/uploads/2022/06/regles-ski-alpin.jpg"
alt="Skiing"
/>
<p class="pabt">
Popular team sports include soccer, basketball, baseball, football,
hockey, and volleyball. Individual sports such as tennis, golf,
boxing, gymnastics, swimming, and track and field offer athletes the
chance to compete on their own. There are also extreme and adventure
sports like skateboarding, snowboarding, surfing, rock climbing, and
mountain biking. Combat sports such as martial arts, wrestling,
judo, and kick boxing test strength and technique, while racing sports
like Formula 1, cycling, and horse racing emphasize speed and
endurance. Other unique or recreational sports include table tennis,
badminton, cricket, squash, and archery.
</p>
</section>
<section>
<h1 class="abt">Entertainment</h1>
<img
class="pic"
src="https://static.vecteezy.com/system/resources/thumbnails/044/514/545/small_2x/background-a-movie-theater-where-love-stories-are-unfolding-on-the-big-screen-and-the-smell-of-popcorn-fills-the-air-photo.jpg"
alt="Movie Theater"
/>
<p class="pabt">
Watching movies or TV at home or in theaters, listening to music or
podcasts, and playing video games on various platforms. Attending
concerts, music festivals, or sporting events provides exciting
social experiences, while reading books, magazines, or graphic
novels offers a quieter form of entertainment. Dancing, whether at
clubs or in formal settings, remains a popular pastime. Amusement
parks, fairs, escape rooms, arcades, and laser tag offer active fun,
while karaoke nights and open mic events encourage audience
participation. Other hobbies include painting and crafting.
</p>
</section>
<section>
<h1 class="abt">Work</h1>
<img
class="pic"
src="https://img.freepik.com/free-vector/hand-drawn-family-drawing-illustration_23-2150415202.jpg"
alt="Family"
/>
<p class="pabt">
In my family, love is the foundation of everything we do. We support
each other through every high and low, always knowing that no matter what
happens, we have one another to lean on. We show our care not just through
words, but through the little things—sharing meals, checking in after a long day,
and making time to simply be together. There's a deep sense of trust between
us, and even when we disagree or face challenges, we always come back to love,
forgiveness, and understanding. My family is my safe place, where I feel
completely accepted for who I am. Knowing that I am unconditionally loved gives
me the strength and confidence to face whatever life brings.
</p>
</div>
</section>
</main>
<footer>
<nav>
<a class="contact" href="contact.html">Contact</a>
</nav>
<a
id="logo"
href="https://www.linkedin.com/in/alvaro-carvajal-484644181/"
target="_blank"
><img class="logo" src="linkedin.png" alt="LinkedIn"
/></a>
</footer>
</body>
</html>
55 changes: 55 additions & 0 deletions contact.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Contact Us</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<nav>
<header>
<script src="index.js"></script>
</header>
<div>
<a class="links" href="home.html">Home</a>
<a class="links" href="about.html">About Me</a>
<a class="links" href="portfolio.html">Portfolio</a>
</div>
</nav>
<main>
<aside id="contact">
<section id="inquiries">
<p>Fill the following information for inquiries</p>
<p><input type="text" name="email" id="email" />Full Name</p>
<p><input type="text" name="email" id="email" />e-mail</p>
<p><input type="button" value="Submit" /></p>
</section>
<section>
<p class="pHome">email: [email protected]</p>
<p class="pHome">phone number: (xxx) xxx-xxxx</p>
</section>
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d142517.2869754251!2d-122.38563175071172!3d47.62084868406864!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x5490102c93e83355%3A0x102565466944d59a!2sSeattle%2C%20WA!5e0!3m2!1sen!2sus!4v1753329720749!5m2!1sen!2sus"
width="400"
height="300"
style="border: 0"
allowfullscreen=""
loading="lazy"
referrerpolicy="no-referrer-when-downgrade"
></iframe>
</aside>
</main>
<footer>
<nav>
<a class="contact" href="contact.html">Contact</a>
</nav>
<a
id="logo"
href="https://www.linkedin.com/in/alvaro-carvajal-484644181/"
target="_blank"
><img class="logo" src="linkedin.png" alt="LinkedIn"
/></a>
</footer>
</body>
</html>
47 changes: 47 additions & 0 deletions home.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Personal Website</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<nav>
<header>
<script src="index.js"></script>
</header>
<div>
<a class="links" href="home.html">Home</a>
<a class="links" href="about.html">About Me</a>
<a class="links" href="portfolio.html">Portfolio</a>
</div>
</nav>
<main id="mainHome">
<h1 class="left top">Coding student</h1>
<aside class="left bottom">
Random text for the website alone. Random text for the website alone.
Random text for the website alone. Random text for the website alone.
Random text for the website alone
</aside>
<img id="picture" src="Boq-and-I.jpg" alt="Boq and I" />
<h2 class="right top">Soon to be pro coder</h2>
<aside class="right bottom">
More random text for coders. More random text for coders. More random
text for coders. More random text for coders. More random text for
coders. More random text for coders.
</aside>
</main>
<footer>
<nav>
<a class="contact" href="contact.html">Contact</a>
</nav>
<a
id="logo"
href="https://www.linkedin.com/in/alvaro-carvajal-484644181/"
target="_blank"
><img class="logo" src="linkedin.png" alt="LinkedIn"
/></a>
</footer>
</body>
</html>
18 changes: 18 additions & 0 deletions index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
const firstName = "Alvaro ";
const lastName = "Carvajal";

console.log(firstName, lastName);
document.write(firstName, lastName);

// const abt1 = document.getElementById("abt1");
// console.log(abt1);
// abt1.textContent = firstName + lastName;
// abt1.textContent += firstName + lastName;

// const element = document.createElement("h1");
// element.textContent = "Java Trial";
// const main = document.getElementsByClassName("mainAbout")[0];
// console.log(main);
// const abtdiv = document.getElementsByClassName("abtdiv")[1];
// console.log(abtdiv);
// main.append(element);
Binary file added linkedin.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
61 changes: 61 additions & 0 deletions portfolio.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Portfolio</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<nav>
<header>
<script src="index.js"></script>
</header>
<div>
<a class="links" href="home.html">Home</a>
<a class="links" href="about.html">About Me</a>
<a class="links" href="portfolio.html">Portfolio</a>
</div>
</nav>
<main id="mainPortfolio">
<figure>
<h2>CSS Web Development</h2>
<a
id="projects"
href="https://github.com/Acarvajalrol/zoo"
target="_blank"
>ZOO</a
>
</figure>
<figure>
<h2>CSS Web Development</h2>
<a
id="projects"
href="https://github.com/Acarvajalrol/fullstack-bakery"
target="_blank"
>FULLSTACK BAKERY</a
>
</figure>
<figure>
<h2>CSS Web Development</h2>
<a
id="projects"
href="https://github.com/Acarvajalrol/furniture-emporium"
target="_blank"
>FURNITURE EMPORIUM</a
>
</figure>
</main>
<footer>
<nav>
<a class="contact" href="contact.html">Contact</a>
</nav>
<a
id="logo"
href="https://www.linkedin.com/in/alvaro-carvajal-484644181/"
target="_blank"
><img class="logo" src="linkedin.png" alt="LinkedIn"
/></a>
</footer>
</body>
</html>
Loading