toggle-components-library 1.36.8 → 1.36.9-beta.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/dist/toggle-components-library.common.js +1714 -1228
- 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 +1714 -1228
- package/dist/toggle-components-library.umd.js.map +1 -1
- package/dist/toggle-components-library.umd.min.js +76 -72
- package/dist/toggle-components-library.umd.min.js.map +1 -1
- package/package.json +1 -1
- package/src/components/badges/ToggleLogoBadge.vue +34 -0
- package/src/index.js +2 -0
- package/src/sass/includes/_as_badges.scss +20 -0
package/package.json
CHANGED
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div id="badge-container" class="toggle-logo-badge">
|
|
3
|
+
<img
|
|
4
|
+
:src="logo.src"
|
|
5
|
+
:alt="logo.alt"
|
|
6
|
+
class="toggle-logo-badge-logo"
|
|
7
|
+
>
|
|
8
|
+
</div>
|
|
9
|
+
|
|
10
|
+
</template>
|
|
11
|
+
|
|
12
|
+
<script>
|
|
13
|
+
|
|
14
|
+
export default {
|
|
15
|
+
name: 'ToggleLogoBadge',
|
|
16
|
+
props: {
|
|
17
|
+
logo: {
|
|
18
|
+
type: Object,
|
|
19
|
+
required: true,
|
|
20
|
+
},
|
|
21
|
+
colour: {
|
|
22
|
+
type: String,
|
|
23
|
+
required: true
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
};
|
|
27
|
+
</script>
|
|
28
|
+
|
|
29
|
+
<style scoped>
|
|
30
|
+
#badge-container {
|
|
31
|
+
background-color: v-bind('colour');
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
</style>
|
package/src/index.js
CHANGED
|
@@ -43,6 +43,7 @@ import ToggleTableColumn from './components/tables/ToggleTableColumn.vue';
|
|
|
43
43
|
import ToggleBadge from './components/badges/ToggleBadge.vue';
|
|
44
44
|
import ToggleCalculateBadge from './components/badges/ToggleCalculateBadge.vue';
|
|
45
45
|
import TogglePodiumBadge from './components/badges/TogglePodiumBadge.vue';
|
|
46
|
+
import ToggleLogoBadge from './components/badges/ToggleLogoBadge.vue';
|
|
46
47
|
|
|
47
48
|
import ToggleBreadCrumb from './components/breadcrumb/ToggleBreadCrumb.vue';
|
|
48
49
|
import ToggleSideNavItem from './components/navs/sidenav/ToggleSideNavItem.vue';
|
|
@@ -101,6 +102,7 @@ const Components = {
|
|
|
101
102
|
ToggleBadge,
|
|
102
103
|
ToggleCalculateBadge,
|
|
103
104
|
TogglePodiumBadge,
|
|
105
|
+
ToggleLogoBadge,
|
|
104
106
|
ToggleTableColumn,
|
|
105
107
|
ToggleInputText,
|
|
106
108
|
ToggleInputEditableText,
|
|
@@ -228,4 +228,24 @@
|
|
|
228
228
|
width: 22px;
|
|
229
229
|
margin-right: 15px;
|
|
230
230
|
}
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
.toggle-logo-badge {
|
|
234
|
+
border: 0;
|
|
235
|
+
font-family: $toggle-font-family;
|
|
236
|
+
width: fit-content;
|
|
237
|
+
font-weight: bold;
|
|
238
|
+
display: grid;
|
|
239
|
+
padding: 0.3rem;
|
|
240
|
+
border-radius: 0.6rem;
|
|
241
|
+
align-items: center;
|
|
242
|
+
justify-content: center;
|
|
243
|
+
background-color: $booster-fulfilment-colour-med;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
.toggle-logo-badge-logo{
|
|
247
|
+
width: auto;
|
|
248
|
+
height: 1.1rem;
|
|
249
|
+
margin-left: 0.6rem;
|
|
250
|
+
margin-right: 0.9rem;
|
|
231
251
|
}
|