@hashicorp/react-components 0.0.0-canary.3cd4069 → 0.0.0-canary.484207e

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.
Files changed (5) hide show
  1. package/package.json +1 -1
  2. package/src/components/nav-panel/components/flight-icon/style.module.css +1 -1
  3. package/src/components/nav-panel/components/promo/style.module.css +1 -1
  4. package/src/components/nav-panel/product-panel/index.tsx +6 -2
  5. package/src/components/nav-panel/product-panel/style.module.css +12 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hashicorp/react-components",
3
- "version": "0.0.0-canary.3cd4069",
3
+ "version": "0.0.0-canary.484207e",
4
4
  "main": "src/index.ts",
5
5
  "scripts": {
6
6
  "lint": "next-hashicorp lint",
package/src/components/nav-panel/components/flight-icon/style.module.css CHANGED
@@ -1,3 +1,3 @@
1
1
  .flight-icon {
2
- display: block;
2
+ display: inline-block;
3
3
  }
package/src/components/nav-panel/components/promo/style.module.css CHANGED
@@ -74,7 +74,7 @@
74
74
  @media (--dev-dot-viewport) {
75
75
  @nest .hasSide & {
76
76
  display: block;
77
- margin-top: 3px;
77
+ margin-top: 6px;
78
78
  }
79
79
  }
80
80
  }
package/src/components/nav-panel/product-panel/index.tsx CHANGED
@@ -96,7 +96,7 @@ const ProductPanel = ({
96
96
 
97
97
  {sidePanel ? (
98
98
  <NavPanel.Column className={s.sidePanel}>
99
- <Text size="200" weight="semibold">
99
+ <Text size="200" weight="semibold" className={s.sidePanelText}>
100
100
  {sidePanel.label}
101
101
  </Text>
102
102
 
@@ -122,7 +122,11 @@ const ProductPanel = ({
122
122
  />
123
123
  </div>
124
124
  <div className={s.sidePanelItemContent}>
125
- <Text size="200" weight="semibold">
125
+ <Text
126
+ size="200"
127
+ weight="semibold"
128
+ className={s.sidePanelText}
129
+ >
126
130
  {title}
127
131
  </Text>
128
132
  <span className={s.sidePanelItemDesc}>{description}</span>
package/src/components/nav-panel/product-panel/style.module.css CHANGED
@@ -109,8 +109,7 @@
109
109
 
110
110
  @media (--large) {
111
111
  @nest .noSide & {
112
- padding: var(--mds-spacing-06) var(--mds-spacing-05)
113
- var(--mds-spacing-04);
112
+ padding: var(--mds-spacing-06) var(--mds-spacing-05) var(--mds-spacing-04);
114
113
  grid-auto-flow: row;
115
114
  grid-template-columns: repeat(2, 300px);
116
115
  grid-template-rows: repeat(2, max-content);
@@ -120,8 +119,7 @@
120
119
 
121
120
  @media (--dev-dot-viewport) {
122
121
  @nest .hasSide & {
123
- padding: var(--mds-spacing-06) var(--mds-spacing-05)
124
- var(--mds-spacing-04);
122
+ padding: var(--mds-spacing-06) var(--mds-spacing-05) var(--mds-spacing-04);
125
123
  grid-auto-flow: row;
126
124
  grid-template-columns: repeat(2, 300px);
127
125
  grid-template-rows: repeat(2, max-content);
@@ -222,6 +220,10 @@
222
220
  justify-content: space-between;
223
221
  flex-direction: column;
224
222
 
223
+ @nest .topPromo & {
224
+ justify-content: flex-start;
225
+ }
226
+
225
227
  @media (--large) {
226
228
  @nest .noSide & {
227
229
  padding: var(--mds-spacing-07) 0 var(--mds-spacing-09)
@@ -252,8 +254,8 @@
252
254
  flex-direction: column;
253
255
  gap: var(--mds-spacing-05);
254
256
  margin: 0;
255
- padding: var(--mds-spacing-07) var(--mds-spacing-04)
256
- var(--mds-spacing-09) var(--mds-spacing-07);
257
+ padding: var(--mds-spacing-07) var(--mds-spacing-04) var(--mds-spacing-09)
258
+ var(--mds-spacing-07);
257
259
  }
258
260
 
259
261
  .sidePanelItems {
@@ -348,3 +350,7 @@ packages/react-components/src/components/nav-panel/components/link-list/style.mo
348
350
  fill: inherit;
349
351
  }
350
352
  }
353
+
354
+ .sidePanelText {
355
+ font-weight: var(--mds-typography-font-weight-semibold);
356
+ }