Skip to content

Commit

Permalink
Updates
Browse files Browse the repository at this point in the history
  • Loading branch information
O662 committed Jan 7, 2025
1 parent 52440ee commit a84376d
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 185 deletions.
5 changes: 3 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
</head>

<body>
<div id="navbar"></div> <!--acts as a placeholder in the code where the navbar content will be inserted.-->
<div id="navbar" class="navbar"></div> <!-- Add the class "navbar" -->
<script>
fetch('navbar.html?cache-bust=' + new Date().getTime())
.then(response => response.text())
Expand Down Expand Up @@ -66,7 +66,8 @@
<div class="hero-text">
<h1 class="hero-subtitle">Welcome!</h1>
<h1 class="hero-title">My name is Malcolm Ferguson.</h1>
<p class="hero-description">I am an undergraduate at Texas A&M University, where I am studying and researching robotics. Feel free to look around and see what I'm up to!</p>
<p class="hero-description">I am an undergraduate at Texas A&M University, where I am studying and
researching robotics. Feel free to look around and see what I'm up to!</p>
</div>
</div>

Expand Down
2 changes: 1 addition & 1 deletion stylesMobileNavBar.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
display: flex;
justify-content: space-between;
align-items: center; /* Center items vertically */
background-color: #333;
background-color: #bd2b2b;
padding: 10px 20px;
box-sizing: border-box;
}
Expand Down
187 changes: 5 additions & 182 deletions stylesNavBar.css
Original file line number Diff line number Diff line change
@@ -1,22 +1,19 @@
.navbar {
position: absolute;
position: fixed;
top: 0;
left: 0;
width: 100%;
background-color: #333;
background-color: black; /* Set the background color to black */
padding: 10px 0;
z-index: 1000;
/* Ensures it stays on top */
z-index: 1000; /* Ensures it stays on top */
display: flex;
align-items: center;
justify-content: space-between;

}

.navbar-logo {
margin-left: 20px;
height: 40px;
/* Adjust the height as needed */
height: 40px; /* Adjust the height as needed */
}

.navbar ul {
Expand All @@ -31,63 +28,22 @@

.navbar li {
display: inline;
position: relative;
/* Needed for dropdown positioning */
position: relative; /* Needed for dropdown positioning */
}

.navbar a {
float: left;
color: white;
text-decoration: none;
padding: 10px 20px;
display: block;

font-size: 16px;
text-align: center;
text-decoration: none;
}

.navbar a:hover {
background-color: #575757;
}

.navbar ul li {
position: relative;
}

.navbar ul li .dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
z-index: 1;
top: 100%;
/* Ensure the dropdown appears below the parent */
left: 0;
}

.navbar ul li .dropdown-content li {
float: none;
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}

.navbar ul li .dropdown-content li a {
color: black;
}

.navbar ul li .dropdown-content li:hover {
background-color: #f1f1f1;
}

.navbar ul li:hover .dropdown-content {
display: block;
}

/* The subnavigation menu */
.subnav {
float: left;
Expand All @@ -104,137 +60,4 @@
background-color: inherit;
font-family: inherit;
margin: 0;
}

/*
/* Add a red background color to navigation links on hover
.navbar a:hover,
.subnav:hover .subnavbtn {
background-color: red;
}
*/


/* Style the subnav content - positioned absolute */
.subnav-content {
display: none;
position: absolute;
left: 0;
background-color: rgb(62, 62, 62);
width: 100%;
z-index: 1;
}

/* Style the subnav links */
.subnav-content a {
float: right;
/* color: white; */
text-decoration: none;
}

/* Add a grey background color on hover
.subnav-content a:hover {
background-color: #eee;
color: black;
}
/* When you move the mouse over the subnav container, open the subnav content */
.subnav:hover .subnav-content {
display: block;
}

/* The Mega Menu (Projects) */

/* The dropdown container */
.dropdown {
float: left;
overflow: hidden;
}

/* Dropdown button */
.dropdown .dropbtn {
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: inherit;
font: inherit; /* Important for vertical align on mobile phones */
margin: 0; /* Important for vertical align on mobile phones */
}



/* Dropdown content (hidden by default) */
.dropdown-content {
display: none;
position: absolute;
background-color: #000000;
width: 100%;
left: 0;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}

/* Mega Menu header, if needed */
.dropdown-content .header {
background: rgb(51, 51, 51);
padding: 16px;
color: rgb(0, 0, 0);
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}

/* Create three equal columns that floats next to each other */
.column {
float: left;
width: 33.33%;
padding: 10px;
background-color: #353535;
height: 250px;
}

/* Style links inside the columns */
.column a {
float: none;
color: rgb(255, 255, 255);
padding: 16px;
text-decoration: none;
display: block;
text-align: left;
}

/* Add a background color on hover */
.column a:hover {
background-color: #000000;
}

/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}



@media (max-width: 768px) {
.navbar {
flex-direction: column;
align-items: flex-start;
}

.navbar ul {
justify-content: flex-start;
width: 100%;
}

.navbar-logo {
margin-left: 10px;
height: 30px;
/* Adjust the height as needed */
}
}

0 comments on commit a84376d

Please sign in to comment.