M templates/header.html → templates/header.html

@@ -5,35 +5,45 @@ width: 4rem;
   margin: 1rem auto;
   display: block;
 }
-.bread-crumbs {
-  box-shadow: 4px 4px var(--b_low);
-  border: 1px solid var(--b_low);
+.breadcrumbs {
+  box-shadow: 4px 4px var(--b_med);
+  border: 1px solid var(--b_med);
   padding: 0.5rem;
   border-radius: var(--border-radius);
   font-size: 1rem;
   font-family: monospace;
 }
-.bread-crumbs > ul {
+.breadcrumbs > ul {
   margin: 0;
   padding: 0.2rem;
 }
-.bread-crumbs > ul > li {
-  display: inline;
+.breadcrumbs > ul > li {
+  display: inline;  
 }
-.bread-crumbs > ul > li:not(:last-child)::after {
+.breadcrumbs > ul > li:not(:last-child)::after {
   content: "/";
-  color: var(--b_low);
+  color: var(--f_low);
 }
-.bread-crumbs > ul > li > span {
+.breadcrumbs > ul > li > a {
+  padding: 0.2rem;
+  color: var(--f_med);
+}
+.breadcrumbs > ul > li > a:hover {
+  color: var(--background);
+  background: var(--b_high);  
+  border-radius: var(--border-radius);
+}
+.breadcrumbs > ul > li > span {
+  padding: 0.2rem;
   color: var(--b_inv);
 }
-.bread-crumbs a {
+.breadcrumbs a {
   text-decoration: none;
 }
 </style>
 <div>
   <img class="logo" src="/assets/svg/logo-light.svg">
-  <nav class="bread-crumbs">
+  <nav class="breadcrumbs">
     <ul>
     {{ range .Breadcrumbs }}
       {{ if .Active }}