ghndrx/docker-test-image
1
0
Fork 0
mirror of https://github.com/ghndrx/docker-test-image.git synced 2026-02-10 06:45:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

update content

Browse Source
This commit is contained in:
Gregory Hendrickson
2023-06-09 17:30:32 -07:00
parent f1d4721251
commit c9e6a6e235
3 changed files with 43 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
static-html-directory/about.html
View File

@@ -10,8 +10,7 @@
<header>
<div class="container">
<h1>My Profile</h1>
<div id="menu-toggle"></div>
<nav id="main-nav">
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
@@ -28,26 +27,7 @@
<p>
Hello! My name is Gregory, and I have a passion for coffee, dogs, sports cars, computer servers, and automation.
</p>
<h3>Coffee Enthusiast</h3>
<p>
Coffee has always been an integral part of my daily routine. There's something magical about the aroma and taste of a freshly brewed cup of coffee that fuels my creativity and productivity.
</p>
<h3>Dog Lover</h3>
<p>
I'm a proud dog parent and believe that dogs bring immense joy and companionship into our lives. My furry friend Riker is not just a pet but a beloved member of my family.
</p>
<h3>Sports Car Enthusiast</h3>
<p>
I have a deep admiration for sports cars. The sleek design, powerful engines, and precision engineering fascinate me. I enjoy keeping up with the latest trends and advancements in the automotive world.
</p>
<h3>Computer Servers and Automation</h3>
<p>
As a graduate of Dakota State University with a B.S. in Network Security & Administration, I developed a strong interest in computer servers and automation. I'm fascinated by the complexities of server infrastructure and passionate about leveraging automation to streamline processes and enhance efficiency.
</p>
<h3>Educational Background</h3>
<p>
I graduated from Dakota State University in 2018 with a B.S. in Network Security & Administration. During my time at the university, I gained valuable knowledge and skills in network security, administration, and other relevant areas of study.
</p>
<!-- Rest of the About Me content -->
</section>
</main>

9
static-html-directory/contact.html
View File

@@ -10,8 +10,7 @@
<header>
<div class="container">
<h1>My Profile</h1>
<div id="menu-toggle"></div>
<nav id="main-nav">
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
@@ -26,11 +25,7 @@
<section id="contact">
<h2>Contact Me</h2>
<p>If you have any inquiries or would like to connect, feel free to reach out to me:</p>
<ul>
<li><strong>Email:</strong> <a href="mailto:greg@hndrx.co">greg@hndrx.co</a></li>
<li><strong>LinkedIn:</strong> <a href="https://www.linkedin.com/in/grhendrickson/">LinkedIn Profile</a></li>
<li><strong>GitHub:</strong> <a href="https://github.com/ghndrx/">GitHub Profile</a></li>
</ul>
<!-- Contact details -->
</section>
</main>

62
static-html-directory/styles.css
View File

@@ -38,57 +38,73 @@ body {
}
.dark-grey-purple header {
position: fixed;
top: 0;
left: 0;
width: 100%;
background-color: #191919;
padding: 10px;
z-index: 999;
}
.dark-grey-purple header .container {
display: flex;
justify-content: space-between;
align-items: center;
}
.dark-grey-purple #menu-toggle {
width: 30px;
height: 20px;
background-color: #ffffff;
border-radius: 4px;
cursor: pointer;
}
.dark-grey-purple #main-nav {
display: none;
}
.dark-grey-purple #main-nav ul {
.dark-grey-purple header nav ul {
display: flex;
}
.dark-grey-purple #main-nav li {
.dark-grey-purple header nav li {
margin-left: 10px;
}
.dark-grey-purple main {
padding-top: 80px;
}
/* Hide the menu bar when scrolling down */
.dark-grey-purple header.hidden {
transform: translateY(-100%);
}
/* Media Queries */
@media screen and (max-width: 768px) {
.dark-grey-purple header {
.dark-grey-purple header .container {
flex-direction: column;
align-items: flex-start;
}
.dark-grey-purple #main-nav {
.dark-grey-purple header nav {
display: none;
}
.dark-grey-purple #menu-toggle {
.dark-grey-purple header #menu-toggle {
display: block;
width: 30px;
height: 20px;
background-color: #ffffff;
border-radius: 4px;
cursor: pointer;
}
.dark-grey-purple header #main-nav {
display: none;
padding-left: 20px;
padding-bottom: 10px;
}
.dark-grey-purple header #main-nav.active {
display: block;
}
.dark-grey-purple #menu-toggle.active ~ #main-nav {
display: block;
}
.dark-grey-purple #main-nav ul {
.dark-grey-purple header #main-nav ul {
flex-direction: column;
}
.dark-grey-purple #main-nav li {
.dark-grey-purple header #main-nav li {
margin-left: 0;
margin-bottom: 10px;
}