comand-component-library 4.2.2 → 4.2.5

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.
Files changed (31) hide show
  1. package/dist/comand-component-library.js +1576 -1525
  2. package/dist/style.css +1 -1
  3. package/package.json +2 -2
  4. package/src/ComponentLibrary.vue +3 -11
  5. package/src/components/CmdBox.vue +6 -6
  6. package/src/components/CmdCookieDisclaimer.vue +5 -5
  7. package/src/components/CmdCopyrightInformation.vue +4 -4
  8. package/src/components/CmdFakeSelect.vue +4 -4
  9. package/src/components/CmdFancyBox.vue +3 -3
  10. package/src/components/CmdFlexContainer.vue +109 -0
  11. package/src/components/CmdFormElement.vue +6 -0
  12. package/src/components/CmdFormFilters.vue +1 -1
  13. package/src/components/CmdImage.vue +1 -1
  14. package/src/components/CmdLink.vue +4 -0
  15. package/src/components/CmdLoginForm.vue +152 -3
  16. package/src/components/CmdMailToolEntry.vue +1 -1
  17. package/src/components/CmdMailToolFilter.vue +1 -1
  18. package/src/components/CmdMainNavigation.vue +1 -1
  19. package/src/components/CmdMultistepFormProgressBar.vue +13 -12
  20. package/src/components/CmdOpeningHours.vue +2 -2
  21. package/src/components/CmdSiteHeader.vue +4 -0
  22. package/src/components/CmdSlideshow.vue +6 -6
  23. package/src/components/CmdSmartSearch.vue +9 -2
  24. package/src/components/CmdSocialNetworks.vue +3 -3
  25. package/src/components/CmdSocialNetworksItem.vue +2 -2
  26. package/src/components/CmdSystemMessage.vue +10 -4
  27. package/src/components/CmdTable.vue +1 -1
  28. package/src/components/CmdTabs.vue +3 -3
  29. package/src/components/CmdThumbnailScroller.vue +1 -1
  30. package/src/components/CmdToggleDarkMode.vue +3 -3
  31. package/src/components/EditComponentWrapper.vue +5 -5
package/src/components/CmdSocialNetworksItem.vue CHANGED
@@ -164,11 +164,11 @@ export default {
164
164
  <style>
165
165
  .cmd-social-networks-item {
166
166
  .button {
167
- --social-network-text-color: var(--pure-white);
167
+ --social-network-text-color: var(--color-white);
168
168
  --social-network-text-color-highlighted: var(--social-network-color);
169
169
  --social-network-border-color: var(--social-network-color);
170
170
  --social-network-background-color: var(--social-network-color);
171
- --social-network-background-color-highlighted: var(--pure-white);
171
+ --social-network-background-color-highlighted: var(--color-white);
172
172
 
173
173
  background: var(--social-network-background-color);
174
174
  border-color: var(--social-network-border-color);
package/src/components/CmdSystemMessage.vue CHANGED
@@ -11,7 +11,7 @@
11
11
  v-if="iconClose.show && iconClose.iconClass"
12
12
  href="#"
13
13
  class="close-button"
14
- @click.prevent="showSystemMessage = false"
14
+ @click.prevent="hideSystemMessage"
15
15
  :title="iconClose.tooltip"
16
16
  >
17
17
  <!-- begin CmdIcon -->
@@ -136,6 +136,12 @@ export default {
136
136
  return null
137
137
  }
138
138
  },
139
+ methods: {
140
+ hideSystemMessage(event) {
141
+ this.showSystemMessage = false
142
+ this.$emit("hideSystemMessage", event)
143
+ }
144
+ },
139
145
  watch: {
140
146
  message() {
141
147
  this.showSystemMessage = true
@@ -173,7 +179,7 @@ export default {
173
179
  text-decoration: none;
174
180
  z-index: 100;
175
181
  line-height: 1;
176
- background: var(--pure-white);
182
+ background: var(--color-white);
177
183
  border-radius: var(--full-circle);
178
184
 
179
185
  [class*="icon-"] {
@@ -184,7 +190,7 @@ export default {
184
190
  background: none;
185
191
 
186
192
  [class*="icon-"] {
187
- color: var(--pure-white);
193
+ color: var(--color-white);
188
194
  }
189
195
  }
190
196
  }
@@ -201,7 +207,7 @@ export default {
201
207
  border-color: var(--hyperlink-color);
202
208
 
203
209
  [class*="icon-"] {
204
- color: var(--pure-white);
210
+ color: var(--color-white);
205
211
  }
206
212
  }
207
213
  }
package/src/components/CmdTable.vue CHANGED
@@ -350,7 +350,7 @@ export default {
350
350
  a[class*='icon-'] {
351
351
  &, &:hover, &:active, &:focus {
352
352
  font-size: var(--icon-size-small);
353
- color: var(--pure-white);
353
+ color: var(--color-white);
354
354
  }
355
355
  }
356
356
  }
package/src/components/CmdTabs.vue CHANGED
@@ -156,13 +156,13 @@ export default {
156
156
 
157
157
  &.active {
158
158
  span, [class*="icon-"] {
159
- color: var(--pure-white);
159
+ color: var(--color-white);
160
160
  }
161
161
 
162
162
  &:hover, &:active {
163
163
  a, a:focus {
164
164
  color: var(--hyperlink-color);
165
- background: var(--pure-white);
165
+ background: var(--color-white);
166
166
 
167
167
  span, [class*="icon-"] {
168
168
  color: var(--hyperlink-color-highlighted);
@@ -171,7 +171,7 @@ export default {
171
171
  }
172
172
 
173
173
  a:focus {
174
- color: var(--pure-white);
174
+ color: var(--color-white);
175
175
 
176
176
  span, span[class*="icon-"], .iconify {
177
177
  color: inherit !important;
package/src/components/CmdThumbnailScroller.vue CHANGED
@@ -448,7 +448,7 @@ export default {
448
448
  figcaption {
449
449
  background: var(--primary-color);
450
450
  opacity: 1;
451
- color: var(--pure-white);
451
+ color: var(--color-white);
452
452
  }
453
453
  }
454
454
 
package/src/components/CmdToggleDarkMode.vue CHANGED
@@ -263,7 +263,7 @@ export default {
263
263
  --yellow-hue: 60;
264
264
  --yellow-saturation: 100%;
265
265
  --yellow-lightness: 76.7%;
266
- background: radial-gradient(ellipse at center, var(--pure-white) 20%, hsl(var(--yellow-hue), var(--yellow-saturation), var(--yellow-lightness)) 30%, hsla(var(--yellow-hue), var(--yellow-saturation), var(--yellow-lightness), 0) 100%);
266
+ background: radial-gradient(ellipse at center, var(--color-white) 20%, hsl(var(--yellow-hue), var(--yellow-saturation), var(--yellow-lightness)) 30%, hsla(var(--yellow-hue), var(--yellow-saturation), var(--yellow-lightness), 0) 100%);
267
267
  border-color: transparent;
268
268
  box-shadow: 0 0 1rem hsl(var(--yellow-hue), var(--yellow-saturation), var(--yellow-lightness));
269
269
  }
@@ -290,9 +290,9 @@ export default {
290
290
  }
291
291
 
292
292
  &::after {
293
- background: radial-gradient(ellipse at center, var(--pure-white) 50%, var(--medium-gray) 100%);
293
+ background: radial-gradient(ellipse at center, var(--color-white) 50%, var(--color-medium-gray) 100%);
294
294
  border-color: transparent;
295
- box-shadow: .2rem .1rem .2rem hsla(var(--pure-white-hue), var(--pure-white-saturation), var(--pure-white-lightness), .3);
295
+ box-shadow: .2rem .1rem .2rem hsl(from var(--color-white) h s l / .3);
296
296
  }
297
297
  }
298
298
 
package/src/components/EditComponentWrapper.vue CHANGED
@@ -465,9 +465,9 @@ function buildComponentPath(component) {
465
465
  right: auto; /* avoids container to be stretched */
466
466
  flex-wrap: nowrap;
467
467
  border: var(--default-border);
468
- border-color: var(--pure-white);
468
+ border-color: var(--color-white);
469
469
  border-bottom: 0;
470
- background: var(--pure-white);
470
+ background: var(--color-white);
471
471
  border-radius: var(--default-border-radius);
472
472
 
473
473
  li {
@@ -542,8 +542,8 @@ function buildComponentPath(component) {
542
542
 
543
543
  &.active {
544
544
  //width: 100%; /* stretch inside flex-container */
545
- background: var(--pure-white);
546
- border-color: var(--pure-white);
545
+ background: var(--color-white);
546
+ border-color: var(--color-white);
547
547
  min-height: 2.5rem;
548
548
 
549
549
  .component-name {
@@ -554,7 +554,7 @@ function buildComponentPath(component) {
554
554
  &.cmd-form-element {
555
555
  :is(input[type="checkbox"], input[type="radio"]):checked {
556
556
  & ~ .label-text span {
557
- color: var(--pure-white);
557
+ color: var(--color-white);
558
558
  }
559
559
  }
560
560
  }