changes from PR review

GovAlta · Feb 3, 2025 · b9c6c74 · b9c6c74
1 parent 09917cf
commit b9c6c74
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 12 deletions.
diff --git a/libs/web-components/src/components/app-header/AppHeader.svelte b/libs/web-components/src/components/app-header/AppHeader.svelte
@@ -426,6 +426,18 @@
     ) !important;
   }
 
+  /* Menu items in collapsed menu -- Current */
+  :global(::slotted(a.inside-collapse-menu.current)) {
+    color: var(app-header-color-text-nav-item-in-menu-current);
+    background-color: var(--goa-app-header-color-bg-nav-item-in-menu-current) !important;
+  }
+
+  /* Menu items in collapsed menu -- Current -- Hover */
+  :global(::slotted(a.inside-collapse-menu.current:hover)) {
+    color: var(app-header-color-text-nav-item-in-menu-current-hover) !important;
+    background-color: var(--goa-app-header-color-bg-nav-item-in-menu-current-hover) !important;
+  }
+
   /*------------------------------------------------*/
 
   /* DESKTOP -------------------------------------- */
@@ -504,20 +516,20 @@
 
   /* Header nav item --Current */
   .desktop :global(::slotted(a.current)) {
-    border-top: var(--goa-app-header-border-nav-item-current) !important;
-    border-bottom: var(--goa-app-header-border-nav-item-default);
+    border-top: var(--goa-app-header-border-nav-item-default) !important;
+    border-bottom: var(--goa-app-header-border-nav-item-current);
   }
 
   /* Header nav item --Current--Hover */
   .desktop :global(::slotted(a.current:hover)) {
-    border-top: var(--goa-app-header-border-nav-item-current-hover) !important;
-    border-bottom: var(--goa-app-header-border-nav-item-default);
+    border-top: var(--goa-app-header-border-nav-item-default) !important;
+    border-bottom: var(--goa-app-header-border-nav-item-current-hover);
   }
 
   /* Header nav item --Current--Focus */
   .desktop :global(::slotted(a.current:focus-visible)) {
-    border-top: var(--goa-app-header-border-nav-item-current-focus) !important;
-    border-bottom: var(--goa-app-header-border-nav-item-default);
+    border-top: var(--goa-app-header-border-nav-item-default) !important;
+    border-bottom: var(--goa-app-header-border-nav-item-current-focus);
   }
 
   /* Header nav item with children (app header menu) --Default */
@@ -673,7 +685,7 @@
 
   .mobile .header-logo-title-area {
     display: flex;
-    align-items: top;
+    align-items: start;
     padding: var(--goa-app-header-padding-logo-mobile);
     gap: var(--goa-app-header-space-btw-logo-service-name-mobile);
   }

diff --git a/libs/web-components/src/components/badge/Badge.svelte b/libs/web-components/src/components/badge/Badge.svelte
@@ -96,6 +96,7 @@
   :host {
     box-sizing: border-box;
     font-family: var(--goa-font-family-sans);
+    height: var(--goa-badge-height);
   }
 
   .goa-badge {
@@ -116,7 +117,6 @@
   }
 
   .goa-badge-no-icon {
-    height: 100px;
     margin-left: -0.25rem;
   }
 

diff --git a/libs/web-components/src/components/side-menu-group/SideMenuGroup.svelte b/libs/web-components/src/components/side-menu-group/SideMenuGroup.svelte
@@ -183,6 +183,7 @@
   :global(::slotted(a:focus-visible)),
   .heading:focus-visible {
     outline: var(--goa-side-menu-item-focus-border);
+    outline-offset: -3px;
   }
 
 

diff --git a/libs/web-components/src/components/side-menu-heading/SideMenuHeading.svelte b/libs/web-components/src/components/side-menu-heading/SideMenuHeading.svelte
@@ -36,5 +36,6 @@
     display: flex;
     align-items: flex-start;
     margin: var(--goa-side-menu-heading-margin);
+    gap: var(--goa-side-menu-heading-gap);
   }
 </style>
diff --git a/libs/web-components/src/components/side-menu/SideMenu.svelte b/libs/web-components/src/components/side-menu/SideMenu.svelte
@@ -127,13 +127,13 @@
 
   :global(::slotted(a:focus-visible)) {
     outline: var(--goa-side-menu-item-focus-border);
+    outline-offset: -3px;
   }
 
   .side-menu {
-    width: var(--goa-side-menu-width);
     display: flex;
     height: 100%;
     flex-direction: column;
     gap: var(--goa-side-menu-items-gap);
-    border-right: var(--goa-side-menu-border-right); /* should this happen on the parent div on the page? */  }
+  }
 </style>
diff --git a/package.json b/package.json
@@ -11,7 +11,7 @@
     "build": "nx affected --base=alpha -t build --exclude=angular --exclude=react --exclude=web",
     "build:vscode-doc": "node libs/web-components/custom-element-manifest-analyze.js",
     "pretest": "npx nx run common:build",
-    "test": "vitest",
+    "test": "vitest && nx test angular-components && nx test react-components",
     "test:web-components": "vitest -w",
     "test:angular": "nx test angular-components --watch",
     "test:react": "nx test react-components --watch",
@@ -25,7 +25,7 @@
   },
   "private": true,
   "devDependencies": {
-    "@abgov/design-tokens": "^1.5.4",
+    "@abgov/design-tokens": "^1.5.5",
     "@abgov/nx-release": "^8.1.4",
     "@angular-devkit/build-angular": "18.2.2",
     "@angular-devkit/core": "18.1.4",