comand-component-library 4.0.2 → 4.0.4

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 (53) hide show
  1. package/README.md +32 -32
  2. package/dist/comand-component-library.js +3315 -1486
  3. package/dist/comand-component-library.umd.cjs +3 -4
  4. package/dist/index.html +16 -16
  5. package/dist/style.css +1 -1
  6. package/dist/styles/demopage-only.css +4 -0
  7. package/dist/styles/templates/casual.css +3 -0
  8. package/package.json +4 -4
  9. package/src/App.vue +2117 -0
  10. package/src/ComponentLibrary.vue +275 -610
  11. package/src/assets/data/fake-select-options.json +3 -2
  12. package/src/assets/data/form-elements.json +1 -1
  13. package/src/assets/styles/{global-styles.scss → component-library-global-styles.scss} +27 -14
  14. package/src/componentSettingsDataAndControls.vue +705 -0
  15. package/src/components/CmdAddressData.vue +1 -2
  16. package/src/components/CmdBox.vue +106 -52
  17. package/src/components/CmdCopyrightInformation.vue +5 -3
  18. package/src/components/CmdFakeSelect.vue +149 -78
  19. package/src/components/CmdFancyBox.vue +2 -2
  20. package/src/components/CmdFormElement.vue +62 -36
  21. package/src/components/CmdGoogleMaps.vue +5 -0
  22. package/src/components/CmdHeadline.vue +13 -5
  23. package/src/components/CmdIcon.vue +6 -2
  24. package/src/components/CmdImage.vue +6 -1
  25. package/src/components/CmdImageGallery.vue +15 -4
  26. package/src/components/CmdInputGroup.vue +87 -35
  27. package/src/components/CmdListOfLinks.vue +20 -7
  28. package/src/components/CmdListOfRequirements.vue +10 -18
  29. package/src/components/CmdLoginForm.vue +14 -2
  30. package/src/components/CmdMainNavigation.vue +5 -1
  31. package/src/components/CmdMultistepFormProgressBar.vue +13 -8
  32. package/src/components/CmdNewsletterSubscription.vue +18 -1
  33. package/src/components/CmdOpeningHoursItem.vue +1 -3
  34. package/src/components/CmdPagination.vue +5 -1
  35. package/src/components/CmdSiteFooter.vue +12 -2
  36. package/src/components/CmdSiteHeader.vue +2 -1
  37. package/src/components/CmdSlideButton.vue +7 -1
  38. package/src/components/CmdSlideshow.vue +33 -5
  39. package/src/components/CmdSocialNetworks.vue +18 -13
  40. package/src/components/CmdSocialNetworksItem.vue +5 -1
  41. package/src/components/CmdSystemMessage.vue +7 -1
  42. package/src/components/CmdTabs.vue +7 -7
  43. package/src/components/CmdTextImageBlock.vue +11 -2
  44. package/src/components/CmdThumbnailScroller.vue +23 -5
  45. package/src/components/CmdToggleDarkMode.vue +2 -2
  46. package/src/components/CmdTooltip.vue +50 -15
  47. package/src/components/CmdTooltipForFormElements.vue +96 -0
  48. package/src/components/CmdUploadForm.vue +29 -24
  49. package/src/components/CmdWidthLimitationWrapper.vue +1 -1
  50. package/src/components/ComponentSettings.vue +1 -1
  51. package/src/components/EditComponentWrapper.vue +1 -1
  52. package/src/main.js +2 -2
  53. package/src/assets/data/accordion.json +0 -45
package/src/assets/data/fake-select-options.json CHANGED
@@ -8,7 +8,8 @@
8
8
  "value": 2
9
9
  },
10
10
  {
11
- "text": "Option 3",
12
- "value": 3
11
+ "text": "Option 3 with icon",
12
+ "value": 3,
13
+ "iconClass": "icon-mail"
13
14
  }
14
15
  ]
package/src/assets/data/form-elements.json CHANGED
@@ -30,7 +30,7 @@
30
30
  "name": "form-element-password-name",
31
31
  "htmlClass": "form-element-password-class",
32
32
  "id": "form-element-password-id",
33
- "value": "default value",
33
+ "value": "",
34
34
  "fieldIconClass": "icon-cogs",
35
35
  "labelText": "Password input",
36
36
  "placeholder": "Placeholdertext",
package/src/assets/styles/{global-styles.scss → component-library-global-styles.scss} RENAMED
@@ -1,4 +1,4 @@
1
- /* global-styles.scss - last update: 2022/06/11 - IT IS NOT RECOMMENDED TO EDIT THIS FILE (TO AVOID TROUBLESHOOTING AFTER UPDATING) - DO CHANGES IN template.css ONLY */
1
+ /* component-library-global-styles.scss - last update: 2022/06/11 - IT IS NOT RECOMMENDED TO EDIT THIS FILE (TO AVOID TROUBLESHOOTING AFTER UPDATING) - DO CHANGES IN template.css ONLY */
2
2
 
3
3
  /* begin table of contents --------------------------------------------------------------------------------------------------------------------------------------------------- */
4
4
  /*
@@ -48,17 +48,30 @@ html {
48
48
  /* ---------------------------------------------- BEGIN COMPONENTS AND GLOBAL STYLES -------------------------------------------------- */
49
49
  /* begin styles for main structure --------------------------------------------------------------------------------------------------------------------------------------------------- */
50
50
  #page-wrapper {
51
- scroll-padding-top: 10.5rem;
52
51
  display: flex;
53
52
  flex-direction: column;
54
53
  scroll-snap-type: y mandatory;
55
- width: 100dvw;
56
- min-height: 100dvh;
54
+ overflow-y: scroll;
55
+ height: 100dvh;
57
56
  scroll-behavior: smooth;
57
+ scroll-padding-top: 11.7rem;
58
+ }
59
+
60
+ main {
61
+ flex: 1 0 auto;
62
+ }
63
+
64
+ html {
65
+ height: auto;
66
+ scroll-behavior: unset;
67
+ }
68
+
69
+
70
+ body {
71
+ height: auto;
58
72
  }
59
73
 
60
74
  #component-library {
61
- /*scroll-padding-top: unset !important;*/
62
75
  scroll-snap-type: unset !important;
63
76
  }
64
77
 
@@ -130,7 +143,7 @@ body.avoid-scrolling {
130
143
 
131
144
  &:hover, &:active, &:focus {
132
145
  border-color: var(--primary-color);
133
- background: var(--default-background-color);
146
+ background: var(--default-background);
134
147
  }
135
148
  }
136
149
 
@@ -291,26 +304,26 @@ html {
291
304
  &.light-mode {
292
305
  /* assign default colors for custom light-mode set by class */
293
306
  --color-scheme-text-color: var(--light-mode-text-color);
294
- --color-scheme-text-color-buttons: var(--light-mode-text-color-buttons);
295
- --color-scheme-background-color: var(--light-mode-background-color);
296
307
  --color-scheme-text-color-inverted: var(--dark-mode-text-color);
297
- --color-scheme-background-inverted: var(--dark-mode-background-color);
308
+ --color-scheme-text-color-buttons: var(--light-mode-text-color-buttons);
309
+ --color-scheme-background: var(--light-mode-background);
310
+ --color-scheme-background-inverted: var(--dark-mode-background);
298
311
  --default-background-color-lightness: 97%;
299
312
  }
300
313
 
301
314
  --color-scheme-text-color-buttons: var(--dark-mode-text-color-buttons);
302
315
  --color-scheme-text-color-inverted: var(--light-mode-text-color);
303
- --color-scheme-background: var(--dark-mode-background-color);
304
- --color-scheme-background-inverted: var(--light-mode-background-color);
316
+ --color-scheme-background: var(--dark-mode-background);
317
+ --color-scheme-background-inverted: var(--light-mode-background);
305
318
  --default-background-color-lightness: 20%;
306
319
 
307
320
  &.dark-mode {
308
321
  /* assign default colors for custom dark-mode set by class */
309
322
  --color-scheme-text-color: var(--dark-mode-text-color);
310
- --color-scheme-text-color-buttons: var(--dark-mode-text-color-buttons);
311
- --color-scheme-background-color: var(--dark-mode-background-color);
312
323
  --color-scheme-text-color-inverted: var(--light-mode-text-color);
313
- --color-scheme-background-inverted: var(--light-mode-background-color);
324
+ --color-scheme-text-color-buttons: var(--dark-mode-text-color-buttons);
325
+ --color-scheme-background: var(--dark-mode-background);
326
+ --color-scheme-background-inverted: var(--light-mode-background);
314
327
  --default-background-color-lightness: 20%;
315
328
  --hyperlink-color-lightness: 40%; /* hyperlink-color-lightness */
316
329
  --hyperlink-color-highlighted-lightness: 50%; /* hyperlink-color-highlighted-lightness (used for highlighted hyperlinks) */