@magicgol/polyjuice 0.7.0 → 0.7.1
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/svg/index.js +1 -0
- package/src/assets/svg/soccer-ball.js +10 -0
- package/src/components/club/button/primary-club-button/PrimaryClubButton.vue +6 -5
- package/src/components/club/button/secondary-club-button/SecondaryClubButton.vue +5 -6
- package/src/components/loader/soccer-ball/SoccerBall.stories.js +19 -0
- package/src/components/loader/soccer-ball/SoccerBall.vue +58 -0
- package/src/svg/soccer-ball.svg +1 -0
package/package.json
CHANGED
package/src/assets/svg/index.js
CHANGED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
var icon = require('vue-svgicon')
|
|
3
|
+
icon.register({
|
|
4
|
+
'soccer-ball': {
|
|
5
|
+
width: 16,
|
|
6
|
+
height: 16,
|
|
7
|
+
viewBox: '0 0 480 480',
|
|
8
|
+
data: '<path pid="0" d="M240 0C107.453 0 0 107.453 0 240s107.453 240 240 240 240-107.453 240-240C479.852 107.516 372.484.148 240 0zm8.566 69.191L332 35.84a224.492 224.492 0 0127.414 14.777l.219.137a225.29 225.29 0 0124.695 18.11l.672.585a227.354 227.354 0 0110.223 9.262c.418.41.855.8 1.273 1.219a234.39 234.39 0 0110.09 10.484c.27.305.527.625.797.93 2.855 3.199 5.601 6.511 8.265 9.879.641.8 1.282 1.601 1.903 2.402 2.89 3.742 5.687 7.55 8.328 11.48l-16.633 70.704-81.832 27.28-78.828-63.073zm-186.125 34.48c.621-.8 1.254-1.6 1.895-2.398a224.935 224.935 0 018.168-9.777c.305-.336.586-.68.887-1.016A217.481 217.481 0 0183.44 80c.399-.39.797-.8 1.215-1.16a228.569 228.569 0 0110.137-9.207l.8-.672a226.15 226.15 0 0124.462-18l.312-.2A224.738 224.738 0 01147.617 36l83.817 33.191v80.801l-78.832 63.063-81.832-27.23-16.633-70.704a233.682 233.682 0 018.304-11.45zm-9.64 259.09a222.72 222.72 0 01-6.746-10.96l-.52-.899a210.277 210.277 0 01-6.055-11.293l-.066-.12a222.882 222.882 0 01-10.535-24.802v-.078c-1.422-4-2.719-8.097-3.918-12.218l-.434-1.52a220.618 220.618 0 01-2.984-11.742c-.078-.387-.176-.754-.254-1.137a222.66 222.66 0 01-4.227-27.097l48.84-58.606 81.266 27.086 23.586 94.336L132 375.273zm240.472 94.782c-4 .992-8.105 1.848-12.21 2.617-.575.113-1.16.207-1.735.313-3.496.625-7.031 1.16-10.574 1.597-.945.121-1.883.25-2.824.364-3.29.382-6.61.671-9.938.91-1.047.07-2.082.176-3.129.242-4.254.262-8.543.414-12.863.414-3.957 0-7.89-.105-11.8-.313-.473 0-.927-.078-1.4-.113-3.48-.199-6.945-.46-10.402-.797l-.398-.074a227.948 227.948 0 01-22.559-3.598l-47.32-74.09 38.145-50.863h111.468l38.77 51.2zM458.77 288c-.082.383-.176.754-.258 1.137a230.481 230.481 0 01-2.985 11.742l-.43 1.52a224.8 224.8 0 01-3.921 12.218v.078a222.149 222.149 0 01-10.535 24.801l-.067.121a221.793 221.793 0 01-6.054 11.293l-.52.899a198.32 198.32 0 01-6.734 10.945l-78.93 12.445-39.023-51.52 23.574-94.312 81.265-27.086 48.84 58.606A222.142 222.142 0 01458.77 288zm0 0"/>'
|
|
9
|
+
}
|
|
10
|
+
})
|
|
@@ -6,11 +6,7 @@
|
|
|
6
6
|
:disabled="disabled"
|
|
7
7
|
@click="$emit('click')"
|
|
8
8
|
>
|
|
9
|
-
<svgicon
|
|
10
|
-
name="star-c"
|
|
11
|
-
color="#fff"
|
|
12
|
-
style="height: 16px"
|
|
13
|
-
></svgicon>
|
|
9
|
+
<svgicon name="star-c"></svgicon>
|
|
14
10
|
<div class="ml-2">
|
|
15
11
|
<slot></slot>
|
|
16
12
|
</div>
|
|
@@ -58,6 +54,11 @@ export default {
|
|
|
58
54
|
font-weight: 500;
|
|
59
55
|
outline: none;
|
|
60
56
|
|
|
57
|
+
svg {
|
|
58
|
+
fill: #fff;
|
|
59
|
+
height: 1rem;
|
|
60
|
+
}
|
|
61
|
+
|
|
61
62
|
&--disabled {
|
|
62
63
|
opacity: 0.6 !important;
|
|
63
64
|
cursor: not-allowed !important;
|
|
@@ -1,16 +1,13 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<button
|
|
3
|
-
class="d-block bg-white w-100
|
|
3
|
+
class="d-block bg-white w-100 rounded text-uppercase text-center text-decoration-none"
|
|
4
4
|
type="button"
|
|
5
5
|
:class="classes"
|
|
6
6
|
:disabled="disabled"
|
|
7
7
|
@click="$emit('click')"
|
|
8
8
|
>
|
|
9
|
-
<div class="d-
|
|
10
|
-
<svgicon
|
|
11
|
-
name="star-stroke-p"
|
|
12
|
-
style="height: 20px"
|
|
13
|
-
></svgicon>
|
|
9
|
+
<div class="d-flex justify-content-center align-items-center">
|
|
10
|
+
<svgicon name="star-stroke-p"></svgicon>
|
|
14
11
|
<div class="ml-2"><slot></slot></div>
|
|
15
12
|
</div>
|
|
16
13
|
</button>
|
|
@@ -56,10 +53,12 @@ export default {
|
|
|
56
53
|
font-size: 1rem;
|
|
57
54
|
font-family: 'Ubuntu', sans-serif;
|
|
58
55
|
font-weight: 500;
|
|
56
|
+
height: 2.5rem;
|
|
59
57
|
outline: none;
|
|
60
58
|
|
|
61
59
|
svg {
|
|
62
60
|
fill: map-get($palette, 'expertClub');
|
|
61
|
+
height: 1.25rem;
|
|
63
62
|
}
|
|
64
63
|
|
|
65
64
|
&--disabled {
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import MgSoccerBall from './SoccerBall.vue';
|
|
2
|
+
|
|
3
|
+
// More on default export: https://storybook.js.org/docs/vue/writing-stories/introduction#default-export
|
|
4
|
+
export default {
|
|
5
|
+
title: 'Loader/Soccer Ball',
|
|
6
|
+
component: MgSoccerBall,
|
|
7
|
+
// More on argTypes: https://storybook.js.org/docs/vue/api/argtypes
|
|
8
|
+
};
|
|
9
|
+
|
|
10
|
+
// More on component templates: https://storybook.js.org/docs/vue/writing-stories/introduction#using-args
|
|
11
|
+
const Template = (args, { argTypes }) => ({
|
|
12
|
+
props: Object.keys(argTypes),
|
|
13
|
+
components: { MgSoccerBall },
|
|
14
|
+
template: `<mg-soccer-ball></mg-soccer-ball>`,
|
|
15
|
+
});
|
|
16
|
+
|
|
17
|
+
export const Default = Template.bind({});
|
|
18
|
+
// More on args: https://storybook.js.org/docs/vue/writing-stories/args
|
|
19
|
+
Default.args = {};
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div
|
|
3
|
+
class="d-flex justify-content-center"
|
|
4
|
+
:class="classes"
|
|
5
|
+
>
|
|
6
|
+
<div>
|
|
7
|
+
<div class="d-inline-block">
|
|
8
|
+
<svgicon name="soccer-ball" class="h-100"></svgicon>
|
|
9
|
+
</div>
|
|
10
|
+
</div>
|
|
11
|
+
</div>
|
|
12
|
+
</template>
|
|
13
|
+
|
|
14
|
+
<script>
|
|
15
|
+
export default {
|
|
16
|
+
name: 'mg-soccer-ball',
|
|
17
|
+
|
|
18
|
+
computed: {
|
|
19
|
+
classes() {
|
|
20
|
+
return {
|
|
21
|
+
'mg-soccer-ball': true,
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
};
|
|
26
|
+
</script>
|
|
27
|
+
|
|
28
|
+
<style scoped lang="scss">
|
|
29
|
+
.mg-soccer-ball {
|
|
30
|
+
height: 75px;
|
|
31
|
+
|
|
32
|
+
> div {
|
|
33
|
+
animation: bounce 0.5s;
|
|
34
|
+
animation-direction: alternate;
|
|
35
|
+
animation-timing-function: cubic-bezier(.5, 0.05, 1, .5);
|
|
36
|
+
animation-iteration-count: infinite;
|
|
37
|
+
|
|
38
|
+
> div {
|
|
39
|
+
height: 40px;
|
|
40
|
+
animation: rotation 2s linear infinite;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
svg {
|
|
45
|
+
height: 100%;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
@keyframes rotation {
|
|
50
|
+
from { transform: rotate(0deg); }
|
|
51
|
+
to { transform: rotate(359deg); }
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
@keyframes bounce {
|
|
55
|
+
from { transform: translate3d(0, 0, 0); }
|
|
56
|
+
to { transform: translate3d(0, 50px, 0); }
|
|
57
|
+
}
|
|
58
|
+
</style>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg viewBox="0 0 480 480" xmlns="http://www.w3.org/2000/svg"><path d="m240 0c-132.546875 0-240 107.453125-240 240s107.453125 240 240 240 240-107.453125 240-240c-.148438-132.484375-107.515625-239.851562-240-240zm8.566406 69.191406 83.433594-33.351562c9.46875 4.285156 18.628906 9.222656 27.414062 14.777344l.21875.136718c8.632813 5.46875 16.882813 11.519532 24.695313 18.109375l.671875.585938c3.503906 2.984375 6.910156 6.074219 10.222656 9.261719.417969.410156.855469.800781 1.273438 1.21875 3.472656 3.390624 6.835937 6.886718 10.089844 10.484374.269531.304688.527343.625.796874.929688 2.855469 3.199219 5.601563 6.511719 8.265626 9.878906.640624.800782 1.28125 1.601563 1.902343 2.402344 2.890625 3.742188 5.6875 7.550781 8.328125 11.480469l-16.632812 70.703125-81.832032 27.28125-78.828124-63.074219zm-186.125 34.480469c.621094-.800781 1.253906-1.601563 1.894532-2.398437 2.632812-3.339844 5.355468-6.597657 8.167968-9.777344.304688-.335938.585938-.679688.886719-1.015625 3.234375-3.605469 6.582031-7.097657 10.050781-10.480469.398438-.390625.796875-.800781 1.214844-1.160156 3.285156-3.167969 6.664062-6.238282 10.136719-9.207032l.800781-.671874c7.742188-6.542969 15.914062-12.554688 24.460938-18l.3125-.199219c8.734374-5.542969 17.835937-10.472657 27.25-14.761719l83.816406 33.191406v80.800782l-78.832032 63.0625-81.832031-27.230469-16.632812-70.703125c2.664062-3.921875 5.429687-7.722656 8.304687-11.449219zm-9.640625 259.089844c-2.351562-3.585938-4.601562-7.238281-6.746093-10.960938l-.519532-.898437c-2.132812-3.703125-4.152344-7.46875-6.054687-11.292969l-.066407-.121094c-4.007812-8.046875-7.527343-16.328125-10.535156-24.800781v-.078125c-1.421875-4-2.71875-8.097656-3.917968-12.21875l-.433594-1.519531c-1.097656-3.871094-2.09375-7.785156-2.984375-11.742188-.078125-.386718-.175781-.753906-.253907-1.136718-1.964843-8.9375-3.375-17.984376-4.226562-27.097657l48.839844-58.605469 81.265625 27.085938 23.585937 94.335938-38.753906 51.5625zm240.472657 94.78125c-4 .992187-8.105469 1.847656-12.210938 2.617187-.574219.113282-1.160156.207032-1.734375.3125-3.496094.625-7.03125 1.160156-10.574219 1.597656-.945312.121094-1.882812.25-2.824218.363282-3.289063.382812-6.609376.671875-9.9375.910156-1.046876.070312-2.082032.175781-3.128907.242188-4.253906.261718-8.542969.414062-12.863281.414062-3.957031 0-7.890625-.105469-11.800781-.3125-.472657 0-.925781-.078125-1.398438-.113281-3.480469-.199219-6.945312-.460938-10.402343-.796875l-.398438-.074219c-7.574219-.820313-15.105469-2.023437-22.558594-3.597656l-47.320312-74.089844 38.144531-50.863281h111.46875l38.769531 51.199218zm165.496093-169.542969c-.082031.382812-.175781.753906-.257812 1.136719-.894531 3.953125-1.890625 7.867187-2.984375 11.742187l-.429688 1.519532c-1.203125 4.121093-2.496094 8.203124-3.921875 12.21875v.078124c-3.007812 8.472657-6.523437 16.753907-10.535156 24.800782l-.066406.121094c-1.914063 3.828124-3.929688 7.59375-6.054688 11.292968l-.519531.898438c-2.132812 3.734375-4.378906 7.378906-6.734375 10.945312l-78.929687 12.445313-39.023438-51.519531 23.574219-94.3125 81.265625-27.085938 48.839844 58.605469c-.847657 9.117187-2.257813 18.171875-4.222657 27.113281zm0 0"/></svg>
|