Skip to content

personal-website-ED #16

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.

Sign up for GitHub

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 5 commits into
base: main
Choose a base branch
from
Open

personal-website-ED #16

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
f562687
Eduardo-Perez
Eduardoapv2 Jul 27, 2025
b8c6c07
format-prettier
Eduardoapv2 Jul 27, 2025
de9d901
more-commits
Eduardoapv2 Jul 27, 2025
41371fc
save-commit
Eduardoapv2 Aug 6, 2025
161cb97
Merge pull request #1 from Eduardoapv2/Eduardo-Perez
Eduardoapv2 Aug 6, 2025
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
5 changes: 3 additions & 2 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
# Personal Website

If you have any notes, questions, or other general comments for us to read, please put
i believe i'm done!
wait i have to make multiple commits.......
(If you have any notes, questions, or other general comments for us to read, please put
them in this README! Good luck and have fun :)
132 changes: 132 additions & 0 deletions about.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,132 @@
header {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
background-color: #f5f5f5;
padding: 20px;
color: rgb(255, 255, 255);
width: 70%;
margin-left: 15%;
border-bottom: #a5a5a5 solid 1px;

.brand {
font-family: inherit;
color: #a5a5a5;
text-align: center;
background-color: #f5f5f5;
font-weight: bold;
justify-content: left;
text-align: left;
font-size: 30px;
}
nav {
display: flex;
gap: 2ch;
justify-content: right;
font-family: inherit;
color: #000000;
text-align: right;
background-color: #f5f5f5;
}
nav a {
text-decoration: none;
color: #000000;
font-weight: bold;
font-size: 20px;
}
}
@media (max-width: 430px) {
header {
margin-left: 0%;
}
}
body {
display: flex;
flex-direction: column;
margin-left: 10%;
margin-right: 10%;
background-color: #f5f5f5;
}
* {
font-family: inherit;
box-sizing: border-box;
}
.quote {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
color: #3361c4;
height: auto;
width: 100%;
h2 {
color: #f5f5f5;
background-color: #3361c4;
font-family: inherit;
padding: 20px;
}
}
@media (max-width: 600px) {
body {
font-size: 70%;
}
}
button {
display: flex;
font-family: inherit;
background-color: #3361c4;
border: none;
color: white;
padding-block: 15px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: medium;
margin-block: 20px;
cursor: pointer;
border-radius: 5px;
align-content: center;
align-items: center;
width: 100%;
}
.button:hover {
background-color: #5e7fc5;
color: #dadada;
cursor: pointer;
}
img {
display: flex;
justify-content: flex-end;
width: 50%;
height: 40%;
}
h3 {
color: #000000;
background-color: #ffbf10;
font-family: inherit;
padding: 20px;
}

section {
display: flex;
flex-direction: row;
gap: 2rem;
align-items: center;
justify-content: center;
background-color: #f5f5f5;
padding: 20px;
margin-bottom: 15px;
border-bottom: #a5a5a5 solid 1px;
gap: 2%;
background-clip: border-box;
background-color: white;
}
@media (max-width: 1000px) {
section {
flex-direction: column;
}
}
ul {
background-color: white;
}
73 changes: 73 additions & 0 deletions about.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
<!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="about.css" />
</head>
<body>
<header>
<p class="brand">William Henry Gates</p>
<nav id="Links">
<a href="home.html">Home</a>
<a class="active" href="#">About me</a>
<a href="portfolio.html">Portfolio</a>
</nav>
</header>

<main>
<div class="quote">
<h2>
I insist call me Bill, Having a wide range of interests make it
difficult to choose, but i invest my time mostly in this:
</h2>
</div>
<div id="project-container">

<section class="projects">
<h3>philanthropy & Global Development</h3>

<img src="https://www.scholarshipregion.com/wp-content/uploads/2023/05/Bill-Melinda-Gates-Foundation-Global-Grand-Challenge-1068x601.jpg" alt="philan-photo"/>
<ul>
<li>Climate Change:I've invested in clean energy and wrote How to Avoid
a Climate Disaster to share solutions.</li>
<li>The Gates Foundation: Focuses on global health, education, gender
equality, and poverty reduction. i am planning to donate nearly all
my wealth to it by 2045.</li></ul>

</section>

<section class="projects">
<h3>Technology & Innovation</h3>

<img src="https://cdn.britannica.com/71/103171-050-D6D9D227/Bill-Gates-Microsoft-Corporation-operating-system-press-2001.jpg" alt="gate-micro-photo"/>
<ul>
<li>Tech Advocacy: Though no longer active at Microsoft, i still engage
with product teams and invests in tech startups.</li>
<li>AI & Energy Innovation: I'm deeply interested in how emerging
technologies can solve global problems.</li></ul>

</section>

<section class="projects">
<h3>Intellectual</h3>

<img src="https://api.time.com/wp-content/uploads/2019/05/billgates_bestsummerbooks.jpeg?quality=85&w=1440" alt="smart-guy-ik"/>
<ul>
<li>Travel: I've traveled extensively to understand global challenges
firsthand.</li>
<li>Board Games: I enjoy Settlers of Catan and Bridge, often playing
with Warren Buffett.</li>
<li>Reading: Usually i am done with a book a week, spanning science,
history, biographies, and fiction.</li></ul>

</section>

</div>
</main>

<footer><a target="_blank" href="contactme.html" ><button class="button" >Contact me</button></footer>

</body>
</html>
128 changes: 128 additions & 0 deletions contactme.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
button {
display: flex;
font-family: inherit;
background-color: #3361c4;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: medium;
margin: 15px 2px;
cursor: pointer;
border-radius: 5px;
align-content: center;
align-items: center;
width: 200px;
}
.button:hover {
background-color: #5e7fc5;
color: #dadada;
cursor: pointer;
}
* {
background-color: #f5f5f5;
font-family: inherit;
box-sizing: border-box;
}

.quote {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
color: #3361c4;
height: auto;
width: 100%;
h2 {
color: #f5f5f5;
background-color: #3361c4;
font-family: inherit;
padding: 20px;
}
}

.phone-number {
font-family: inherit;
color: #3361c4;
text-align: center;
padding-top: 20px;
}
body {
display: flex;
flex-direction: column;
margin-left: 0%;
margin-right: 0%;
}
label {
font-weight: bold;
}
.form-box {
gap: 10px;
display: flex;
flex-direction: column;
background-color: #f5f5f5;
padding: 20px;
margin-bottom: 15px;
width: 70%;
input,
textarea {
padding: 0.5em;
border: 1px solid #ccc;
border-radius: 4px;
font-size: 1em;
}
}
section {
display: flex;
flex-direction: column;
align-items: center;
}
header {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
background-color: #f5f5f5;
padding: 20px;
color: rgb(255, 255, 255);
width: 70%;
margin-left: 15%;
border-bottom: #a5a5a5 solid 1px;

.brand {
font-family: inherit;
color: #a5a5a5;
text-align: center;
background-color: #f5f5f5;
font-weight: bold;
justify-content: left;
text-align: left;
font-size: 30px;
}
nav {
display: flex;
gap: 2ch;
justify-content: right;
font-family: inherit;
color: #000000;
text-align: right;
background-color: #f5f5f5;
}
nav a {
text-decoration: none;
color: #000000;
font-weight: bold;
font-size: 20px;
}
}

@media (max-width: 600px) {
body {
font-size: 70%;
}
.form-box {
padding: 10px;
}
}
Loading