@magicgol/polyjuice 0.3.0 → 0.4.0
Sign up to get free protection for your applications and to get access to all the features.
- package/package.json +1 -1
- package/src/assets/palette.scss +7 -0
- package/src/components/card/vertical-card/VCard.stories.js +2 -2
- package/src/components/form/primary-button/PrimaryButton.stories.js +1 -1
- package/src/components/form/secondary-button/SecondaryButton.stories.js +1 -1
- package/src/components/form/tertiary-button/TertiaryButton.stories.js +1 -1
- package/src/documentation/Alert.stories.mdx +21 -0
- package/src/documentation/Brand.stories.mdx +10 -0
- package/src/documentation/Footballer.stories.mdx +22 -0
package/package.json
CHANGED
package/src/assets/palette.scss
CHANGED
@@ -2,7 +2,7 @@ import MgVCard from './VCard.vue';
|
|
2
2
|
|
3
3
|
// More on default export: https://storybook.js.org/docs/vue/writing-stories/introduction#default-export
|
4
4
|
export default {
|
5
|
-
title: '
|
5
|
+
title: 'Card/VCard',
|
6
6
|
component: MgVCard,
|
7
7
|
// More on argTypes: https://storybook.js.org/docs/vue/api/argtypes
|
8
8
|
argTypes: {
|
@@ -25,7 +25,7 @@ export default {
|
|
25
25
|
const Template = (args, { argTypes }) => ({
|
26
26
|
props: Object.keys(argTypes),
|
27
27
|
components: { MgVCard },
|
28
|
-
template: `<mg-v-card @click="
|
28
|
+
template: `<mg-v-card @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-v-card>`,
|
29
29
|
});
|
30
30
|
|
31
31
|
export const Default = Template.bind({});
|
@@ -35,7 +35,7 @@ export default {
|
|
35
35
|
const Template = (args, { argTypes }) => ({
|
36
36
|
props: Object.keys(argTypes),
|
37
37
|
components: { MgPrimaryButton },
|
38
|
-
template: `<mg-primary-button @click="
|
38
|
+
template: `<mg-primary-button @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-primary-button>`,
|
39
39
|
});
|
40
40
|
|
41
41
|
export const Default = Template.bind({});
|
@@ -25,7 +25,7 @@ export default {
|
|
25
25
|
const Template = (args, { argTypes }) => ({
|
26
26
|
props: Object.keys(argTypes),
|
27
27
|
components: { MgSecondaryButton },
|
28
|
-
template: `<mg-secondary-button @click="
|
28
|
+
template: `<mg-secondary-button @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-secondary-button>`,
|
29
29
|
});
|
30
30
|
|
31
31
|
export const Default = Template.bind({});
|
@@ -25,7 +25,7 @@ export default {
|
|
25
25
|
const Template = (args, { argTypes }) => ({
|
26
26
|
props: Object.keys(argTypes),
|
27
27
|
components: { MgTertiaryButton },
|
28
|
-
template: `<mg-tertiary-button @click="
|
28
|
+
template: `<mg-tertiary-button @click="$emit('click')" v-bind="$props"><template v-if="${'default' in args}" v-slot>${args.default}</template></mg-tertiary-button>`,
|
29
29
|
});
|
30
30
|
|
31
31
|
export const Default = Template.bind({});
|
@@ -0,0 +1,21 @@
|
|
1
|
+
import {ColorItem, ColorPalette, Meta} from '@storybook/addon-docs';
|
2
|
+
|
3
|
+
<Meta title="Colors/Alert" />
|
4
|
+
|
5
|
+
<ColorPalette>
|
6
|
+
<ColorItem
|
7
|
+
title="Warning"
|
8
|
+
subtitle="Used for error messages"
|
9
|
+
colors={{Persimmon: '#ff614c'}}
|
10
|
+
/>
|
11
|
+
<ColorItem
|
12
|
+
title="Success"
|
13
|
+
subtitle="Used for success messages"
|
14
|
+
colors={{'Sea Green': '#349B50'}}
|
15
|
+
/>
|
16
|
+
<ColorItem
|
17
|
+
title="Info"
|
18
|
+
subtitle="Used for info messages"
|
19
|
+
colors={{'Congress Blue': '#004781'}}
|
20
|
+
/>
|
21
|
+
</ColorPalette>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import {ColorItem, ColorPalette, Meta} from '@storybook/addon-docs';
|
2
|
+
|
3
|
+
<Meta title="Colors/Footballer" />
|
4
|
+
|
5
|
+
<ColorPalette>
|
6
|
+
<ColorItem
|
7
|
+
title="Goalkeeper"
|
8
|
+
colors={{Supernova: '#ffc700'}}
|
9
|
+
/>
|
10
|
+
<ColorItem
|
11
|
+
title="Defender"
|
12
|
+
colors={{Harlequin: '#3de000'}}
|
13
|
+
/>
|
14
|
+
<ColorItem
|
15
|
+
title="Midfielder"
|
16
|
+
colors={{Denim: '#116dd8'}}
|
17
|
+
/>
|
18
|
+
<ColorItem
|
19
|
+
title="Forward"
|
20
|
+
colors={{'Torch Red': '#f30026'}}
|
21
|
+
/>
|
22
|
+
</ColorPalette>
|