about page

This commit is contained in:
Tristan Smith 2024-09-23 00:58:29 -04:00
parent 56132f8380
commit ab3a35bcbf
2 changed files with 16 additions and 3 deletions

View file

@ -59,7 +59,7 @@
<section class="contact"> <section class="contact">
<div class="container"> <div class="container">
<h2>Contact Us</h2> <h2>Contact Us</h2>
<p>Have questions or special requests? Reach out to me!</p> <p>Have questions or special requests? Reach out to me !</p>
<p>Email: <a href="mailto:bethany@willowmecreations.com">bethany@willowmecreations.com</a><br> <p>Email: <a href="mailto:bethany@willowmecreations.com">bethany@willowmecreations.com</a><br>
TikTok: <a href="https://www.tiktok.com/@bethanyrhodes6" target="_blank"><i class="fab fa-tiktok"></i>bethanyrhodes6</a></p> TikTok: <a href="https://www.tiktok.com/@bethanyrhodes6" target="_blank"><i class="fab fa-tiktok"></i>bethanyrhodes6</a></p>
</div> </div>

View file

@ -52,7 +52,7 @@ h1, h2, h3 {
height: auto; height: auto;
margin-bottom: 20px; margin-bottom: 20px;
border: 2px solid var(--box-bg-color); border: 2px solid var(--box-bg-color);
box-shadow: 0 0 35 px var(--background-color); box-shadow: 0 0 35px var(--background-color);
} }
/* Navigation */ /* Navigation */
@ -253,11 +253,24 @@ a:nth-child(5) {
flex: 3; /* Text container takes 3/4 of the space */ flex: 3; /* Text container takes 3/4 of the space */
} }
.about {
display: flex;
flex-direction: row;
align-items: flex-start; /* Aligns the text and image by the top of the container */
justify-content: space-between;
gap: 40px;
max-width: 1200px;
margin: 0 auto;
}
.creator { .creator {
flex: 1; /* Image container takes 1/4 of the space */ flex: 1; /* Image container takes 1/4 of the space */
max-width: 300px; max-width: 300px;
height: auto; height: auto;
border-radius: 50%; border-radius: 50%;
box-shadow: 0 0 35px var(--header-bg-color);
align-self: flex-start;
margin-top: 30px;
} }
.about p { .about p {
@ -360,7 +373,7 @@ a:nth-child(5) {
} }
.footer .social-media a { .footer .social-media a {
color: var(--footer-text-color); color: var(--footer-text-color);
margin: 0 10px; margin: 0 10px;
font-size: 1.5em; font-size: 1.5em;
text-decoration: none; text-decoration: none;