From f75254e85e3d12fffee3434625a033616af5b64f Mon Sep 17 00:00:00 2001
From: Franck Cuny <franck@fcuny.net>
Date: Sun, 15 Aug 2021 13:42:51 -0700
Subject: CSS: use a class for the menu

We will have more use of the tag `nav` and we will need different styles
for it.
---
 layouts/partials/header.html |  2 +-
 static/css/custom.css        | 13 ++++++-------
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index f918823..508e259 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,5 +1,5 @@
 <header>
-  <nav>
+  <nav class='menu'>
     <a href="{{ .Site.Home.Permalink }}">{{ .Site.Home.Title }}</a>
     <ul>
       {{ $currentPage := . }}
diff --git a/static/css/custom.css b/static/css/custom.css
index 08a7c0a..b4e37bc 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -103,7 +103,7 @@ blockquote {
     font-style: italic;
 }
 
-nav {
+nav.menu {
     display: flex;
     flex: 2 0px;
     justify-content: flex-end;
@@ -112,13 +112,13 @@ nav {
     line-height: 0.2rem;
 }
 
-nav ul {
+nav.menu ul {
     display: flex;
     list-style-type: none;
     margin: 0
 }
 
-nav a {
+nav.menu a {
     padding: 1em;
     display: inline-block;
     color: black;
@@ -127,17 +127,16 @@ nav a {
     transition: all 75ms ease-in;
 }
 
-nav a:hover {
+nav.menu a:hover {
     color: #fff;
     background-color: #007d9c;
 }
 
-nav a.menu-active:hover {
+nav.menu a.menu-active:hover {
     color: #fff;
     background-color: #007d9c;
 }
 
-nav a.menu-active {
+nav.menu a.menu-active {
     color: #007d9c;
 }
-
-- 
cgit v1.2.3