toggle-components-library 1.32.0-beta.2 → 1.32.0-beta.3
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/dist/toggle-components-library.common.js +76 -72
- package/dist/toggle-components-library.common.js.map +1 -1
- package/dist/toggle-components-library.css +1 -1
- package/dist/toggle-components-library.umd.js +76 -72
- package/dist/toggle-components-library.umd.js.map +1 -1
- package/dist/toggle-components-library.umd.min.js +1 -1
- package/dist/toggle-components-library.umd.min.js.map +1 -1
- package/package-lock.json +1 -1
- package/package.json +1 -1
- package/src/components/badges/ToggleBadge.vue +5 -1
- package/src/sass/includes/_as_badges.scss +83 -0
package/package-lock.json
CHANGED
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<span :class="[ 'toggle-badge', badgeStyle]"><slot></slot></span>
|
|
2
|
+
<span :class="[ 'toggle-badge', badgeStyle, badgeType ]"><slot></slot></span>
|
|
3
3
|
</template>
|
|
4
4
|
|
|
5
5
|
<script>
|
|
@@ -14,6 +14,10 @@ export default {
|
|
|
14
14
|
badgeStyle:{
|
|
15
15
|
type:String,
|
|
16
16
|
default:'neutral'
|
|
17
|
+
},
|
|
18
|
+
badgeType: {
|
|
19
|
+
type:String,
|
|
20
|
+
default:''
|
|
17
21
|
}
|
|
18
22
|
},
|
|
19
23
|
computed: {
|
|
@@ -32,6 +32,89 @@
|
|
|
32
32
|
&.empty {
|
|
33
33
|
background-color: $toggle-placeholder-grey;
|
|
34
34
|
}
|
|
35
|
+
|
|
36
|
+
&.rounded {
|
|
37
|
+
border-radius: 50px;
|
|
38
|
+
padding: 5px 11px;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.toggle-podium-badge {
|
|
43
|
+
@include toggle-global-font-config;
|
|
44
|
+
display: inline-flex;
|
|
45
|
+
justify-content: center;
|
|
46
|
+
align-items: center;
|
|
47
|
+
width: fit-content;
|
|
48
|
+
border-radius: 20px;
|
|
49
|
+
color: white;
|
|
50
|
+
font-size: $toggle-font-size-regular;
|
|
51
|
+
font-weight: 900;
|
|
52
|
+
padding: 5px 18px 5px 10px;
|
|
53
|
+
|
|
54
|
+
&.first {
|
|
55
|
+
background-color: #efd028;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
&.second{
|
|
59
|
+
background-color: #adb4c9;
|
|
60
|
+
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
&.third {
|
|
64
|
+
background-color: #d99a0c;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.podium-number {
|
|
70
|
+
display: flex;
|
|
71
|
+
justify-content: center;
|
|
72
|
+
align-items: center;
|
|
73
|
+
opacity: 1;
|
|
74
|
+
width: 26px;
|
|
75
|
+
height: 26px;
|
|
76
|
+
border-radius: 50%;
|
|
77
|
+
text-align: center;
|
|
78
|
+
margin-right: 20px;
|
|
79
|
+
margin-left: -4px;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.first .podium-number{
|
|
83
|
+
background: transparent linear-gradient(132deg, #FFD700 0%, #F0E4A2 100%) 0% 0% no-repeat padding-box;
|
|
84
|
+
color: #CBAF15;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.second .podium-number{
|
|
88
|
+
background: transparent linear-gradient(132deg, #C6C9D5 0%, #DEE2EF 100%) 0% 0% no-repeat padding-box;
|
|
89
|
+
color: #8C92A3;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.third .podium-number{
|
|
93
|
+
background: transparent linear-gradient(132deg, #E8B33C 0%, #F8CE6E 100%) 0% 0% no-repeat padding-box;
|
|
94
|
+
color: #C18A0E;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.toggle-calculate-badge{
|
|
98
|
+
display: inline-flex;
|
|
99
|
+
justify-content: space-between;
|
|
100
|
+
align-items: center;
|
|
101
|
+
width: fit-content;
|
|
102
|
+
background-color: #E4EBED;
|
|
103
|
+
color: #6D90B4;
|
|
104
|
+
border-radius: 50px;
|
|
105
|
+
padding: 10px 20px 10px 15px;
|
|
106
|
+
font-family: $toggle-font-family;
|
|
107
|
+
font-size: 0.8rem;
|
|
108
|
+
font-weight:lighter;
|
|
109
|
+
|
|
110
|
+
.clock-icon {
|
|
111
|
+
background-image: url('../assets/icons/clock-solid.svg');
|
|
112
|
+
background-repeat:no-repeat;
|
|
113
|
+
background-size:contain;
|
|
114
|
+
height: 22px;
|
|
115
|
+
width: 22px;
|
|
116
|
+
margin-right: 15px;
|
|
117
|
+
}
|
|
35
118
|
}
|
|
36
119
|
|
|
37
120
|
.toggle-podium-badge {
|