Merge pull request #1044 from wjohnsto/fix/nav-bg-shade

Fixing bg shade on products and resources dropdowns

Author: mich-elle-luna

layouts/partials/header.html

@@ -1,5 +1,5 @@
 <header
-  class="sticky top-0 z-50 w-full border-b border-redis-pen-300 bg-white text-midnight-900 font-mono text-[15px] flex justify-center">
+  class="sticky top-0 h-[70px] z-50 w-full border-b border-redis-pen-300 bg-white text-midnight-900 font-mono text-[15px] flex justify-center">
   {{/* {{ partial "banner.html" . }} */}}
   <div class="flex h-[70px] px-4 lg:pl-11 lg:pr-0 items-center self-center grow">
     <a class="relative text-redis-red-500 w-[82px] -mt-[5px] mr-[4px]" href="https://redis.io/">

layouts/partials/header/products-dropdown.html

@@ -1,5 +1,5 @@
 <div
-  class="flex flex-col font-sans lg:hidden lg:group-hover:flex lg:absolute lg:left-25 lg:border lg:border-redis-pencil-300 bg-white lg:p-8 lg:flex-row lg:rounded-b-md gap-8 text-[15px]">
+  class="flex flex-col font-sans lg:hidden lg:group-hover:flex lg:absolute lg:left-25 lg:border lg:border-redis-pencil-300 bg-white lg:flex-row lg:rounded-b-md gap-8 text-[15px]">
   <div class="p-10">
     <h2 class="mb-6 border-b border-redis-pencil-250 pb-2 text-xs font-medium uppercase tracking-[2px] text-gray-400">
       Products</h2>
@@ -41,14 +41,14 @@ <h2 class="mb-6 border-b border-redis-pencil-250 pb-2 text-xs font-medium upperc
     </ul>
 
   </div>
-  <div class="flex flex-col bg-redis-neutral-200 p-10">
+  <div class="flex flex-col bg-redis-neutral-200 p-8">
     <div class="mb-4">
       <h2 class="mb-6 border-b border-redis-pencil-250 pb-2 text-xs font-medium uppercase tracking-[2px] text-gray-400">
         Tools</h2>
       <ul class="space-y-4">
-        <li class="w-[16rem]"><a class="font-medium hover:text-redis-red-500" href="https://redis.io/insight/">Redis
+        <li><a class="font-medium hover:text-redis-red-500" href="https://redis.io/insight/">Redis
             Insight</a></li>
-        <li class="w-[16rem]"><a class="font-medium hover:text-redis-red-500" href="https://redis.io/clients/">Clients
+        <li><a class="font-medium hover:text-redis-red-500" href="https://redis.io/clients/">Clients
             and connectors</a></li>
       </ul>
     </div>

layouts/partials/header/resources-dropdown.html

@@ -1,5 +1,5 @@
 <div
-  class="flex flex-col font-sans lg:hidden lg:group-hover:flex lg:absolute lg:left-25 lg:border lg:border-redis-pencil-300 bg-white lg:p-8 lg:flex-row lg:rounded-b-md gap-8 text-[15px]">
+  class="flex flex-col font-sans lg:hidden lg:group-hover:flex lg:absolute lg:left-25 lg:border lg:border-redis-pencil-300 bg-white lg:flex-row lg:rounded-b-md gap-8 text-[15px]">
   <div class="p-10">
     <div>
       <h2 class="mb-6 border-b border-redis-pencil-250 pb-2 text-xs font-medium uppercase tracking-[2px] text-gray-400">

tailwind.config.js

@@ -58,6 +58,8 @@ module.exports = {
 					900: '#091A23'
 				},
 				'redis-neutral': {
+					200: '#F9F9F9',
+					600: '#bfc2c4',
 					800: '#4E545B'
 				}
 			},