@magicgol/polyjuice 0.22.2 → 0.23.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/assets/palette.scss +4 -4
- package/src/components/card/vertical-card/VCard.stories.js +9 -1
- package/src/components/card/vertical-card/VCard.vue +7 -1
- package/src/components/footballer/horizontal-footballer/HFootballer.stories.js +9 -0
- package/src/components/footballer/horizontal-footballer/HFootballer.vue +10 -0
- package/src/documentation/Footballer.stories.mdx +4 -4
package/package.json
CHANGED
package/src/assets/palette.scss
CHANGED
|
@@ -11,10 +11,10 @@ $palette: (
|
|
|
11
11
|
'success': #349B50,
|
|
12
12
|
'info': #004781,
|
|
13
13
|
// FOOTBALLERS
|
|
14
|
-
'goalkeeper': #
|
|
15
|
-
'defender': #
|
|
16
|
-
'midfielder': #
|
|
17
|
-
'forward': #
|
|
14
|
+
'goalkeeper': #fcd777,
|
|
15
|
+
'defender': #89f4a1,
|
|
16
|
+
'midfielder': #8fc6f9,
|
|
17
|
+
'forward': #f58383,
|
|
18
18
|
// LIVE
|
|
19
19
|
'online': #00b669,
|
|
20
20
|
'offline': #ea7203,
|
|
@@ -20,7 +20,7 @@ export default {
|
|
|
20
20
|
},
|
|
21
21
|
theme: {
|
|
22
22
|
control: { type: 'select' },
|
|
23
|
-
options: [null, 'club', 'rating', 'goalkeeper', 'defender', 'midfielder', 'forward'],
|
|
23
|
+
options: [null, 'club', 'rating', 'goalkeeper', 'defender', 'midfielder', 'forward', 'transparent'],
|
|
24
24
|
defaultValue: null
|
|
25
25
|
},
|
|
26
26
|
footer: {
|
|
@@ -108,3 +108,11 @@ Forward.args = {
|
|
|
108
108
|
default: '<div>This is a vertical card.</div><div>What do you think about?</div>',
|
|
109
109
|
footer: '<div>The footer content goes here</div>'
|
|
110
110
|
};
|
|
111
|
+
|
|
112
|
+
export const Transparent = Template.bind({});
|
|
113
|
+
// More on args: https://storybook.js.org/docs/vue/writing-stories/args
|
|
114
|
+
Transparent.args = {
|
|
115
|
+
theme: 'transparent',
|
|
116
|
+
default: '<div>This is a vertical card.</div><div>What do you think about?</div>',
|
|
117
|
+
footer: '<div>The footer content goes here</div>'
|
|
118
|
+
};
|
|
@@ -25,7 +25,7 @@ export default {
|
|
|
25
25
|
type: String,
|
|
26
26
|
default: null,
|
|
27
27
|
validator: function (value) {
|
|
28
|
-
return ['club', 'rating', 'goalkeeper', 'defender', 'midfielder', 'forward'].indexOf(value) !== -1;
|
|
28
|
+
return ['club', 'rating', 'goalkeeper', 'defender', 'midfielder', 'forward', 'transparent'].indexOf(value) !== -1;
|
|
29
29
|
},
|
|
30
30
|
}
|
|
31
31
|
},
|
|
@@ -40,6 +40,7 @@ export default {
|
|
|
40
40
|
'mg-v-card--theme-defender': this.theme === 'defender',
|
|
41
41
|
'mg-v-card--theme-midfielder': this.theme === 'midfielder',
|
|
42
42
|
'mg-v-card--theme-forward': this.theme === 'forward',
|
|
43
|
+
'mg-v-card--theme-transparent': this.theme === 'transparent',
|
|
43
44
|
};
|
|
44
45
|
},
|
|
45
46
|
footerVisibility() {
|
|
@@ -88,6 +89,11 @@ export default {
|
|
|
88
89
|
&-forward {
|
|
89
90
|
background-color: map-get($palette, 'forward');
|
|
90
91
|
}
|
|
92
|
+
|
|
93
|
+
&-transparent {
|
|
94
|
+
background: rgba(255, 255, 255, 0.95) !important;
|
|
95
|
+
box-shadow: none;
|
|
96
|
+
}
|
|
91
97
|
}
|
|
92
98
|
|
|
93
99
|
&-footer {
|
|
@@ -34,3 +34,12 @@ export const Empty = Template.bind({});
|
|
|
34
34
|
Empty.args = {
|
|
35
35
|
role: null
|
|
36
36
|
};
|
|
37
|
+
|
|
38
|
+
export const Disabled = Template.bind({});
|
|
39
|
+
// More on args: https://storybook.js.org/docs/vue/writing-stories/args
|
|
40
|
+
Disabled.args = {
|
|
41
|
+
disabled: true,
|
|
42
|
+
role: 'A',
|
|
43
|
+
firstname: 'Paulo',
|
|
44
|
+
lastname: 'Dybala',
|
|
45
|
+
};
|
|
@@ -40,6 +40,10 @@ export default {
|
|
|
40
40
|
type: Boolean,
|
|
41
41
|
default: false,
|
|
42
42
|
},
|
|
43
|
+
disabled: {
|
|
44
|
+
type: Boolean,
|
|
45
|
+
default: false,
|
|
46
|
+
},
|
|
43
47
|
role: {
|
|
44
48
|
type: String,
|
|
45
49
|
default: null,
|
|
@@ -61,6 +65,7 @@ export default {
|
|
|
61
65
|
classes() {
|
|
62
66
|
return {
|
|
63
67
|
'mg-h-footballer': true,
|
|
68
|
+
'mg-h-footballer--disabled': this.disabled,
|
|
64
69
|
};
|
|
65
70
|
},
|
|
66
71
|
hasOnlyLastname() {
|
|
@@ -94,5 +99,10 @@ export default {
|
|
|
94
99
|
&-strong {
|
|
95
100
|
font-weight: 500;
|
|
96
101
|
}
|
|
102
|
+
|
|
103
|
+
&--disabled {
|
|
104
|
+
opacity: 0.6;
|
|
105
|
+
cursor: not-allowed !important;
|
|
106
|
+
}
|
|
97
107
|
}
|
|
98
108
|
</style>
|
|
@@ -5,18 +5,18 @@ import {ColorItem, ColorPalette, Meta} from '@storybook/addon-docs';
|
|
|
5
5
|
<ColorPalette>
|
|
6
6
|
<ColorItem
|
|
7
7
|
title="Goalkeeper"
|
|
8
|
-
colors={{'
|
|
8
|
+
colors={{'Goldenrod': '#fcd777'}}
|
|
9
9
|
/>
|
|
10
10
|
<ColorItem
|
|
11
11
|
title="Defender"
|
|
12
|
-
colors={{'
|
|
12
|
+
colors={{'Mint Green': '#89f4a1'}}
|
|
13
13
|
/>
|
|
14
14
|
<ColorItem
|
|
15
15
|
title="Midfielder"
|
|
16
|
-
colors={{'
|
|
16
|
+
colors={{'Malibu': '#8fc6f9'}}
|
|
17
17
|
/>
|
|
18
18
|
<ColorItem
|
|
19
19
|
title="Forward"
|
|
20
|
-
colors={{'
|
|
20
|
+
colors={{'Froly': '#f58383'}}
|
|
21
21
|
/>
|
|
22
22
|
</ColorPalette>
|