update hover image for documentation

Author: anmol-algo

src/css/header.css

@@ -24,6 +24,18 @@
   transition: height 0.5s ease;
 }
 
+.cb-documentation:hover .cb-docs{
+  display: none;
+}
+
+.cb-documentation {
+  display: block;
+}
+
+.cb-documentation:hover .cb-hover-docs{
+  display: block;
+}
+
 .navbar {
   position: relative;
   display: flex;

src/img/cb-docs-hover.svg

@@ -9,8 +9,9 @@
                   </a>
                 </li>
                 <li>
-                  <a class="navbar-brand" href="https://docs.couchbase.com">
-                    <img src="{{{uiRootPath}}}/img/cb-documentation.svg" alt="Couchbase Documentation" />
+                  <a class="navbar-brand cb-documentation" href="https://docs.couchbase.com">
+                    <img src="{{{uiRootPath}}}/img/cb-documentation.svg" alt="Couchbase Documentation" class="cb-docs" />
+                    <img src="{{{uiRootPath}}}/img/cb-docs-hover.svg" alt="Couchbase Documentation" class="hide cb-hover-docs" />
                   </a>
                 </li>
               </ul>