changes to reviews + added indication to top of nav of active page

This commit is contained in:
2026-01-09 20:35:32 -05:00
parent 60d3f1828d
commit 9be65f427c
3 changed files with 13 additions and 13 deletions
+1 -1
View File
@@ -135,7 +135,7 @@
</button> </button>
<nav> <nav>
<a class="navLink" role="navigation" href="ceramic-coating.html">Ceramic Coating</a> <a class="navLink" role="navigation" href="ceramic-coating.html"style="color: white">Ceramic Coating</a>
<a class="navLink" role="navigation" href="services.html">Services</a> <a class="navLink" role="navigation" href="services.html">Services</a>
<a class="navLink" role="navigation" href="reviews.html">Reviews</a> <a class="navLink" role="navigation" href="reviews.html">Reviews</a>
<a class="navLink" role="navigation" href="contact.html">About</a> <a class="navLink" role="navigation" href="contact.html">About</a>
+4 -8
View File
@@ -23,7 +23,7 @@
/** REVIEWS */ /** REVIEWS */
#reviews { #reviews {
margin-top: 7vh; margin-top: 7rem;
} }
#reviewContainer { #reviewContainer {
@@ -47,15 +47,11 @@
padding: 3rem; padding: 3rem;
border: 2px solid var(--gold); border: 2px solid var(--gold);
border-radius: 1rem; border-radius: 1rem;
box-shadow: 3px 3px 0px var(--gold);
transition: 0.3s ease;
color: white; color: white;
} }
.review-card:hover {
box-shadow: 0px 0px 10px 1px var(--gold);
}
.review-card-head { .review-card-head {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@@ -66,6 +62,7 @@
} }
.review-card-head a { .review-card-head a {
color: var(--gold); color: var(--gold);
transition: 0.2s ease;
} }
.review-card-head a:hover { .review-card-head a:hover {
color: white; color: white;
@@ -189,7 +186,7 @@
<nav> <nav>
<a class="navLink" role="navigation" href="ceramic-coating.html">Ceramic Coating</a> <a class="navLink" role="navigation" href="ceramic-coating.html">Ceramic Coating</a>
<a class="navLink" role="navigation" href="services.html">Services</a> <a class="navLink" role="navigation" href="services.html">Services</a>
<a class="navLink" role="navigation" href="reviews.html">Reviews</a> <a class="navLink" role="navigation" href="reviews.html"style="color: white" >Reviews</a>
<a class="navLink" role="navigation" href="contact.html">About</a> <a class="navLink" role="navigation" href="contact.html">About</a>
</nav> </nav>
</div> </div>
@@ -197,7 +194,6 @@
<main id="main-content"> <main id="main-content">
<section id="reviews"> <section id="reviews">
<h1>Reviews</h1>
<div id="reviewContainer"></div> <div id="reviewContainer"></div>
</section> </section>
+8 -4
View File
@@ -33,17 +33,17 @@
} }
.jumpLink { .jumpLink {
padding: 1rem;
display: flex; display: flex;
align-items: center;; align-items: center;;
height: 8rem; height: 8rem;
padding: 0 2rem; padding: 0 5rem;
text-decoration: none; text-decoration: none;
color: var(--gold); color: var(--black);
background-color: var(--gold);
border: 1px solid var(--gold);
border-radius: 1rem; border-radius: 1rem;
transition: 0.3s ease; transition: 0.3s ease;
@@ -51,6 +51,10 @@
.jumpLink:hover { .jumpLink:hover {
color: white; color: white;
} }
.jumpLink a, .jumpLink h2 {
color: var(--black);
background-color: var(--gold);
}
#categoryContainer { #categoryContainer {
width: 90%; width: 90%;