@gsa-tts/graymatter-ui 0.2.3 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/images/favicon.ico +0 -0
- package/assets/images/favicon.svg +8 -0
- package/dist/graymatter-ui.js +1093 -1084
- package/dist/graymatter-ui.umd.cjs +22 -19
- package/package.json +3 -3
- package/src/components/DesktopSideNav.svelte +7 -1
- package/src/components/ProfileMenu.svelte +16 -13
- package/src/constants/common.ts +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gsa-tts/graymatter-ui",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.4",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -56,8 +56,8 @@
|
|
|
56
56
|
"vitest": "^3.0.7",
|
|
57
57
|
"vite": "^6.3.5",
|
|
58
58
|
"@gsa-tts/graymatter-eslint": "0.0.1",
|
|
59
|
-
"@gsa-tts/graymatter-
|
|
60
|
-
"@gsa-tts/graymatter-
|
|
59
|
+
"@gsa-tts/graymatter-vitest-config": "0.0.1",
|
|
60
|
+
"@gsa-tts/graymatter-typescript-config": "0.0.1"
|
|
61
61
|
},
|
|
62
62
|
"dependencies": {
|
|
63
63
|
"@fontsource-variable/archivo": "^5.2.6",
|
|
@@ -247,7 +247,7 @@
|
|
|
247
247
|
aria-label={sideNavExpanded() ? 'Close navigation menu' : 'Open navigation menu'}
|
|
248
248
|
aria-expanded={sideNavExpanded() ? 'true' : 'false'}
|
|
249
249
|
>
|
|
250
|
-
<div class="icon-container">
|
|
250
|
+
<div class="icon-container" part="icon-container">
|
|
251
251
|
<div class="icon-wrapper">
|
|
252
252
|
<MenuIcon
|
|
253
253
|
isHovered={menuBtnHovered()}
|
|
@@ -541,6 +541,12 @@
|
|
|
541
541
|
border-radius: var(--ai-size-4);
|
|
542
542
|
}
|
|
543
543
|
|
|
544
|
+
/* Hide focus outline on click */
|
|
545
|
+
.menu-button:focus:not(:focus-visible) .icon-container,
|
|
546
|
+
.nav-item:focus:not(:focus-visible) .icon-container {
|
|
547
|
+
outline: none;
|
|
548
|
+
}
|
|
549
|
+
|
|
544
550
|
.nav-items {
|
|
545
551
|
display: flex;
|
|
546
552
|
width: var(--ai-size-72);
|
|
@@ -96,9 +96,11 @@
|
|
|
96
96
|
on:keydown={(e) => handleMenuKeydown(e, idx)}
|
|
97
97
|
role="menuitem"
|
|
98
98
|
>
|
|
99
|
+
{#if item.icon}
|
|
99
100
|
<span class="icon">
|
|
100
101
|
<img src={item.icon} alt="" aria-hidden="true" width="20" height="20" />
|
|
101
102
|
</span>
|
|
103
|
+
{/if}
|
|
102
104
|
<div class="menu-text">{item.label}</div>
|
|
103
105
|
</button>
|
|
104
106
|
{/each}
|
|
@@ -122,15 +124,24 @@
|
|
|
122
124
|
}
|
|
123
125
|
|
|
124
126
|
.user-profile-icon {
|
|
125
|
-
border-radius: var(--ai-size-4);
|
|
126
127
|
background: var(--ai-color-blue-800);
|
|
128
|
+
border-radius: var(--ai-size-4);
|
|
129
|
+
box-sizing: border-box;
|
|
130
|
+
height: var(--ai-size-40);
|
|
131
|
+
padding: var(--ai-size-4);
|
|
132
|
+
white-space: nowrap;
|
|
133
|
+
width: var(--ai-size-40);
|
|
127
134
|
}
|
|
128
135
|
|
|
129
136
|
.user-initials {
|
|
130
137
|
color: var(--ai-color-white);
|
|
131
|
-
|
|
138
|
+
font-size: var(--ai-size-16);
|
|
139
|
+
font-style: normal;
|
|
132
140
|
font-weight: 400;
|
|
133
|
-
line-height: 1
|
|
141
|
+
line-height: 1;
|
|
142
|
+
overflow: hidden;
|
|
143
|
+
text-align: center;
|
|
144
|
+
text-overflow: ellipsis;
|
|
134
145
|
}
|
|
135
146
|
|
|
136
147
|
.user-profile-button {
|
|
@@ -150,7 +161,7 @@
|
|
|
150
161
|
}
|
|
151
162
|
|
|
152
163
|
.user-profile-button:focus:not(:focus-visible) {
|
|
153
|
-
|
|
164
|
+
outline: none;
|
|
154
165
|
}
|
|
155
166
|
|
|
156
167
|
.user-profile-container {
|
|
@@ -159,14 +170,6 @@
|
|
|
159
170
|
aspect-ratio: 1/1;
|
|
160
171
|
}
|
|
161
172
|
|
|
162
|
-
.user-profile-icon {
|
|
163
|
-
padding: 0.5556rem 0.4931rem 0.5694rem 0.3819rem;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
.user-initials {
|
|
167
|
-
font-size: var(--ai-size-16);
|
|
168
|
-
font-style: normal;
|
|
169
|
-
}
|
|
170
173
|
.profile-context-menu {
|
|
171
174
|
display: flex;
|
|
172
175
|
width: 13.75rem;
|
|
@@ -238,4 +241,4 @@
|
|
|
238
241
|
font-weight: 400;
|
|
239
242
|
line-height: 130%;
|
|
240
243
|
}
|
|
241
|
-
</style>
|
|
244
|
+
</style>
|
package/src/constants/common.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export const siteName = '
|
|
1
|
+
export const siteName = 'USAi.gov';
|
|
2
2
|
export const salesEmail = 'partnerships@usai.gov';
|