Add Canon styles to other packages

Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>

packages/app-next/package.json

@@ -35,6 +35,7 @@
   },
   "dependencies": {
     "@backstage/app-defaults": "workspace:^",
+    "@backstage/canon": "workspace:^",
     "@backstage/catalog-model": "workspace:^",
     "@backstage/cli": "workspace:^",
     "@backstage/config": "workspace:^",

packages/app-next/src/App.tsx

@@ -45,6 +45,8 @@ import { convertLegacyPlugin } from '@backstage/core-compat-api';
 import { convertLegacyPageExtension } from '@backstage/core-compat-api';
 import { convertLegacyEntityContentExtension } from '@backstage/plugin-catalog-react/alpha';
 
+import '@backstage/canon/css/styles.css';
+
 /*
 
 # Notes

packages/app/src/App.tsx

@@ -86,9 +86,7 @@ import {
   UserNotificationSettingsCard,
 } from '@backstage/plugin-notifications';
 
-// Canon styles
-import '@backstage/canon/css/core.css';
-import '@backstage/canon/css/components.css';
+import '@backstage/canon/css/styles.css';
 
 const app = createApp({
   apis,

packages/create-app/templates/default-app/packages/app/package.json.hbs

@@ -15,6 +15,7 @@
   },
   "dependencies": {
     "@backstage/app-defaults": "^{{version '@backstage/app-defaults'}}",
+    "@backstage/canon": "^{{version '@backstage/canon'}}",
     "@backstage/catalog-model": "^{{version '@backstage/catalog-model'}}",
     "@backstage/cli": "^{{version '@backstage/cli'}}",
     "@backstage/core-app-api": "^{{version '@backstage/core-app-api'}}",

packages/create-app/templates/default-app/packages/app/src/App.tsx

@@ -37,6 +37,8 @@ import { CatalogGraphPage } from '@backstage/plugin-catalog-graph';
 import { RequirePermission } from '@backstage/plugin-permission-react';
 import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common/alpha';
 
+import '@backstage/canon/css/styles.css';
+
 const app = createApp({
   apis,
   bindRoutes({ bind }) {