From 493e097532d541537543d06fb8ecf5bc4aef9dc4 Mon Sep 17 00:00:00 2001
From: Reza Rahman <13340707+rezrah@users.noreply.github.com>
Date: Tue, 12 Dec 2023 09:31:03 +0000
Subject: [PATCH] push mascots page
---
.../site/pages/content-examples/mascots.mdx | 97 +++++++++++++++++++
.../components/layout/sidebar/Sidebar.tsx | 1 +
2 files changed, 98 insertions(+)
create mode 100644 packages/site/pages/content-examples/mascots.mdx
diff --git a/packages/site/pages/content-examples/mascots.mdx b/packages/site/pages/content-examples/mascots.mdx
new file mode 100644
index 0000000..7e4034a
--- /dev/null
+++ b/packages/site/pages/content-examples/mascots.mdx
@@ -0,0 +1,97 @@
+---
+title: Mascots
+description: Mona the Octocat and supporting robot mascots are beloved icons of the open source community, and an intregal part of GitHub's brand. We take protecting her and her robot sidekicks seriously, and have developed the following guidelines to help keep her from going the way of Clippy™. Before slapping a mascot on a piece of content, please consider the following guidelines.
+image: https://github.com/primer/brand/assets/19292210/3999087b-cf06-4c32-8d42-1f03224ff69c
+image-alt: All three GitHub Mascots, Mona the Octocat, Hubot, and Copilot.
+---
+
+import {DoDontContainer, Do, Dont, Caption} from '@primer/doctocat-nextjs'
+import {UnorderedList, Button, River, Heading, Text, Link} from '@primer/react-brand'
+
+## The Octocat
+
+
+
+Part cat, part octopus, Mona is a pioneer of the Octocat species and is our official mascot. To the average person, Mona is just a cartoon character. But to the developer community, Mona is an icon.
+
+In general, Mona starts to appear the closer that we get to speaking about the open source community.
+
+## Copilot
+
+
+
+The newest addition to the Octocat Universe, Copilot represents the latest in AI tech.
+
+In general, Copilot starts to appear the closer we get to talking about the GitHub Copilot product specifically, and AI in general.
+
+## Hubot
+
+
+
+Based on our open source [chat bot](https://hubotio.github.io/hubot/), Hubot is Mona’s robot sidekick and most loyal contributor. He can be programmed to perform any task but is not made with the latest AI and might become a bit snarky if his instructions are not explicit. While Copilot may be the brains, Hubot is the muscle.
+
+In general, Hubot shows up when the surrounding content is regarding automation and productivity.
+
+## Usage Guidelines
+
+> When it comes to using mascots in brand applications, less is more.
+
+Our mascots shouldn't just be space-fillers. Overuse can be distracting and annoying, and underuse can create missed opportunities for surprise and delight. Balance and thoughtful intent are imperative. Preserve the magic of our beloved characters by using them sparingly, and only when the context is appropriate. The following do's and dont's provide some general guidance on what is or is not appropriate context, however all public-facing usage of Mascots must be approved by GitHub’s Brand & Marketing Design team.
+
+
+
+
+
+
+
+
+
+
+## Alternate Octocat Styles
+
+While working with our current brand design system, octocats should be added in the style seen at the top of this page. However, there are a handful of alternate styles that we use for specific use cases.
+
+
+
+
+
+
+
+ The Original Octocat
+ The illustration that started it all. This flat graphic style is outdated now, but still has a special place in our hearts—you’ll most likely find this style as vintage GitHub stickers. New work is not produced in this style unless intended to be a throwback.
+ Find more octocats in the Octodex
+
+
+
+
+
+
+
+
+ The Octocat 2.0 Style
+ Our current Octocat model, used in illustrations, animations, and stickers. This version of Mona is more emotive and functional in 3D space and the style most common for stickers or narrative illustrations.
+ Build your own at myoctocat.com
+
+
+
+
+
+
+
+
+ Monamoji
+ Monamoji are the Octocat custom emoji set, used for reaction gifs and as custom emoji. These should be reserved for community engagement, and should not be used when speaking as the voice of GitHub.
+ See animated versions on Giphy
+
+
+
+