class, contest, and workshop announcements (#4240)

* class, contest, and workshop announcements

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Blue hues

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>

Author: mjh316

src/components/TopNavigationBar/TopNavigationBar.tsx

@@ -135,27 +135,72 @@ export default function TopNavigationBar({
   return (
     <>
       {!hidePromoBar && (
-        <div className="relative bg-blue-600">
-          <div className="max-w-screen-xl mx-auto py-3 px-3 sm:px-6 lg:px-8">
-            <div className="pr-16 sm:text-center sm:px-16">
-              <p className="font-medium text-white">
-                <span className="md:inline">
-                  Registration for USACO classes now open!
-                </span>
-                <span className="block sm:ml-2 sm:inline-block">
-                  <a
-                    href="https://joincpi.org/classes"
-                    target="_blank"
-                    rel="noreferrer"
-                    className="text-white font-bold underline"
-                  >
-                    Register here &rarr;
-                  </a>
-                </span>
-              </p>
+        <>
+          <div className="relative bg-blue-600">
+            <div className="max-w-screen-xl mx-auto py-3 px-3 sm:px-6 lg:px-8">
+              <div className="pr-16 sm:text-center sm:px-16">
+                <p className="font-medium text-white">
+                  <span className="md:inline">
+                    Registration for USACO classes now open!
+                  </span>
+                  <span className="block sm:ml-2 sm:inline-block">
+                    <a
+                      href="https://joincpi.org/classes"
+                      target="_blank"
+                      rel="noreferrer"
+                      className="text-white font-bold underline"
+                    >
+                      Register here &rarr;
+                    </a>
+                  </span>
+                </p>
+              </div>
             </div>
           </div>
-        </div>
+          <div className="relative bg-blue-700">
+            <div className="max-w-screen-xl mx-auto py-3 px-3 sm:px-6 lg:px-8">
+              <div className="pr-16 sm:text-center sm:px-16">
+                <p className="font-medium text-white">
+                  <span className="md:block">
+                    Registration for the USACO Guide Informatics Tournament is
+                    also open!{' '}
+                  </span>
+                  <span className="sm:ml-2 sm:inline">
+                    <a
+                      href="https://forms.gle/4vHJeGiYGLgHRv4E6"
+                      target="_blank"
+                      rel="noreferrer"
+                      className="text-white font-bold underline"
+                    >
+                      Register here &rarr;
+                    </a>
+                  </span>
+                </p>
+              </div>
+            </div>
+          </div>
+          <div className="relative bg-blue-800">
+            <div className="max-w-screen-xl mx-auto py-3 px-3 sm:px-6 lg:px-8">
+              <div className="pr-16 sm:text-center sm:px-16">
+                <p className="font-medium text-white">
+                  <span className="md:block">
+                    Registration for the January USACO Workshop is also open!{' '}
+                  </span>
+                  <span className="sm:ml-2 sm:inline">
+                    <a
+                      href="https://joincpi.org/workshops/jan24"
+                      target="_blank"
+                      rel="noreferrer"
+                      className="text-white font-bold underline"
+                    >
+                      Register here &rarr;
+                    </a>
+                  </span>
+                </p>
+              </div>
+            </div>
+          </div>
+        </>
       )}
 
       <nav