@woosmap/ui 3.158.0 → 3.160.0

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@woosmap/ui",
3
- "version": "3.158.0",
3
+ "version": "3.160.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/WebGeoServices/ui.git"
@@ -139,9 +139,9 @@ class Aside extends Component {
139
139
  src={productImgSq[product.id]}
140
140
  alt={product.name}
141
141
  />
142
- <div>
143
- <div className="card__aside__list__item__title mb--5">{product.name}</div>
144
- <div>{children}</div>
142
+ <div className="card__aside__list__item__section">
143
+ <div className="card__aside__list__item__section__title">{product.name}</div>
144
+ <div className="card__aside__list__item__section__item">{children}</div>
145
145
  </div>
146
146
  </li>
147
147
  </ul>
@@ -14,7 +14,7 @@ const Story = {
14
14
  export default Story;
15
15
  const renderAsideContent = () => (
16
16
  <>
17
- <Card.Aside mode="addon" product={{ id: 'INDOOR_MAP', name: 'Indoor Map' }}>
17
+ <Card.Aside mode="pluggedTo" product={{ id: 'INDOOR_MAP', name: 'Indoor Map' }}>
18
18
  switch
19
19
  </Card.Aside>
20
20
  </>
@@ -8,6 +8,61 @@
8
8
  flex-shrink 0
9
9
  background-color $light
10
10
  border .1rem solid $secondary20
11
+ &--localities
12
+ .card
13
+ &__content
14
+ &__wrapper
15
+ background-color lighten($localities, 8%)
16
+ &--geolocation
17
+ &.card--vertical.card--small
18
+ .card
19
+ &__aside--grey
20
+ background-color lighten($geolocation , 90%)
21
+ &--distance
22
+ &.card--vertical.card--small
23
+ .card
24
+ &__aside--grey
25
+ background-color lighten($distance , 90%)
26
+ &--stores
27
+ &.card--vertical.card--small
28
+ .card
29
+ &__aside--grey
30
+ background-color lighten($search , 90%)
31
+ &--address
32
+ &.card--vertical.card--small
33
+ .card
34
+ &__aside--grey
35
+ background-color lighten($address, 90%)
36
+ &--map
37
+ &.card--vertical.card--small
38
+ .card
39
+ &__aside--grey
40
+ background-color lighten($map, 90%)
41
+ &--merchants
42
+ &.card--vertical.card--small
43
+ .card
44
+ &__aside--grey
45
+ background-color lighten($merchant, 90%)
46
+ &--traffic
47
+ &.card--vertical.card--small
48
+ .card
49
+ &__aside--grey
50
+ background-color lighten($traffic, 90%)
51
+ &--indoor_map
52
+ &.card--vertical.card--small
53
+ .card
54
+ &__aside--grey
55
+ background-color lighten($indoorMap, 90%)
56
+ &--indoor_search
57
+ &.card--vertical.card--small
58
+ .card
59
+ &__aside--grey
60
+ background-color lighten($indoorSearch, 90%)
61
+ &--indoor_distance
62
+ &.card--vertical.card--small
63
+ .card
64
+ &__aside--grey
65
+ background-color lighten($indoorDistance , 90%)
11
66
  &--unique
12
67
  display flex
13
68
  align-items center
@@ -111,7 +166,8 @@
111
166
  padding 1.4rem
112
167
  font-size $fontSizeSmall
113
168
  &--grey
114
- background-color $dark3
169
+ &:last-child
170
+ border-radius 0 0 .5rem .5rem
115
171
  &__list
116
172
  mbib(.8)
117
173
  display flex
@@ -123,9 +179,12 @@
123
179
  &__image
124
180
  sq(3)
125
181
  br()
126
- &__title
127
- font-weight 600
128
- font-size $fontSize
182
+ &__section
183
+ width 100%
184
+ &__title
185
+ font-weight 600
186
+ font-size $fontSize
187
+ margin-bottom .5rem
129
188
  &__footer
130
189
  color $dark40
131
190
  &--small
@@ -164,7 +223,7 @@
164
223
  background $distance10
165
224
  &.card--stores
166
225
  .card__content
167
- background $stores10
226
+ background $search10
168
227
  &.card--address
169
228
  .card__content
170
229
  background $address10
@@ -196,7 +255,7 @@
196
255
  .card--distance &
197
256
  background $distance
198
257
  .card--stores &
199
- background $stores
258
+ background $search
200
259
  .card--address &
201
260
  background $address
202
261
  .card--map &
@@ -10,7 +10,7 @@ it('renders a Card component ', () => {
10
10
  <Card.Header>header</Card.Header>
11
11
  <Card.Body>body</Card.Body>
12
12
  <Card.Footer>footer</Card.Footer>
13
- <Card.Aside>aside</Card.Aside>
13
+ <Card.Aside product={{ id: 'LOCALITIES', name: 'aside' }}>aside</Card.Aside>
14
14
  </Card>
15
15
  );
16
16
  expect(getByTestId('card')).toHaveClass('card');
@@ -18,7 +18,7 @@ it('renders a Card component ', () => {
18
18
  expect(screen.getByText('header')).toHaveClass('card__header');
19
19
  expect(screen.getByText('body')).toHaveClass('card__body');
20
20
  expect(screen.getByText('footer')).toHaveClass('card__footer');
21
- expect(screen.getByText('aside')).toHaveClass('card__aside');
21
+ expect(screen.getByText('aside')).toHaveClass('card__aside__list__item__title');
22
22
  });
23
23
 
24
24
  it('renders a Card component in list ', () => {
@@ -27,7 +27,7 @@ it('renders a Card component in list ', () => {
27
27
  <Card.Header>header</Card.Header>
28
28
  <Card.Body>body</Card.Body>
29
29
  <Card.Footer>footer</Card.Footer>
30
- <Card.Aside>aside</Card.Aside>
30
+ <Card.Aside product={{ id: 'LOCALITIES', name: 'Localities' }}>aside</Card.Aside>
31
31
  </Card>
32
32
  );
33
33
  expect(container.firstChild).toHaveClass('card--list');
@@ -66,7 +66,7 @@
66
66
  background-color $distance
67
67
  &--STORES
68
68
  &--stores
69
- background-color $stores
69
+ background-color $search
70
70
  &--ADDRESS
71
71
  &--address
72
72
  background-color $address
@@ -185,7 +185,7 @@
185
185
  &--distance
186
186
  tooltipProduct($distance)
187
187
  &--stores
188
- tooltipProduct($stores)
188
+ tooltipProduct($search)
189
189
  &--address
190
190
  tooltipProduct($address)
191
191
  &--map
@@ -20,7 +20,7 @@
20
20
  &--distance
21
21
  background-color $distance
22
22
  &--stores
23
- background-color $stores
23
+ background-color $search
24
24
  &--address
25
25
  background-color $address
26
26
  &--map
@@ -341,9 +341,9 @@ $indoor10 = rgba($indoor, .1)
341
341
  $indoorDark = #77735A
342
342
 
343
343
 
344
- $indoorMapping = #B7B38B
345
- $indoorMapping10 = rgba($indoorMapping, .1)
346
- $indoorMappingDark = #918C66
344
+ $indoorMap = #B7B38B
345
+ $indoorMap10 = rgba($indoorMap, .1)
346
+ $indoorMapDark = #918C66
347
347
 
348
348
  $indoorSearch = #DBC649
349
349
  $indoorSearch10 = rgba($indoorSearch, .1)