core: add logo and github sponsor button

.storybook/main.ts

@@ -46,6 +46,7 @@ const config: StorybookConfig = {
     "@storybook/addon-webpack5-compiler-babel",
     "@chromatic-com/storybook",
   ],
+  staticDirs: ["../public"],
   framework: {
     name: "@storybook/react-webpack5",
     options: {},

.storybook/manager.css

@@ -0,0 +1,6 @@
+[src="mui-treasury-logo.png"] {
+  height: 32px;
+}
+.dark [src="mui-treasury-logo.png"] {
+  filter: invert(1);
+}

.storybook/manager.tsx

@@ -6,10 +6,12 @@ import {
   STORY_MISSING,
 } from "@storybook/core-events";
 import { addons, types } from "@storybook/manager-api";
+import { create } from "@storybook/theming";
 import CarbonAds from "./carbon-ads/CarbonAds";
 import { Tool } from "./decorators/Author";
 import { BlockPicker } from "./decorators/BlockPicker";
 import { BlockUsage } from "./decorators/BlockUsage";
+import "./manager.css";
 
 // https://storybook.js.org/docs/react/configure/features-and-behavior
 addons.setConfig({
@@ -18,7 +20,13 @@ addons.setConfig({
   panelPosition: "bottom",
   enableShortcuts: true,
   showToolbar: true,
-  theme: undefined,
+  theme: create({
+    base: "light",
+    brandUrl: "https://github.com/siriwatknp/mui-treasury",
+    brandTitle: "MUI Treasury Github",
+    brandImage: "mui-treasury-logo.png",
+    brandTarget: "_blank",
+  }),
   selectedPanel: undefined,
   initialActive: "sidebar",
 });
@@ -47,6 +55,22 @@ addons.register("google-analytics", (api) => {
   });
 });
 
+addons.register("github-sponsor", () => {
+  addons.add("github-sponsor/toolbar", {
+    title: "Github Sponsor",
+    type: types.TOOLEXTRA,
+    render: () => (
+      <iframe
+        src="https://github.com/sponsors/siriwatknp/button"
+        title="Sponsor siriwatknp"
+        height="32"
+        width="108"
+        style={{ border: 0, borderRadius: 6 }}
+      ></iframe>
+    ),
+  });
+});
+
 addons.register("block-usage", () => {
   addons.add("block-usage/toolbar", {
     title: "Block Usage",