toggle-components-library 1.36.4-beta.8 → 1.36.4-beta.9

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "toggle-components-library",
3
- "version": "1.36.4-beta.8",
3
+ "version": "1.36.4-beta.9",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -0,0 +1 @@
1
+ <?xml version="1.0" encoding="UTF-8"?><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 121.96 118.65"><defs><style>.cls-1{fill:url(#linear-gradient);}.cls-1,.cls-2,.cls-3{stroke-width:0px;}.cls-2{fill:url(#linear-gradient-2);}.cls-3{fill:url(#linear-gradient-3);}</style><linearGradient id="linear-gradient" x1="47.1" y1="77.62" x2="121.2" y2="3.53" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#c700d4"/><stop offset=".75" stop-color="#5f1c70"/></linearGradient><linearGradient id="linear-gradient-2" x1="17.89" y1="65.91" x2="17.89" y2="30.13" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#9700bf"/><stop offset=".22" stop-color="#9401ba"/><stop offset=".45" stop-color="#8b05ae"/><stop offset=".68" stop-color="#7c0d9a"/><stop offset=".91" stop-color="#68177d"/><stop offset="1" stop-color="#5f1c70"/></linearGradient><linearGradient id="linear-gradient-3" x1="72.24" y1="113.5" x2="88.43" y2="97.32" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#9200b9"/><stop offset=".24" stop-color="#9b00c0"/><stop offset="1" stop-color="#b500d4"/></linearGradient></defs><g id="Layer_5"><path class="cls-1" d="M121.53,9.8c.64-1.77.57-3.71-.19-5.43-1.63-3.7-5.95-5.38-9.65-3.75l-33.33,24.14c-1.72.76-3.66.83-5.43.19l-18.83-6.76c-1.77-.64-3.71-.57-5.43.19-3.7,1.63-5.38,5.95-3.75,9.65l14.71,14.28c1.66,1.79.83,3.67.19,5.43l-13.43,22.89c-.79,1.91-.71,4.08.21,5.93,1.76,3.56,6.08,5.01,9.63,3.25l22.78-15.72c1.72-.76,3.61-1.96,5.43-.19l14.4,14.43c1.77.63,3.71.56,5.43-.19,3.7-1.63,5.38-5.95,3.75-9.65l-8.08-18.35c-.76-1.72-.83-3.66-.19-5.43l21.78-34.91Z"/><path class="cls-2" d="M32.03,42.74l-1.95-1.09c-1.64-.92-2.87-2.43-3.42-4.23l-.66-2.13c-.56-1.79-1.78-3.31-3.42-4.23-3.53-1.98-7.99-.72-9.97,2.81l-1.09,1.94c-.92,1.64-2.43,2.87-4.23,3.42l-2.13.66c-1.79.55-3.31,1.78-4.23,3.42-1.97,3.53-.71,7.99,2.81,9.97l1.95,1.09c1.64.92,2.87,2.43,3.42,4.23l.66,2.13c.56,1.79,1.78,3.31,3.42,4.23,3.53,1.98,7.99.72,9.97-2.81l1.09-1.95c.92-1.64,2.43-2.86,4.23-3.42l2.13-.66c1.8-.55,3.31-1.78,4.23-3.42,1.98-3.53.71-7.99-2.81-9.97Z"/><path class="cls-3" d="M89.89,101.45c-2.08-.57-3.56-2.4-3.68-4.55-.12-2.15-1.6-3.98-3.68-4.54-2.67-.73-5.43.84-6.16,3.51-.57,2.08-2.4,3.56-4.55,3.68s-3.98,1.6-4.55,3.68c-.73,2.67.84,5.43,3.51,6.16,2.08.57,3.56,2.4,3.68,4.55.13,2.14,1.61,3.98,3.68,4.54,2.67.73,5.42-.84,6.16-3.51.57-2.08,2.4-3.56,4.55-3.68,2.15-.12,3.98-1.6,4.55-3.68.73-2.67-.84-5.42-3.51-6.16Z"/></g></svg>
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <div>
3
- <h3 class="toggle-metric metric-label">{{label}}</h3>
3
+ <h3 :class="['toggle-metric metric-label', {'metric-label-atmosphere': atmosphere}]">{{label}}</h3>
4
4
  {{checkWindowSize}}
5
5
  <apexchart type="bar" :height="height" :options="chartOptions" :series="values"></apexchart>
6
6
  </div>
@@ -48,6 +48,16 @@ export default {
48
48
  categories: {
49
49
  type: [Array],
50
50
  required: true
51
+ },
52
+ /*
53
+ * Component's style
54
+ */
55
+ componentStyle: {
56
+ type: String,
57
+ default: "default",
58
+ validator: function(value) {
59
+ return ['default', 'atmosphere'].indexOf(value) !== -1
60
+ }
51
61
  }
52
62
  },
53
63
 
@@ -129,6 +139,9 @@ export default {
129
139
 
130
140
  }
131
141
  }
142
+ },
143
+ atmosphere() {
144
+ return this.componentStyle === 'atmosphere'
132
145
  }
133
146
  }
134
147
 
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <div>
3
- <h3 class="toggle-metric metric-label">{{label}}</h3>
3
+ <h3 :class="['toggle-metric metric-label', {'metric-label-atmosphere': atmosphere}]">{{label}}</h3>
4
4
  <apexchart type="pie" :height="height" :options="chartOptions" :series="values"></apexchart>
5
5
  </div>
6
6
 
@@ -47,6 +47,16 @@ export default {
47
47
  labels: {
48
48
  type: Array,
49
49
  required: true
50
+ },
51
+ /*
52
+ * Component's style
53
+ */
54
+ componentStyle: {
55
+ type: String,
56
+ default: "default",
57
+ validator: function(value) {
58
+ return ['default', 'atmosphere'].indexOf(value) !== -1
59
+ }
50
60
  }
51
61
  },
52
62
  computed: {
@@ -92,6 +102,9 @@ export default {
92
102
  enabled: false
93
103
  }
94
104
  }
105
+ },
106
+ atmosphere() {
107
+ return this.componentStyle === 'atmosphere'
95
108
  }
96
109
  }
97
110
 
@@ -997,7 +997,7 @@ $iconWidth:20px;
997
997
  border: 0;
998
998
  border-radius: 0px;
999
999
  height: 30px;
1000
- margin: 4px 5px 0px 0px;
1000
+ margin: 6px 5px 0px 0px;
1001
1001
  padding-left: 0;
1002
1002
  color: #3A4A62;
1003
1003
  font-family: $toggle-font-family;
@@ -141,7 +141,7 @@
141
141
 
142
142
  .toggle-multi-tier-sidenav-logo {
143
143
  max-width: 7rem;
144
- margin: 1rem 0 2rem 0.6rem;
144
+ margin: 2rem 0 2rem 0.6rem;
145
145
  }
146
146
 
147
147
  .toggle-multi-tier-sidenav-user-icon {
@@ -523,16 +523,13 @@
523
523
  }
524
524
  &.airship-flight-assist-icon a::before,
525
525
  &.airship-flight-assist-icon span::before {
526
- background-image: url("../assets/icons/airship-flight-assist.svg");
527
- width: 1.2rem;
528
- height: 1.2rem;
529
- padding-left: 0.3rem;
526
+ background-image: url("../assets/icons/airship-flight-assist-icon.svg");
530
527
  }
531
528
 
532
529
  &.airship-flight-assist-icon a:hover::before,
533
530
  &.airship-flight-assist-icon span:hover::before {
534
531
  animation: tilt-shake 0.4s;
535
- background-image: url("../assets/icons/airship-flight-assist.svg");
532
+ background-image: url("../assets/icons/airship-flight-assist-icon.svg");
536
533
  }
537
534
  }
538
535
  }
@@ -9,6 +9,7 @@
9
9
  cursor: pointer;
10
10
  text-align: center;
11
11
  font-family: Palatino;
12
+ line-height: 1rem;
12
13
  }
13
14
 
14
15
  .toggle-tooltip-i {
@@ -1,13 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20">
2
- <defs>
3
- <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
- <stop offset="0" stop-color="#bd38df"/>
5
- <stop offset="1" stop-color="#5f1c70"/>
6
- </linearGradient>
7
- </defs>
8
- <g id="Group_22" data-name="Group 22" transform="translate(9.062 -181.365) rotate(11)">
9
- <path id="Path_14" data-name="Path 14" d="M6.264,2.145a.982.982,0,0,1,1.838,0l.79,3.538c.1.236.192.5.525.525l2.8.056a1,1,0,0,1,0,1.838L9.706,9.181a1,1,0,0,0-.525.525L8.1,15.222a1,1,0,0,1-1.838,0L5.186,9.706a1,1,0,0,0-.525-.525L2.145,8.1a1,1,0,0,1,0-1.838l2.782.1c.347.007.424-.289.525-.525Z" transform="matrix(-0.848, -0.53, 0.53, -0.848, 42.092, 197.282)" fill="url(#linear-gradient)"/>
10
- <path id="Polygon_2" data-name="Polygon 2" d="M3.07,2.145a1,1,0,0,1,1.838,0l.12.28a1,1,0,0,0,.525.525l.28.12a1,1,0,0,1,0,1.838l-.28.12a1,1,0,0,0-.525.525l-.12.28a1,1,0,0,1-1.838,0l-.12-.28a1,1,0,0,0-.525-.525l-.28-.12a1,1,0,0,1,0-1.838l.28-.12a1,1,0,0,0,.525-.525Z" transform="matrix(0.996, -0.087, 0.087, 0.996, 27.627, 185.251)" fill="url(#linear-gradient)"/>
11
- <path id="Polygon_3" data-name="Polygon 3" d="M4.712,4.147a.684.684,0,0,1,1.35,0h0a.684.684,0,0,0,.565.565h0a.684.684,0,0,1,0,1.35h0a.684.684,0,0,0-.565.565h0a.684.684,0,0,1-1.35,0h0a.684.684,0,0,0-.565-.565h0a.684.684,0,0,1,0-1.35h0a.684.684,0,0,0,.565-.565Z" transform="matrix(0.996, -0.087, 0.087, 0.996, 35.981, 190.046)" fill="url(#linear-gradient)"/>
12
- </g>
13
- </svg>
@@ -1,13 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 20 20">
2
- <defs>
3
- <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
- <stop offset="0" stop-color="#bd38df"/>
5
- <stop offset="1" stop-color="#5f1c70"/>
6
- </linearGradient>
7
- </defs>
8
- <g id="Group_22" data-name="Group 22" transform="translate(9.062 -181.365) rotate(11)">
9
- <path id="Path_14" data-name="Path 14" d="M6.264,2.145a.982.982,0,0,1,1.838,0l.79,3.538c.1.236.192.5.525.525l2.8.056a1,1,0,0,1,0,1.838L9.706,9.181a1,1,0,0,0-.525.525L8.1,15.222a1,1,0,0,1-1.838,0L5.186,9.706a1,1,0,0,0-.525-.525L2.145,8.1a1,1,0,0,1,0-1.838l2.782.1c.347.007.424-.289.525-.525Z" transform="matrix(-0.848, -0.53, 0.53, -0.848, 42.092, 197.282)" fill="url(#linear-gradient)"/>
10
- <path id="Polygon_2" data-name="Polygon 2" d="M3.07,2.145a1,1,0,0,1,1.838,0l.12.28a1,1,0,0,0,.525.525l.28.12a1,1,0,0,1,0,1.838l-.28.12a1,1,0,0,0-.525.525l-.12.28a1,1,0,0,1-1.838,0l-.12-.28a1,1,0,0,0-.525-.525l-.28-.12a1,1,0,0,1,0-1.838l.28-.12a1,1,0,0,0,.525-.525Z" transform="matrix(0.996, -0.087, 0.087, 0.996, 27.627, 185.251)" fill="url(#linear-gradient)"/>
11
- <path id="Polygon_3" data-name="Polygon 3" d="M4.712,4.147a.684.684,0,0,1,1.35,0h0a.684.684,0,0,0,.565.565h0a.684.684,0,0,1,0,1.35h0a.684.684,0,0,0-.565.565h0a.684.684,0,0,1-1.35,0h0a.684.684,0,0,0-.565-.565h0a.684.684,0,0,1,0-1.35h0a.684.684,0,0,0,.565-.565Z" transform="matrix(0.996, -0.087, 0.087, 0.996, 35.981, 190.046)" fill="url(#linear-gradient)"/>
12
- </g>
13
- </svg>