docs(nxdev): add banner announcement on documentation side (#13391)

nrwl · Nov 24, 2022 · 8200870 · 8200870 · vercel · Nov 24, 2022
1 parent 535ce8f
commit 8200870
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/nx-dev/ui-common/src/lib/announcement-banner.tsx b/nx-dev/ui-common/src/lib/announcement-banner.tsx
@@ -12,11 +12,15 @@ export function AnnouncementBanner(): JSX.Element {
               </Link>
             </span>
             <span className="hidden md:inline">
-              <span className="font-black">State of JS survey is online!</span>
+              <span className="font-semibold">
+                State of JS survey is online!
+              </span>
             </span>
             <span className="ml-2 inline-block">
               <Link
                 href="https://stateofjs.com/en-us/"
+                rel="noreferrer"
+                target="_blank"
                 className="font-semibold text-blue-500 underline dark:text-sky-500"
               >
                 <span className="absolute inset-0" aria-hidden="true" />

diff --git a/nx-dev/ui-common/src/lib/documentation-header.tsx b/nx-dev/ui-common/src/lib/documentation-header.tsx
@@ -192,6 +192,21 @@ export function DocumentationHeader({
         </div>
         {/*NAVIGATION*/}
         <div className="hidden flex-grow lg:flex">{/* SPACER */}</div>
+        <div className="hidden flex-grow text-xs italic lg:flex">
+          <div className="relative">
+            <span className="mr-2">State of JS survey is online!</span>
+            <Link
+              href="https://stateofjs.com/en-us/"
+              rel="noreferrer"
+              target="_blank"
+              className="text-blue-500 underline dark:text-sky-500"
+            >
+              <span className="absolute inset-0" aria-hidden="true" />
+              Give Nx a thumbs up
+              <span aria-hidden="true">&rarr;</span>
+            </Link>
+          </div>
+        </div>
         <div className="hidden flex-shrink-0 lg:flex">
           <nav
             role="accessory-nav"