Skip to content

Commit

Permalink
bootstrap updates testing phase
Browse files Browse the repository at this point in the history
  • Loading branch information
griffinnewbold committed Jan 31, 2024
1 parent 1a44216 commit de49efb
Show file tree
Hide file tree
Showing 6 changed files with 855 additions and 27 deletions.
91 changes: 88 additions & 3 deletions bootstrap_pages/bootstrap-styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -44,15 +44,32 @@
width: 50%;
}

.profile-container {
margin-top: 4%;
margin-left: 1%;
.page-content {
margin-top: 1%;
}

@media only screen and (max-width: 1026px) {
.profile-container {
display: none;
}

.nav-item {
font-size: 3vw;
color: black;
text-decoration: none;
position: relative;
font-weight: bold;
text-align: center;
justify-content: center;
}

.page-content {
margin-top: 5%;
}

.proj_img {
display: none;
}
}

.profile-picture {
Expand All @@ -77,4 +94,72 @@

.footer {
background-color: #99ccff;
padding-left: 15px;
padding-right: 15px;
padding-top: 15px;
padding-bottom: 2px;
position: absolute;
bottom: -100px;
}

.content {
display: none;
}

.active {
display: block;
}

.prev-next-buttons {
display: flex;
justify-content: flex-start;
align-items: center;
margin-top: 20px;
margin-bottom: 20px;
}

.prev-next-buttons button {
background-color: transparent;
border: 2px solid #9c9c9c;
padding: 10px 20px;
font-size: 25px;
color: gray;
transition: color 0.3s;
cursor: pointer;
width: 35vw;
height: 7vh;
}

.prev-next-buttons button:hover {
color: #99ccff;
}

button.previous-btn {
border-top-left-radius: 7px;
border-bottom-left-radius: 7px;
}

button.next-btn {
border-top-right-radius: 7px;
border-bottom-right-radius: 7px;
}

a {
text-decoration: none;
color: #141414;
}

a:hover,
a:focus,
a:active {
color: #000;
}

.proj_img {
border: 2px solid black;
}

.footer-text {
font-size: 1.0vw;
margin-left: 10px;
}
84 changes: 84 additions & 0 deletions bootstrap_pages/contact.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="bootstrap-styles.css">
<title>Griffin's Homepage [BOOTSTRAP]</title>
</head>
<body>
<div class="container-fluid">
<div class="navigation row justify-content-center">
<div class="col-4 col-sm-6 col-md-1">
<a class="nav-item" href="/">Home</a>
</div>
<div class="col-4 col-sm-6 col-md-1">
<a class="nav-item" href="/projects.html">Projects</a>
</div>
<div class="col-4 col-sm-6 col-md-1">
<a class="nav-item" href="/teaching.html">Teaching</a>
</div>
<div class="col-4 col-sm-6 col-md-1">
<a class="nav-item" href="/courses.html">Courses</a>
</div>
<div class="col-4 col-sm-6 col-md-1">
<a class="nav-item" href="/contact.html">Contact</a>
</div>
<div class="col-4 col-sm-6 col-md-1">
<a class="nav-item" href="/resources/griffinnewbold_resume.pdf">Resume</a>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row page-content">
<div class="col-md-2 profile-container">
<img src="../resources/profile-picture.jpg" alt="Profile Picture" class="profile-picture img-fluid">
<p class="profile-text-header">Griffin Newbold</p>
<p class="profile-text">Third Year Undergraduate at Columbia University <br><br>
Teaching Assistant for Professor Adam Cannon <br><br>
Projects Student for Professor Gail Kaiser<br><br>
Incoming Software Engineering Intern @ Capital One <br><br>
Located in New York, New York
</p>
</div>
<div class="col-md-10">
<p class = "section-text">
If you reached this page then you are probably curious on how to contact me! Well there are different
preferred ways depending on who you are so please find the section header below that best describes you
</p>
<h2>Columbia Affiliates</h2>
<p class = "section-text">
In order to best get into contact with me, please use my .edu address so I may see your message as soon as possible.
Send an email to [email protected] and please state your business briefly in the subject line and then write the rest
of your message as you probably normally would. During the academic year I will most likely respond within a day or two, if this
has not happened feel free to send a follow up! If we are outside the academic year then it could take at most 7 business days.
</p>
<h2>Recruiters/Workplace Officials</h2>
<p class = "section-text">
Greetings to any recruiters or other workplace officials who happened to stumble upon my page. If you have not already reached out to
me then please use my <a href="https://www.linkedin.com/in/griffinnewbold">LinkedIn</a> for any communications, there you can send me a message and/or connect with me. I will respond to your message as soon as I am able to.
</p>
<h2>Other University Affiliates</h2>
<p class = "section-text">
If you happen to be an affilate of another accredited university, student or otherwise, please first send me a connection request on linkedin
and then follow that up with an email to my .edu account as described under the "Columbia Affiliates" section above, depending on whether not
I have previously interacted with you will most likely dictate response times, I will try to respond in the same time period as described above.
</p>
<h2>Anyone Else</h2>
<p class = "section-text">
If you do not fall into the previously mentioned categories then please reconsider sending me a message, if we have a previously established personal
connection then chances are you already are in possession of a way to contact me, I suggest you use that method. For all others, please refrain from
contacting me unless it is an emergency, in which case please reach out via LinkedIn.
</p>
</div>
</div>
</div>
<div class="container-fluid footer">
<p class = "footer-text">&copy; 2024 Griffin Newbold Powered by GitHub</p>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>
</html>
Loading

0 comments on commit de49efb

Please sign in to comment.