@woosmap/ui 3.159.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 +1 -1
- package/src/components/Card/Card.stories.js +1 -1
- package/src/components/Card/Card.styl +59 -3
- package/src/components/Card/Card.test.js +3 -3
- package/src/components/Label/Label.styl +1 -1
- package/src/components/Tooltip/Tooltip.styl +1 -1
- package/src/styles/console/badge.styl +1 -1
- package/src/styles/website/colors.styl +3 -3
package/package.json
CHANGED
|
@@ -14,7 +14,7 @@ const Story = {
|
|
|
14
14
|
export default Story;
|
|
15
15
|
const renderAsideContent = () => (
|
|
16
16
|
<>
|
|
17
|
-
<Card.Aside mode="
|
|
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
|
-
|
|
169
|
+
&:last-child
|
|
170
|
+
border-radius 0 0 .5rem .5rem
|
|
115
171
|
&__list
|
|
116
172
|
mbib(.8)
|
|
117
173
|
display flex
|
|
@@ -167,7 +223,7 @@
|
|
|
167
223
|
background $distance10
|
|
168
224
|
&.card--stores
|
|
169
225
|
.card__content
|
|
170
|
-
background $
|
|
226
|
+
background $search10
|
|
171
227
|
&.card--address
|
|
172
228
|
.card__content
|
|
173
229
|
background $address10
|
|
@@ -199,7 +255,7 @@
|
|
|
199
255
|
.card--distance &
|
|
200
256
|
background $distance
|
|
201
257
|
.card--stores &
|
|
202
|
-
background $
|
|
258
|
+
background $search
|
|
203
259
|
.card--address &
|
|
204
260
|
background $address
|
|
205
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('
|
|
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');
|
|
@@ -341,9 +341,9 @@ $indoor10 = rgba($indoor, .1)
|
|
|
341
341
|
$indoorDark = #77735A
|
|
342
342
|
|
|
343
343
|
|
|
344
|
-
$
|
|
345
|
-
$
|
|
346
|
-
$
|
|
344
|
+
$indoorMap = #B7B38B
|
|
345
|
+
$indoorMap10 = rgba($indoorMap, .1)
|
|
346
|
+
$indoorMapDark = #918C66
|
|
347
347
|
|
|
348
348
|
$indoorSearch = #DBC649
|
|
349
349
|
$indoorSearch10 = rgba($indoorSearch, .1)
|