Merge pull request #160 from bcgov/DEVX1435-ImproveWizardCardStyle

Devx1435 Design tokens + improve card styles
bcgov · Jul 30, 2024 · c91257e · c91257e
2 parents c6ce3cc + 0970c38
commit c91257e
Show file tree

Hide file tree

Showing 7 changed files with 477 additions and 401 deletions.
diff --git a/packages/app/package.json b/packages/app/package.json
@@ -41,6 +41,7 @@
     "@backstage/plugin-user-settings": "^0.8.8",
     "@backstage/theme": "^0.5.6",
     "@bcgov/bc-sans": "^2.0.0",
+    "@bcgov/design-tokens": "^3.0.0",
     "@internal/plugin-analytics-module-snowplow": "^0.1.0",
     "@material-ui/core": "^4.12.4",
     "@material-ui/icons": "^4.11.3",

diff --git a/packages/app/src/components/Root/Root.tsx b/packages/app/src/components/Root/Root.tsx
@@ -159,7 +159,6 @@ export const Root = ({ children }: PropsWithChildren<{}>) => {
         </SidebarScrollWrapper> */}
       </SidebarGroup>
       <SidebarSpace />
-      <SidebarDivider />
       <SidebarGroup
         label="Offsite Links"
       >

diff --git a/packages/app/src/components/home/HomeHeaderText.tsx b/packages/app/src/components/home/HomeHeaderText.tsx
@@ -0,0 +1,32 @@
+import {Typography, withStyles} from "@material-ui/core";
+import * as tokens from "@bcgov/design-tokens/js";
+
+export const BCGovBannerText = withStyles({
+    root: {
+        position: 'relative',
+        '&::before': {
+            content: `''`,
+            position: 'absolute',
+            top: '-6px',
+            left: '-25px',
+            width: '4px',
+            height: '64px',
+            background: tokens.themePrimaryGold
+        }, 
+    }
+})(Typography);
+
+export const BCGovHeaderText = withStyles({
+    root: {
+        position: 'relative',
+        '&::before': {
+            content: `''`,
+            position: 'absolute',
+            top: '-10px',
+            left: '0',
+            width: '36px',
+            height: '4px',
+            background: tokens.themePrimaryGold
+        }, 
+    }
+})(Typography);