Update New badge pattern

[yurm04]

WHY are these changes introduced?

Adds new guidance to the New badge pattern page to address New badges being added to the primary admin nav

WHAT is this pull request doing?

Adds a few bullet points to the new badge pattern and the navigation component documentation

On the New badge pattern page

On the navigation component page

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Copy-paste this code in playground/Playground.tsx:

import React from 'react';
import {Page} from '../src';

export function Playground() {
  return (
    <Page title="Playground">
      {/* Add the code you want to test in here */}
    </Page>
  );
}

🎩 checklist

• Tested on mobile
• Tested on multiple browsers
• Tested for accessibility
• Updated the component's README.md with documentation changes
• Tophatted documentation changes in the style guide

[alex-page]

I wonder if the documentation could be.. "Do not add additional components like Badge into the navigation". I foresee people trying to sneak other components in.

[selenehinkley]

I like that suggestion because the clarity future proofs potential misuse/interpretations. Suggesting this copy in a new PR: Not add additional components, like badge, in navigation items. Example: Don‘t add the New badge.

[alex-page]

Looks good to me. One comment, not blocking.

[lizlin2022]

Looks good to me too, thank you all!