From 6942e6f9794ec541769a4ae08e8c4c2a480805d2 Mon Sep 17 00:00:00 2001
From: Brandon Egger <brandonegger64@gmail.com>
Date: Mon, 10 Apr 2023 20:23:59 -0500
Subject: [PATCH] improve look of header

---
 public/listening-ear.svg  | 2 +-
 src/components/Header.tsx | 4 ++--
 src/pages/index.tsx       | 3 ++-
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/public/listening-ear.svg b/public/listening-ear.svg
index 9afa7fc..d54621c 100644
--- a/public/listening-ear.svg
+++ b/public/listening-ear.svg
@@ -3,5 +3,5 @@
 <svg height="800px" width="800px" version="1.1" id="_x32_" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512" xml:space="preserve" fill="#000000">
 
<g id="SVGRepo_bgCarrier" stroke-width="0"/>
 
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
-
<g id="SVGRepo_iconCarrier"> <style type="text/css"> .st0{fill:#c3947c;} </style> <g> <path class="st0" d="M460.292,450.719l-0.905-0.095c0.08,0.072-0.667,2.741-3.163,5.959c-3.671,4.902-10.694,10.964-19.68,15.398 c-9.002,4.489-19.879,7.484-31.63,7.476c-13.706-0.04-28.698-3.893-44.707-14.968c-15.334-10.702-23.28-19.276-28.578-27.904 c-3.973-6.523-6.65-13.499-9.209-22.5c-3.838-13.436-7.134-31.161-14.293-54.321c-7.174-23.184-18.274-51.707-37.835-87.666 c-15.604-28.562-29-71.164-28.912-111.494c0-16.915,2.288-33.409,7.389-48.481c5.116-15.095,12.959-28.777,24.368-40.631 c26.982-27.872,58.095-38.867,87.683-38.947c21.412-0.016,41.958,5.982,58.618,16.041c16.701,10.05,29.334,24.026,35.786,39.574 l30.032-12.521c-9.582-22.962-27.236-41.792-49.022-54.933C414.409,7.572,388.261,0.016,360.819,0 c-37.843-0.08-78.292,14.762-111.105,48.91c-15.024,15.556-25.337,33.719-31.773,52.788c-6.451,19.084-9.096,39.082-9.104,58.905 c0.095,47.329,14.849,93.721,32.868,127.035c16.518,30.406,26.37,54.52,32.996,74.462c4.965,14.969,8.128,27.602,10.9,39.082 c4.188,17.114,7.397,32.194,15.414,47.377c3.996,7.532,9.185,14.841,15.85,21.873c6.674,7.039,14.778,13.824,24.757,20.768 c21.094,14.723,43.19,20.848,63.291,20.8c23.819-0.032,44.572-8.183,59.842-19.124c7.659-5.514,14.016-11.734,18.799-18.568 c4.72-6.857,8.263-14.388,8.374-23.589H460.292z"/> <path class="st0" d="M392.036,257.033c-11.394,2.121-21.778,8.613-28.928,18.345c-7.206,9.726-11.187,22.477-11.17,37.001 c0,7.778,1.119,16.097,3.463,24.876c4.044,15.136,10.988,27.49,20.236,36.309c9.192,8.811,20.944,13.952,33.139,13.92 c12.696,0.032,25.25-5.529,35.403-15.477c6.722-6.547,10.853-14.889,13.3-23.787c2.462-8.931,3.337-18.608,3.353-28.889 c-0.016-17.154-2.526-36.094-5.8-55.695c-3.29-19.585-7.381-39.805-10.734-59.08c-3.679-20.856-9.486-43.134-21.222-61.455 c-5.88-9.129-13.396-17.313-23.009-23.2c-9.582-5.895-21.198-9.272-34.117-9.24c-0.985,0-1.97,0.015-2.956,0.055 c-15.755,0.5-29.159,6.372-38.232,15.938c-9.121,9.526-13.824,21.841-15.588,34.521c-0.93,6.682,3.726,12.847,10.408,13.769 c6.674,0.93,12.839-3.726,13.761-10.4v-0.008c1.256-9.041,4.418-16.208,9.026-20.975c4.648-4.728,10.837-7.961,21.547-8.454 l2.034-0.039c8.851,0.032,15.533,2.113,21.373,5.657c8.692,5.276,15.771,14.595,21.245,26.79 c5.474,12.125,9.184,26.776,11.687,41.22c3.146,18.067,6.769,36.42,9.813,54.011c-8.256-4.442-17.495-6.777-26.894-6.769 C399.465,255.976,395.737,256.326,392.036,257.033z M436.115,313.109c0.024,0.191,0.088,0.366,0.12,0.557 c0.064,1.882,0.19,3.869,0.19,5.665c0.016,8.819-0.818,16.478-2.462,22.405c-1.653,5.975-3.996,10.043-6.802,12.776 c-6.531,6.285-12.744,8.541-18.385,8.564c-5.426-0.023-10.901-2.097-16.311-7.19c-5.355-5.085-10.392-13.316-13.483-24.924 c-1.852-6.944-2.638-13.157-2.638-18.584c0.015-10.17,2.701-17.504,6.379-22.492c3.726-4.974,8.43-7.818,13.857-8.875 c2.216-0.421,4.425-0.627,6.594-0.627c8.096,0.015,15.596,2.812,21.436,8.096C430.426,293.795,434.852,301.645,436.115,313.109z"/> <path class="st0" d="M148.621,156.83c-3.385-5.825-10.853-7.802-16.677-4.402c-5.832,3.392-7.794,10.853-4.41,16.685 c2.686,4.616,5.212,9.296,7.468,14.071c25.202,53.216,22.08,112.631-3.234,161.27c-3.106,5.99-0.786,13.348,5.188,16.462 c5.991,3.107,13.348,0.795,16.463-5.188c28.682-55.076,32.233-122.601,3.638-183C154.437,167.19,151.576,161.906,148.621,156.83z"/> <path class="st0" d="M96.096,183.358c-3.393-5.824-10.862-7.802-16.693-4.418c-5.824,3.401-7.794,10.87-4.418,16.693 c1.915,3.281,3.687,6.547,5.252,9.86c17.67,37.326,15.469,78.935-2.272,113.051c-3.114,5.975-0.786,13.348,5.188,16.462 c5.975,3.115,13.348,0.787,16.463-5.187c21.118-40.537,23.74-90.273,2.686-134.766C100.354,190.945,98.249,187.068,96.096,183.358z "/> <path class="st0" d="M46.844,215.901c-1.32-2.781-2.718-5.236-4.005-7.469c-3.384-5.832-10.853-7.818-16.685-4.441 c-5.832,3.384-7.818,10.861-4.433,16.685v0.008c1.184,2.042,2.232,3.917,3.058,5.657c10.146,21.444,8.844,45.192-1.342,64.793 c-3.123,5.982-0.795,13.34,5.18,16.454c5.975,3.122,13.34,0.803,16.446-5.172l0.016-0.008 c11.854-22.724,14.682-50.007,6.134-75.645C49.99,223.107,48.528,219.477,46.844,215.901z"/> </g> </g>
+
<g id="SVGRepo_iconCarrier"> <style type="text/css"> .st0{fill:#000000;} </style> <g> <path class="st0" d="M460.292,450.719l-0.905-0.095c0.08,0.072-0.667,2.741-3.163,5.959c-3.671,4.902-10.694,10.964-19.68,15.398 c-9.002,4.489-19.879,7.484-31.63,7.476c-13.706-0.04-28.698-3.893-44.707-14.968c-15.334-10.702-23.28-19.276-28.578-27.904 c-3.973-6.523-6.65-13.499-9.209-22.5c-3.838-13.436-7.134-31.161-14.293-54.321c-7.174-23.184-18.274-51.707-37.835-87.666 c-15.604-28.562-29-71.164-28.912-111.494c0-16.915,2.288-33.409,7.389-48.481c5.116-15.095,12.959-28.777,24.368-40.631 c26.982-27.872,58.095-38.867,87.683-38.947c21.412-0.016,41.958,5.982,58.618,16.041c16.701,10.05,29.334,24.026,35.786,39.574 l30.032-12.521c-9.582-22.962-27.236-41.792-49.022-54.933C414.409,7.572,388.261,0.016,360.819,0 c-37.843-0.08-78.292,14.762-111.105,48.91c-15.024,15.556-25.337,33.719-31.773,52.788c-6.451,19.084-9.096,39.082-9.104,58.905 c0.095,47.329,14.849,93.721,32.868,127.035c16.518,30.406,26.37,54.52,32.996,74.462c4.965,14.969,8.128,27.602,10.9,39.082 c4.188,17.114,7.397,32.194,15.414,47.377c3.996,7.532,9.185,14.841,15.85,21.873c6.674,7.039,14.778,13.824,24.757,20.768 c21.094,14.723,43.19,20.848,63.291,20.8c23.819-0.032,44.572-8.183,59.842-19.124c7.659-5.514,14.016-11.734,18.799-18.568 c4.72-6.857,8.263-14.388,8.374-23.589H460.292z"/> <path class="st0" d="M392.036,257.033c-11.394,2.121-21.778,8.613-28.928,18.345c-7.206,9.726-11.187,22.477-11.17,37.001 c0,7.778,1.119,16.097,3.463,24.876c4.044,15.136,10.988,27.49,20.236,36.309c9.192,8.811,20.944,13.952,33.139,13.92 c12.696,0.032,25.25-5.529,35.403-15.477c6.722-6.547,10.853-14.889,13.3-23.787c2.462-8.931,3.337-18.608,3.353-28.889 c-0.016-17.154-2.526-36.094-5.8-55.695c-3.29-19.585-7.381-39.805-10.734-59.08c-3.679-20.856-9.486-43.134-21.222-61.455 c-5.88-9.129-13.396-17.313-23.009-23.2c-9.582-5.895-21.198-9.272-34.117-9.24c-0.985,0-1.97,0.015-2.956,0.055 c-15.755,0.5-29.159,6.372-38.232,15.938c-9.121,9.526-13.824,21.841-15.588,34.521c-0.93,6.682,3.726,12.847,10.408,13.769 c6.674,0.93,12.839-3.726,13.761-10.4v-0.008c1.256-9.041,4.418-16.208,9.026-20.975c4.648-4.728,10.837-7.961,21.547-8.454 l2.034-0.039c8.851,0.032,15.533,2.113,21.373,5.657c8.692,5.276,15.771,14.595,21.245,26.79 c5.474,12.125,9.184,26.776,11.687,41.22c3.146,18.067,6.769,36.42,9.813,54.011c-8.256-4.442-17.495-6.777-26.894-6.769 C399.465,255.976,395.737,256.326,392.036,257.033z M436.115,313.109c0.024,0.191,0.088,0.366,0.12,0.557 c0.064,1.882,0.19,3.869,0.19,5.665c0.016,8.819-0.818,16.478-2.462,22.405c-1.653,5.975-3.996,10.043-6.802,12.776 c-6.531,6.285-12.744,8.541-18.385,8.564c-5.426-0.023-10.901-2.097-16.311-7.19c-5.355-5.085-10.392-13.316-13.483-24.924 c-1.852-6.944-2.638-13.157-2.638-18.584c0.015-10.17,2.701-17.504,6.379-22.492c3.726-4.974,8.43-7.818,13.857-8.875 c2.216-0.421,4.425-0.627,6.594-0.627c8.096,0.015,15.596,2.812,21.436,8.096C430.426,293.795,434.852,301.645,436.115,313.109z"/> <path class="st0" d="M148.621,156.83c-3.385-5.825-10.853-7.802-16.677-4.402c-5.832,3.392-7.794,10.853-4.41,16.685 c2.686,4.616,5.212,9.296,7.468,14.071c25.202,53.216,22.08,112.631-3.234,161.27c-3.106,5.99-0.786,13.348,5.188,16.462 c5.991,3.107,13.348,0.795,16.463-5.188c28.682-55.076,32.233-122.601,3.638-183C154.437,167.19,151.576,161.906,148.621,156.83z"/> <path class="st0" d="M96.096,183.358c-3.393-5.824-10.862-7.802-16.693-4.418c-5.824,3.401-7.794,10.87-4.418,16.693 c1.915,3.281,3.687,6.547,5.252,9.86c17.67,37.326,15.469,78.935-2.272,113.051c-3.114,5.975-0.786,13.348,5.188,16.462 c5.975,3.115,13.348,0.787,16.463-5.187c21.118-40.537,23.74-90.273,2.686-134.766C100.354,190.945,98.249,187.068,96.096,183.358z "/> <path class="st0" d="M46.844,215.901c-1.32-2.781-2.718-5.236-4.005-7.469c-3.384-5.832-10.853-7.818-16.685-4.441 c-5.832,3.384-7.818,10.861-4.433,16.685v0.008c1.184,2.042,2.232,3.917,3.058,5.657c10.146,21.444,8.844,45.192-1.342,64.793 c-3.123,5.982-0.795,13.34,5.18,16.454c5.975,3.122,13.34,0.803,16.446-5.172l0.016-0.008 c11.854-22.724,14.682-50.007,6.134-75.645C49.99,223.107,48.528,219.477,46.844,215.901z"/> </g> </g>
 
</svg>
\ No newline at end of file
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 0fe8932..1e3cf8d 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -78,11 +78,11 @@ const NavBar = () => {
 const Header: NextPage = () => {
     return <>
         <div id="logo-row" className="flex flex-row p-4 justify-center border-b border-yellow bg-neutral-800 drop-shadow-xl">
-            <div>
+            <div className="shadow-md shadow-yellow-500/50 bg-yellow-100 rounded-xl p-2">
                 <Image alt="Ear listening" src="/listening-ear.svg" width={64} height={64}/>
             </div>
             <div id="header-title" className="w-64 grid place-items-center">
-                <h1 className="text-center text-2xl font-bold text-neutral-300">Center for Auditory Training Resources</h1>
+                <h1 className="text-center text-2xl font-bold text-neutral-200">Center for Auditory Training Resources</h1>
             </div>
         </div>
         <NavBar/>
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 446c291..61f0f74 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -11,7 +11,8 @@ const Home: NextPage = () => {
         <link rel="icon" href="/favicon.ico" />
       </Head>
       <main>
-        <div className="my-6">
+        <div className="p-2">
+          <h1 className="mx-auto text-center font-extrabold text-4xl max-w-lg text-neutral-600">Welcome to the Resource Center for Auditory Training!</h1>
         </div>
       </main>
     </>